Three.js: Method to convert wireframe of geometry to a THREE.Line?

1
votes

Looking at the source code of the example

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

It seems that to use a dashed line material, you need a THREE.Line object, but the objects used in this example were generated by rather case-specific methods.
However, one can easily create a mesh with a wireframe texture, which leads me to believe there must be an easy way (a method I have not yet found?) that converts the vertex information of a Geometry object (for example, a CubeGeometry) to a modified Geometry object suitable for use in THREE.Line which could recreate the wireframe (but with, say, dashed lines). Any ideas?

Thanks in advance!

1
three.js

1 Answers

4
votes

You can convert an existing geometry having faces to one appropriate for rendering dashed lines with a function like the one below. Use the new geometry to construct a THREE.Line having type 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;

}

three.js r.56