37

In three.js, I want to add a mesh to a position in the scene

I've tried:

// mesh is a THREE.Mesh
scene is a THREE.Scene
scene.add(mesh)
scene.updateMatrixWorld(true)
mesh.matrixWorld.setPosition(new THREE.Vector3(100, 100, 100))
scene.updateMatrix()

BUT it didn't affect anything.

What should I do ?

Share a link to this question
CC BY-SA 3.0
88

i would recommend you to check the documenation over here: http://threejs.org/docs/#Reference/Objects/Mesh As you can see on the top of the docu-page, Mesh inherits from "Object3D". That means that you can use all methods or properties that are provided by Object3D. So click on the "Object3D" link on the docu-page and check the properties list. You will find propertie ".position". Click on ".position" to see what data-type it is. Paha..its Vector3.

So try to do the following:

//scene is a THREE.Scene
scene.add(mesh);
mesh.position.set(100, 100, 100);
Share a link to this answer
CC BY-SA 3.0
5
  • 21
    not only do you provide the answer. you also teach how to use the documentation! – Novalis Oct 17 '14 at 14:51
  • 4
    This is the correct answer. Use mesh.position.set(x,y,z) because you will do not need force updating, if you set mesh.position = xxx, you only changing the object attribute, not always moving object in scene real time. position.set is more coplex and always move object to destination and refresh buffer, lights, shadows etc ... in once. – Martin Apr 5 '15 at 8:28
  • I tried this, and cannot figure out what it is actually doing. If I draw a point, it is in the correct place. But if I create a mesh, and try to set the position, it just appears in some apparently random place. – Zendel May 9 '16 at 20:43
  • 2
    in my case : mesh.position does not change the position. but the mesh.position.set(x,y,z) as mentioned by Martin works perfectly. – alvaro562003 Mar 21 '17 at 11:28
  • In the case of a complex mesh, position refers of what? Some kind of "center"? – user9315861 Jul 22 '18 at 17:16
31

i saw it on a github earlier. (three.js r71 )

mesh.position.set(100, 100, 100);

and can be done for individuals

mesh.position.setX(200);  
mesh.position.setZ(200); 

reference: https://threejs.org/docs/#api/math/Vector3

detailed explanation is below:

since mesh.position is "Vector3". Vector3() has setX() setY() and setZ() methods. we can use it like this.

mesh.position = new THREE.Vector3() ; //see position is Vector3()
vector1 = new THREE.Vector3();   

mesh.position.setX(100);  //or  this
vector1.setX(100)         // because all of them is Vector3()
camera1.position.setZ(100); // or this
light1.position.setY(100)   // applicable to any object.position
Share a link to this answer
CC BY-SA 4.0
4
  • 1
    This works for me, while the chysmann's answer doesn't, though I can't explain why it doesn't/wouldn't. Can you elaborate on what you meant by "saw it on github"? – Nate Mar 22 '15 at 15:49
  • i saw it on a github three.js page . but icant find the source right now – bh_earth0 Mar 24 '15 at 12:46
  • 3
    This is the correct answer. Use mesh.position.set(x,y,z) because you will do not need force updating, if you set mesh.position = xxx, you only changing the object attribute, not always moving object in scene real time. position.set is more coplex and always move object to destination and refresh buffer, lights, shadows etc ... in once. – Martin Apr 5 '15 at 8:31
  • 1
    This is the correct answer. As of R69 (the latest distribution available from Google CDN) attempting to assign a value to mesh.position should not be done as it is read only, resulting in Uncaught TypeError: Cannot assign to read only property 'position' of [object Object]. – MLK.DEV Apr 14 '15 at 19:38
3

I prefer to use Vector3 to set position.

   let group = new THREE.Group();

   // position of box
   let vector = new THREE.Vector3(10, 10, 10);
   
     // add wooden Box
   let woodenBox = new THREE.Mesh(boxGeometry, woodMaterial);

    //update postion
    woodenBox.position.copy(vector);

  // add to scene
   group.add(woodenBox)
   this.scene.add(group);
Share a link to this answer
CC BY-SA 4.0
3
0

If some one looking for way to update position from Vector3

const V3 = new THREE.Vector3(0,0,0)            // Create variable in zero position
const box = new THREE.Mesh(geometry, material) // Create an object
Object.assign(box.position, V3)                // Put the object in zero position
Share a link to this answer
CC BY-SA 4.0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.