問題タブ [threecsg]

序文: Three-CSGを使用して、Three.js でジオメトリをマージしようとしています。

Uncaught ThreeBSP: Given geometry is unsupportedTHREE.Mesh のインスタンスをライブラリのメソッドに渡すと、エラーがスローされますThreeBSP。

このエラーが発生する理由はありますか? 以下にコードのスニペットを示します。ライブラリ メソッドに渡すオブジェクトは、js ファイル内trueの from として評価されるinstanceof THREE.Meshため、コードがエラーをスローする理由がわかりません。どんな助けでも大歓迎です！

コンソール エラーへのリンク

ありがとう、ジェームズ。

現在、形状を作成し、その形状に対して複数の CSG 操作を実行するために three.js ジオメトリ クラスを使用しています。したがって、継続的に形状を再描画します。

複数の csg 操作を実行するこのプロセスは低速です。レイキャスティングを使用してクリック時に形状を取得し、選択した形状と事前定義された形状 (任意の形状またはジオメトリ) の CSG を実行しているためです。

だから私の質問は：

• THREE.BufferGeometryバッファ ジオメトリを使用すると CSG が高速化されますが、インスタンスで CSG 操作を実行するライブラリはありますか?

• 他の方法を使用してプロセスを高速化する方法はありますか?

これは私のコードフローです:

このライブラリを CSG 操作に使用しています。全体的なフローは、three.js の例のこの例と似ています。

three.js の STLLoader 関数を使用してロードした心臓モデルの断面を取得しようとしています。現在、このスタック オーバーフローの投稿と同じように、 csg.jsライブラリにThreeCSGラッパーを使用しようとしています。

csg減算のコードは次のとおりです

stl モデルをロードし、ローダーのコールバック関数でメッシュを差し引きます。私が得ているエラーは、ThreeCSG ラッパー ファイルの 34 行目にあり、

ThreeCSG.js:34 Uncaught TypeError:未定義のプロパティ「長さ」を読み取ることができません

これは、(a) ThreeCSG を適切に使用していない、(b) コードの別の場所で減算を行う必要がある、または (c) STL 形式のモデルがサポートされていないためだと推測しています。

いずれにせよ、私は完全に困惑しており、three.js の使用経験が豊富な人のアドバイスをいただければ幸いです。

