javascript - 三个 JS 画线作为对象的子对象指向与对象或父对象无关的 Vector

Question

我有一个对象作为父/子的场景。

我需要定义一个 Vector3 相对于(最深的)child 对象，它指向场景中的矢量(look_point)。

var grandParent = new THREE.Object3D();
var parent = new THREE.Object3D();
var child= new THREE.Object3D();

var look_point = new THREE.Vector3();

grandParent.position.set(9,5,3);
grandParent.rotation.set(1,2,3);

parent.position.set(5,8,3);
parent.rotation.set(2,1,3);

child.position.set(2,5,3);
child.rotation.set(3,2,1);

scene.add(grandParent);
grandParent.add(parent);
parent.add(child);



var m = new THREE.LineBasicMaterial({ color: 0xFF00FF, blending: THREE.AdditiveBlending,  transparent: true, opacity: 1, depthTest: false })

/// draw line in scene
var v = new THREE.Vector3().copy(child.position);
    v = parent.localToWorld(v);
    v = grandParent.localToWorld(v);

var g = new THREE.Geometry();

    g.vertices.push(new THREE.Vector3().copy(v)); 
    g.vertices.push(new THREE.Vector3().copy(look_point));   


scene.add(new THREE.Line(g,m));    

// how to get relative points to draw line with child object as a parent

var g2 = new THREE.Geometry();

    g2.vertices.push(???); //// how to get Vector3 relative to child pos and rot?
    g2.vertices.push(new THREE.Vector3());   

child.add(new THREE.Line(g2,m));  

Answer 1

如果 look_point 在世界坐标系中，那么您需要将这些点转换为 child 的局部坐标系。

您可以使用 Object3D.worldToLocal 函数来实现这一点。这是一个粗略的想法:

// ensure the world matrices are all up to date
scene.updateMatrixWorld(true);

g2.vertices.push(child.worldToLocal(new THREE.Vector3().copy(v)));
g2.vertices.push(child.worldToLocal(new THREE.Vector3().copy(look_point)));   
child.add(new THREE.Line(g2,m));

重要的是要确保所有世界矩阵都已提前计算。让我知道这是否适合您!