1

私はthree.jsとWebGL全般に不慣れです。

http://css.dzone.com/articles/threejs-render-real-worldのサンプルは、three.js でラスターGIS 地形データを使用する方法を示しています。

ベクターGIS データをシーンで使用することはできますか? たとえば、実世界の座標 (メートル) に保存された位置 (高さを含む) を表す一連のポイントがあります。それらをth​​ree.jsで表示するにはどうすればよいですか?

http://threejs.org/docs/59/#Manual/Introduction/Creating_a_sceneの基本的なサンプルは、座標を使用してジオメトリを作成する方法を示しています。次のような実世界の座標で同様のアプローチを使用できますか?

"x" : 339494.5,
"y" : 1294953.7,
"z": 0.75

または、これらをページ単位に変換する必要がありますか? ポイントを使用して、航空写真をドレープするサーフェスを作成できますか?

簡単なサンプルを変更してみましたが、何も表示されません (またはエラー メッセージも表示されません): http://jsfiddle.net/slead/KpCfW/

私が間違っていること、またはこれが本当に可能かどうかについての提案に感謝します。

4

1 に答える 1

2

私はJSFiddleに何かを表示させるために多くのことをしました..ここ：http://jsfiddle.net/HxnnA/

  • ジオメトリで面を指定していません。この場合、3 つのデータ ポイントすべてがコーナーとして機能する面をハードコーディングしました。または、粒子を使用してデータを面ではなく点として表示することを検討することもできます。
  • マテリアルを に設定しTHREE.DoubleSideます。これは通常は必要なく、推奨もされませんが、顔の両面が見える初期段階でのデバッグに役立ちます。
  • カメラが間違った方向を向いていた可能性があります。を追加lookAt()して中央に向け、視野を広げました (これにより、コーディング中に物事を見つけやすくなります)。
  • カメラのニア プレーンとファー プレーンは、カメラの位置と地形の寸法に対して範囲外である可能性があります。そこで、ファープレーンの距離を長くしました。
  • 座標値が非常に大きかったので、カメラとの関係で意味をなすように手で少し修正し、カメラに表示されるのに十分な大きさの三角形を形成するようにしました。単位を小さくするために、座標を 100 などで割ることを検討できます。しかし、巨大なスケールを考慮してカメラを調整するだけでも十分なはずです.

あなたのアプローチに問題はありません。カメラの位置、方向、近距離と遠距離の平面を考慮して、データが理にかなっていることを確認してください。顔の作り方に注目。Face3 へのパラメーターは、頂点配列内の各ポイントのインデックスです。後で、ワインディング オーダー、法線、および UV を考慮する必要がある場合があります。参照用に、Three.js に含まれるジオメトリ クラスを調べることができます。

Three.js は、単位に意味を指定しません。単なる浮動小数点数であり、単位 (1.0) が何を表すかは自分で決めることができます。1mm、1 インチ、または 1km のいずれであるかは、アプリケーションとその規模を考慮すると何が最も理にかなっているかによって異なります。浮動小数点数は、実際の数値が極端に小さい場合や極端に大きい場合に、精度の問題を引き起こす可能性があります。私自身のアプリケーションは通常、数センチメートルから数百メートルの範囲のものを扱い、1.0 = 1 メートルのような方法で単位を使用します。これは正常に機能しています。

于 2013-08-11T01:26:59.943 に答える