スタンドアロンの ThreeCSG.js ( https://github.com/chandlerprall/ThreeCSG ) を使用してさまざまな形状を作成しましたが、作成しようとしているいくつかの形状でエラーが発生しています: 最大呼び出しスタックを超えました。

リポジトリが更新されていないようなので、問題なく形状を作成するCSG-wrapper ( https://github.com/kraag22/csg-wrapper ) を試しましたが、THREE.JS ではかなり古くなっています。

他に使用できる CSG ライブラリはありますか? または、最新の CSG ( https://github.com/evanw/csg.js ) の 1 つのラッパーですか?

レポに関する私の2つのレポート：

https://github.com/kraag22/csg-wrapper/issues/3 https://github.com/chandlerprall/ThreeCSG/issues/23

2 つのジオメトリ/メッシュ (赤と青) を 1 つにマージしようとしています。しかし、新しいジオメトリを作成し、geometry.merge() を適用した後、すべての内側の頂点と面がまだそこにあることがわかりました (緑色の領域)。

レンダリングされた面に視覚的な不具合が発生し、マージされたボリュームを正しく計算できないため、余分な情報をすべて削除したいと思います.最後の写真のようなものが必要です。最小限の外部/外部のみを含む単一のメッシュ面と頂点を削除し、内側のものを削除します。

ThreeCSG を適用してメッシュを差し引いてみましたが、大きなモデルを読み込もうとすると常にクラッシュすることがわかりました。また、共通の顔を検出するためにレイキャスターを適用しようとしましたが、これも大きなモデルのパフォーマンスに大きな影響を与えます。

ここでは、ThreeCSG が唯一の適切なオプションですか? しかし、すべてのモデルで使用できるわけではないので、破棄する必要があります。メッシュの三角形の数にあまり依存しない高速なものを適用したいと思います。

私はthree.jsを学んでおり、プロジェクトのために円柱と球の間に交差を作成する必要があります。コードの興味深い部分は次のとおりです。

ここに私の2つのオブジェクトがあります:

円柱と球

....そして結果:

シリンダーの後.減算（球）...奇妙な結果

円柱と球の間の減算がこれらの結果をもたらす理由がわかりません。

前もって感謝します ：）

PS : three.js r74 と threeCSG の最新バージョンを使用しています。CSG が r74 バージョンでメッシュの位置を維持することは不可能です...しかし、three.js のバージョンを変更することはできません ^^''

この特定のオブジェクトの「結果」で MeshLambertMaterial を取得したいと思います。これは、2 つのメッシュを結合した後に得られます。

ここにボックスと latheGeometry があります。結合が完了すると、ランダムな単色の醜いオブジェクトが得られます。代わりに、LambertMaterial の白色オブジェクトを取得する必要があります。

画像: http://imgur.com/a/nbSq1

私は ThreeJS を 4 か月間学習し、個人的なプロジェクトに適用しています。昨日、ほとんどの ThreeJS ジオメトリといくつかの CSG トリックを使用して要塞を構築することに成功しました。結果は問題ないように見えますが、私は精度が好きで、私のジオメトリはちょっと混乱しています (主に CSG 減算後)。

[質問] 2 つのジオメトリをマージし、その古い面を新しい計算された面に置き換える既知の方法があるのだろうか? 私の質問を説明するJSFiddleがあります。

[編集: フィドルを 4 番目と 5 番目のメッシュで更新]

同じメッシュを取得する 3 つの方法

1. 左側の最初のメッシュは、3 つの boxGeometry で構成される基本的な結合ジオメトリです。
2. 中央の 2 番目のメッシュは、mergeVertices() 関数を呼び出した後のまったく同じメッシュです。その結果、4 つの頂点が保存されます。しかし、メッシュ内の面はまだそこにあります。(私にとって) 見栄えが悪いだけでなく、これらのパーツのテクスチャリングやライティングの問題も発生します (顔の法線が本来あるべき場所にありません)。
3. 右側の最後のメッシュは、マージ後に予想されるメッシュです。中央のボックスの下にある面を見てください。

それがテクスチャとライティングの問題につながるという事実 (JSFiddle を見てください。メッシュの内側の部分を照らします) は、これを解決するためのシンプルでよく知られた方法であるに違いないと思いますが、私はただのように感じています。大きなノブ。

この問題は、SOに関する回答が見つからない（または理解できない）場合に尋ねる別の質問に直接リンクしています（なぜ私がそれをしたいのかを理解するのに役立つかもしれません）：適用する方法はありますか各ジオメトリの各面に固有のマテリアルを作成せずに、このマージされたジオメトリにテクスチャを作成します (UV マッピングとメッシュ サイズが異なるため)。巨大な要塞の各面を手作業で行うとは想像できません...

[編集]私の質問を書いて、ThreeCSG とそのunion()機能がうまくいくことに気付きました。しかし、それが作成する頂点の混乱は好きではありません。これらのボックスのような基本的なジオメトリの場合でも、ThreeCSG は、すべてが正常なジオメトリの一部に奇妙な頂点と面を作成します。

JSFiddle を 4 番目のメッシュ (CSG) で更新しました。この単純な使用例では、予想よりも 2 つの頂点と 2 つの面があることがわかります。古い顔を保っているようです (ワイヤーフレームを見てください!)。

ThreeCSGユニオンは今のところ最良の選択肢ですか?

[編集 2]ネイティブ CSG ジオメトリで更新されたフィドル。20 個の頂点と 32 個の面だけで、期待どおりの結果が得られます。このアイデアをくれたWiltに感謝します。問題は、ポリゴンのハード コーディングに時間がかかりすぎることです (3 つのボックスのみのコードを見てください)。ポリゴンを読み込んで生成するための JSON ファイルはありません。ThreeJS ジオメトリしかありません。そのため、ThreeJS と ThreeCSG のジオメトリ間の変換を見て、変換があるとなぜ悪い結果になるのかを理解したいと考えています。

THREE.js と ThreeCSG を使用して、objloader からインポートされた 2 つのメッシュ ファイルに対して、インタラクティブにリアルタイムでブール演算を実行しようとしています。CSG コードを最適化して、解像度 ( link ) または BSP ツリーの数またはサイズを減らしてブール演算の実行時間を短縮し、プログラムをリアルタイムまたは高速に実行する方法があるかどうかを尋ねたかっただけです。私が使用しているオブジェクトはかなり大きいので、これが実行速度が遅い理由の 1 つです。ご協力いただきありがとうございます。