Three.js。将线连接到立方体的角上，使其与角的角度相同。

Question

我已经成功地使用1x1x1 BoxBufferGeometry将线连接到一个立方体的所有角落。8条线中的每一条都有到顶点，所以每条线都连接到立方体的8个角上，但我不知道如何确定其他顶点的位置（可以是任何距离），这些顶点会相对于立方体的角度伸出相同的角。

由于我知道立方体角的所有顶点位置，我可以找到角顶点相对于对角线角顶点的相反角度，但我不知道如何推导，或者是否可能。

如果我知道立方体本身的xyz角，有没有可能找到立方体的角顶点的角度？

然后如果我最终找到了这个角度，能不能让线的另一边顶点位置远离角的角度和一定的距离？

    // Get world matrix transformation of the box
    var boxMatrix = cube.matrixWorld;

    var cornerIndex = 0;

    var cornerArr = [
    {w: 1, h: 1, d: 1},
    {w: 1, h: 1, d:-1},
    {w: 1, h:-1, d: 1},
    {w: 1, h:-1, d:-1},
    {w:-1, h: 1, d: 1},
    {w:-1, h: 1, d:-1},
    {w:-1, h:-1, d: 1},
    {w:-1, h:-1, d:-1},
    ];


    lines.forEach(function(line) { // there are 8 lines for 8 cube corners

        var a = 0;

        let cornerOffset = cornerArr[cornerIndex];

        line.geometry.vertices.forEach(function(lineVertex) {

            // Set the initial position of the desired vertex into a Vector3
            var cornerVertex = new THREE.Vector3(cornerOffset.w / 2, cornerOffset.h / 2, cornerOffset.d / 2);

            // Apply the matrix transformation to the vector
            cornerVertex.applyMatrix4(boxMatrix);

            if(a===0){ // attach line to cube corner

                // Set line vertex position to the cube's corner vertex position 

                lineVertex.x = cornerVertex.x;
                lineVertex.y = cornerVertex.y;
                lineVertex.z = cornerVertex.z;

            }else{

                // here I want to set the other lineVertex position, but I don't know how

                var oppositeCornerVertex = new THREE.Vector3(-(cornerOffset.w / 2), -(cornerOffset.h / 2), -(cornerOffset.d / 2));

            }

            a+=1;
        });

        line.geometry.verticesNeedUpdate = true;

        cornerIndex += 1;

    });

我试着使用Marquizzo描述的multiplyScalar，但得到的是这样的结果。

代码：

var scale = 3;

// Copy the corner position
var farCornerVertex = cornerVertex.clone();

// Apply scale to (x, y, z) equally to "expand" the cube
farCornerVertex.multiplyScalar(scale);

// Apply the matrix transformation AFTER getting the position of the far corner
cornerVertex.applyMatrix4(boxMatrix);
farCornerVertex.applyMatrix4(boxMatrix);

lineVertex = farCornerVertex

Answer 1

用Vector3很直接，只要你的立方体的中心还是在 (0, 0, 0):

var scale = 2;
var cornerVertex = new THREE.Vector3(w, d, h);

// Copy the corner position
var farCornerVertex = cornerVertex.clone();

// Apply scale to (x, y, z) equally to "expand" the cube
farCornerVertex.multiplyScalar(scale);

// Apply the matrix transformation AFTER getting the position of the far corner
cornerVertex.applyMatrix4(boxMatrix);
farCornerVertex.applyMatrix4(boxMatrix);

请注意，我正在进行缩放 之前 适用于 Matrix4 因为立方体的中心必须在(0，0，0)，这样才能使 multiplyScalar() 以扩展出中心。

下面是这个概念的二维图。