javascript - three.js ワイヤーフレームのみの形状で、エッジが隠れている破線

Question

three.js で特定のタイプの 3D オブジェクトを作成しようとしています。たとえば、ワイヤーフレーム モードの立方体が必要です (したがって、エッジのみが表示されます)。しかし、後ろにあるエッジを破線にしたい. 図：

これが three.js で実現可能かどうか、または webgl で直接試す必要があるかどうかはわかりません。THREE.Meshワイヤーフレームで使用するかTHREE.Line、LineDashedMaterialまたは両方を重ねて使用する必要がありますか?

Answer 1

なんとかできました。3 つのオブジェクトを作成する必要があります。

1 番目のオブジェクト: ソリッド 3D オブジェクト (エッジではなく面を意味します)

2 番目のオブジェクト: 破線以外のすべてのエッジ

3 番目のオブジェクト: 通常以外のすべてのエッジ (破線ではない)

1つ目のオブジェクトは でマテリアルを設定しcolor: false, side: THREE.DoubleSide, depthTest: trueます。

2 番目のオブジェクト マテリアル: color: (whatever you like), depthTest: false.

3 番目のオブジェクト マテリアル: color: (whatever you like), depthTest: true.

polygonOffset: true, polygonOffsetFactor: 1, polygonOffsetUnits: 1また、Z ファイティングをなくすために、すべてのマテリアルを で設定しました。

Answer 2

これは本当に素晴らしいアイデアです。上記のとおり、次の場所で回答を実装しました。

http://stemkoski.github.com/Three.js/Dashed-3D.html

誰かが実際にそれを見たい場合に備えて。