I want to create group of lines. First line:
var geometry = new THREE.Geometry();
itemLine = new THREE.Line( geometry, material );
Current geometry:
geometry.vertices[0]
Object { x: -540, y: 50, z: 0 }
After, i create group and set position:
item = new THREE.Group();
item.attach(itemLine);
item.position.set( centerPoint.x, centerPoint.y, 0 );
centerPoint is not (0,0,0)
After create group and attach children i saw in console:
geometry.vertices[0]
Object { x: -540, y: 50, z: 0 }`
Vertices not updated! I want new coords (local and world), with offset position of group.
Geometry.vertices defines the geometry in local space. It does not matter if you transform the 3D object or its ancestors, the vertices will always keep the same values.
You can achieve your desired result by transforming the vertices to world space via the lines world matrix. Here is a complete example code of this workflow.
var geometry = new THREE.Geometry();
geometry.vertices.push( new THREE.Vector3( 0, 0, 0 ) );
geometry.vertices.push( new THREE.Vector3( 1, 0, 0 ) );
var material = new THREE.LineBasicMaterial( { color: 0xff0000 } );
var lines = new THREE.Line( geometry, material );
var group = new THREE.Group();
group.add( lines );
group.position.set( 2, 0, 0 );
group.updateMatrixWorld(); // update world matrices of the hierarchy of 3D objects
scene.add( group );
const vertex = new THREE.Vector3();
vertex.copy( geometry.vertices[ 0 ] ).applyMatrix4( lines.matrixWorld );
console.log( vertex ); // prints {x: 2, y: 0, z: 0}
Demo: https://jsfiddle.net/sy6ur1x7/
three.js R112
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With