Question

我想在我的3D世界中绘制一条路径，但是这一行没有用。谁能帮我？！像this image

一样

现在我修正了我的问题

我想画一条路径，并用纹理填充

var SUBDIVISIONS = 20;
geometry = new THREE.Geometry();
var curve = new THREE.QuadraticBezierCurve3();
curve.v0 = new THREE.Vector3(0, 0, 110);
curve.v1 = new THREE.Vector3(0, 200, 110);
curve.v2 = new THREE.Vector3(200, 200, 110);
for (j = 0; j < SUBDIVISIONS; j++) {
    geometry.vertices.push( curve.getPoint(j / SUBDIVISIONS) )
}

material = new THREE.LineBasicMaterial( { color: 0xff0000, linewidth: 5 } );
line = new THREE.Line(geometry, material);
scene.add(line);

这种方式有两个问题1：Windows上不支持线宽，2：LineBasicMaterial不支持纹理

所以我在google上搜索找到Class.MeshLine。 linewidth是好的，但纹理映射不好。那里的纹理代码：var loader = new THREE.TextureLoader(); loader.load( 'assets/images.png', function( texture ) { strokeTexture = texture; strokeTexture.wrapS = strokeTexture.wrapT = THREE.RepeatWrapping; strokeTexture.repeat.set( 5, 1); strokeTexture.needsUpdate = true; init() } ); 无论设置纹理和MeshLineMaterial，结果都不是我想要的结果图像：result image

Answer 1

查看https://github.com/spite/THREE.MeshLine - 它是基于网格的线条的实现。另请注意该网站上的参考资料，可以为您提供一些见解。

否则，您可能希望从该行创建一个形状。这可以使用THREE.ShapeGeometry - 类来完成。

Threejs绘制纹理的路径

1 个答案: