1

查看示例的源代码

http://mrdoob.github.com/three.js/examples/webgl_lines_dashed.html

似乎要使用虚线材质,您需要一个 THREE.Line 对象,但本示例中使用的对象是通过特定于案例的方法生成的。
但是,可以很容易地创建带有线框纹理的网格,这让我相信一定有一种简单的方法(我还没有找到一种方法?)可以转换几何对象(例如,CubeGeometry)的顶点信息到适合在 THREE.Line 中使用的修改后的 Geometry 对象,该对象可以重新创建线框(但带有虚线)。有任何想法吗?

提前致谢!

4

1 回答 1

4

您可以使用如下所示的函数将具有面的现有几何图形转换为适合渲染虚线的几何图形。使用新几何构造THREE.Line具有类型THREE.LinePieces

function geo2line( geo ) {

    var geometry = new THREE.Geometry();
    var vertices = geometry.vertices;

    for ( i = 0; i < geo.faces.length; i++ ) {

        var face = geo.faces[ i ];

        if ( face instanceof THREE.Face3 ) {

                vertices.push( geo.vertices[ face.a ].clone() );
                vertices.push( geo.vertices[ face.b ].clone() );
                vertices.push( geo.vertices[ face.b ].clone() );
                vertices.push( geo.vertices[ face.c ].clone() );
                vertices.push( geo.vertices[ face.c ].clone() );
                vertices.push( geo.vertices[ face.a ].clone() );

        } else if ( face instanceof THREE.Face4 ) {

                vertices.push( geo.vertices[ face.a ].clone() );
                vertices.push( geo.vertices[ face.b ].clone() );
                vertices.push( geo.vertices[ face.b ].clone() );
                vertices.push( geo.vertices[ face.c ].clone() );
                vertices.push( geo.vertices[ face.c ].clone() );
                vertices.push( geo.vertices[ face.d ].clone() );
                vertices.push( geo.vertices[ face.d ].clone() );
                vertices.push( geo.vertices[ face.a ].clone() );

        }

    }

    geometry.computeLineDistances();

    return geometry;

}

三.js r.56

于 2013-03-09T23:25:30.643 回答