1

サンプルのソースコードを見る

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

破線マテリアルを使用するには THREE.Line オブジェクトが必要なようですが、この例で使用されているオブジェクトはかなりケース固有のメソッドによって生成されています。
ただし、ワイヤフレーム テクスチャを使用してメッシュを簡単に作成できるため、Geometry オブジェクト (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;

}

three.js r.56

于 2013-03-09T23:25:30.643 に答える