CODEWITHSUNDEEP
javascriptthree.js
Aquarius_Girl
Aquarius_Girl

Reputation: 22906

How to use verticesNeedUpdate in threejs to update the vextices of a 3D cube?

var geometry = new THREE.BoxGeometry( 500, 500, 500 );
scene.add( geometry );

var geo = new THREE.EdgesGeometry( geometry );
scene.add( geo );

var mat = new THREE.LineBasicMaterial( { color: 0xffffff, linewidth: 2 } );
scene.add( mat );

var wireframe = new THREE.LineSegments( geo, mat );
scene.add( wireframe );

geometry.vertices[0].set( 30, 100, 3 );
geometry.verticesNeedUpdate = true;

geometry.vertices[1] = new THREE.Vector3( 300, 300, 3 );
geometry.verticesNeedUpdate = true;

camera.position.z = 1000;        
renderer.render(scene, camera);

The above code doesn't change the vertices displayed on the screen.
In this code where am I supposed to put verticesNeedUpdate to see the changed vertex position of the displayed cube?

Upvotes: 1

Views: 191

Answers (1)

soju
soju

Reputation: 25312

You should read this : https://threejs.org/docs/#manual/en/introduction/How-to-update-things

Here is a working example : 

var geo = new THREE.EdgesGeometry( new THREE.BoxGeometry( 500, 500, 500 ) );
var mat = new THREE.LineBasicMaterial( { color: 0xffffff, linewidth: 2 } );
var wireframe = new THREE.LineSegments( geo, mat );
scene.add( wireframe );

wireframe.geometry.attributes.position.array[0] = 300;
wireframe.geometry.attributes.position.array[1] = 300;
wireframe.geometry.attributes.position.array[2] = 3;
wireframe.geometry.verticesNeedUpdate = true;

PS: you just have to add your Object3D to your scene, not geometry and material !

Upvotes: 2

Related Questions