1

three.js を使用してレンダリングされたかなり単純なシーンがあります。MRI のように、シーンの一部だけをレンダリングしようとしています。

テスト用に 2 つのバージョンのシーンを作成しました。

  1. パースペクティブバージョン、これはうまく機能しています
  2. 特定の平面上のシーンのスライスのみである正投影バージョン

正投影シーンのレンダリングは問題ありません。クリッピング プレーンを使用してスライスをキャプチャしようとしましたが、機能しません。完全に白い画面またはモデル全体が表示されます。

これが私が達成したいと思っていることのトップダウンビューです：

100 *----------------------------------*
    |                                  |
    |                                  |
    |                                  |
    |                                  |
    ####################################  <-- Capture this slice of 100 units width
    |                                  |
    |                                  |
    |                                  |
    |                                  |
 0  *----------------------------------*
    0                                  100





                    \  /
                     \/
                   CAMERA roughly @ (50, -100)

明らかな何かが欠けている可能性は十分にあります。私の 3D 背景はまあまあですが、専門家ではありません。

Three.js / WebGLでこれを行う最善の方法は何ですか? カメラに最適な場所はどこですか?

PS: はい、一部のプリミティブのスライスがうまく機能しないことは承知しています。かなり安全にスライスできると予想される線と点から構築されたモデルを使用しています。オブジェクトを半分にカットすることは、私にとってそれほど問題ではありません。

4

1 に答える 1

2

その答えは、カメラの配置にあることが判明しました。後から考えると、透視投影に必要なカメラをシーンから後退させてはならないことは明らかでした。モデルの端にカメラを配置するとうまくいき、クリッピング プレーン (近距離、遠距離) が適切に機能しました。

例えば：

    Z
100 *----------------------------------*
    |                                  |
    |                                  |
75  |                                  |
    |                                  |
    |                                  |
50  |                                  |
    |                                  |
    |                                  |
25  ####################################  <-- Capture this slice of 5 units
    |                                  |      width @ z = 25
    |                                  |
 0  *-----------------X----------------* Y
    0                 .                100
                      .
                      .
                   CAMERA is here at (50,0)
                   near = 25
                   far  = 30 (for width 5, ie: 25 + 5)
于 2013-03-29T21:41:20.270 に答える