CODEWITHSUNDEEP
javascriptthree.js
user1783292
user1783292

Reputation: 538

How can I set the position of a mesh before I add it to the scene in three.js

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

I've tried:

// mesh is an instance of THREE.Mesh
// scene is an instance of 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 ?

Upvotes: 50

Views: 116915

Answers (4)

chsymann
chsymann

Reputation: 1680

I would recommend you to check the documentation 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 the property ".position". Click on ".position" to see what data-type it is. Paha..its Vector3.

So try to do the following:

// scene is an instance of THREE.Scene
scene.add(mesh);
mesh.position.set(100, 100, 100);

Upvotes: 108

user1272500
user1272500

Reputation:

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

OR

const V3 = new THREE.Vector3(0,0,0)            // Create variable in zero position
const box = new THREE.Mesh(geometry, material) // Create an object
box.position.copy(V3)

Upvotes: 2

Hitesh Sahu
Hitesh Sahu

Reputation: 45140

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);

Upvotes: 12

bh_earth0
bh_earth0

Reputation: 2842

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

Upvotes: 37

Related Questions