在three.js

Question

我使用xyz点列表画了一行，如下所示

for (var i = 0, len = vertices.length - 1; i < len; i++) {
        vertex = vertices[i];
        geometry = new THREE.CubeGeometry(width+7, height, 1);
        geometry.computeVertexNormals(); 
        //material = new THREE.MeshBasicMaterial({ color: 0xff3333, shading: THREE.FlatShading, wireframe: true, transparent: true });            
        //Initializing MeshNormalMaterial to get the 3d Line Geometry
        material = new THREE.MeshBasicMaterial({ color: 0xEB9180 });
       
        mesh = new THREE.Mesh(geometry, material);
        mesh.position = vertex;
        mesh.lookAt(vertices[1 + i]);
        length = vertex.distanceTo(vertices[1 + i]);
        mesh.scale.set(1, 1, length + width);
        mesh.translateZ(0.5 * length);
        segments.add(mesh);
    }

使用xyz点列表动态创建的行：

现在我想在行上放置一个图像图标，该图标应遍历整行，如下所示

Answer 1

我建议您使用THREE.Sprite()对象作为图标。你可以给它一个纹理。

至于沿着线移动它，只需调整Sprite的.position值以跟随顶点数组。我把速度管理留给你了！