3つのjs内のメッシュグループのビューポートを作成する最良の方法は何ですか?
私の場合、多くのインスタンスのTHREE.Group
があります。私の目標は、メッシュが表示されるこのグループのビューポートを作成することです。
私が見ているソリューションの1つは、ローカルクリッピングプレーンを使用することです。 threejs example
しかし、THREE.Group
のために一度設定するのではなく、THREE.Mesh
の素材ごとにクリッピングプレーンを割り当てなければならないと心配です。
また、移動または回転するときにクリッピングプレーンを再カットする必要がありますTHREE.Group
。あなたはステンシルバッファに見ることができる3js内のメッシュグループのWiewポート
0
A
答えて
0
:threejs付きまたはなし
、原理は同じです。
- 無効深書き込み
- 無効深度テスト
- 無効に色が
- ステンシル操作(ステンシルバッファに値を書き込む)
- は、ステンシルバッファへの書き込みは見えない形状(あなたを描く有効を書きますおそらくスクリーンスペースが必要です)
- enable 1,2,3
- ステンシル操作の変更(たとえばステンシルバッファが1の場合の描画のみ)
- あなたがこれをやっているとき、あなたはここに
- ステンシルオペアンプを変更して、バッファが0(5からその形状の外)でのシーンの残りの部分を描くことができに応じて、あなたのグループ
- を描く
Three.jsには、最近実装されていない限り、ステンシル抽象はありません。つまり、実際にこれを自分で管理しなければならないと言う、transparent
の "魔法のような"特性はありません。つまり、webglのコンテキストを取得し、webglの操作を手動で行う必要があります。
これを実行する方法はたくさんあります。
var myScreenSpaceQuad = new THREE.Mesh(new THREE.PlaneBufferGeometry(2,2,1,1), myQuadShaderMaterial)
var scene1 = new THREE.Scene()
var scene2 = new THREE.Scene()
var sceneMask = new THREE.Scene()
sceneMask.add(myScreenSpaceQuad)
//...
myRenderFunction(){
//gl stencil op
//...
myRenderer.render(myCamera, sceneMask)
//more stencil
//...
myRenderer.render(myCamera, scene1)
//some more stencil...
myRenderer.render(myCamera, scene2)
}
私は実際の例を書こうとします。スクリーンスペースクワッドについては、thisをご覧ください。
関連する問題
- 1. 3jsのシリンダーへのマッピング
- 2. 3JS Object3Dローテーション
- 3. 3JS内のJsonファイルを正しくロードする方法
- 4. 3js/webGLを学ぶ - 色と透明度
- 5. 3jsポイントをドラッグする方法
- 6. URL内のポート番号を除外 - Angular2
- 7. カメラのposition.zを3jsのマウスホイールで変更してください
- 8. 3jsレンダリング関数内のwhileループがすべてのフレームを更新しないのはなぜですか?
- 9. バンプマップの品質を3jsで改善する
- 10. 添付画像のように3jsでグリッドを作るには?
- 11. インポートしたモデルを3jsの画面に合わせる
- 12. インポートされた* .objの面を3jsで移動する
- 13. mapboxに3jsの建物を置く方法
- 14. nginxの他のポートにのみポート80
- 15. URL末尾なし/内部ポートは
- 16. ウィンドウ内のCOMポートのFIFOバッファの役割
- 17. "ポートのポートまたはポートが不正です
- 18. 3jsは軌道制御でマウスイベントを追加します
- 19. オクルージョンカリングがデフォルトで3jsで有効にされています
- 20. ポート9922で動作するものの内部IP範囲VBNet
- 21. htaccessポートから別のポートへリダイレクト
- 22. ポート8000とポート8080
- 23. MATLABファンクションブロック内のCコードにマイクロコントローラのポート機能とポート番号を書き込む方法は?
- 24. は3JSシーンのブレンダーモデルを読み込むことができません
- 25. Parrot VMのポート
- 26. ポート25のブロック
- 27. AtomicLong.lazySetのC++ポート
- 28. Dockerのポート
- 29. herokuappのポート
- 30. Mono.ZeroconfのOSXポート
「ビューポート」が意味することは不明です。 – 2pha
@ 2pha HTML5のブロックオーバーフローのような振る舞いを望みます:隠されていますが、THREE.Groupの場合のみ –
達成しようとしていることをより明確に説明する必要があります。 – 2pha