2009-07-17 17 views
2

キャンバスタグまたはSVGを使用して3D polyhedraというモデルのJavaScriptライブラリがありますか? Platonic solidsのレンダリングを作成したかったとしますが、これをどのように達成するのがベストでしょうか? FWIW、私はSafariやChromeなどのWebKitベースのWebブラウザにしか関心がありません。JavaScriptを使用して3D多面体をモデル化する

3D trianglesをレンダリングする方法のこのクールなデモを見ましたが、どのように任意の辺の数で多面体に拡張できますか?

答えて

4

は、このライブラリを見てみましょう:SVG-VML-3D

それはSVGを使用し、MSIEに戻っVMLに落ちます。 彼らはプラトンの固体のデモを持っています。私は便利なWebkitブラウザを持っていませんが、そこでもうまくいくはずです。

+0

これはチケットかもしれません。ありがとう、アンドリュー! –

0

ほとんどの3Dライブラリは、三角形を一般化しています。 3辺以上のポリゴンが必要な場合は、三角形に細分して三角形を描画します。あなたがプラトンソリッドだけに興味を持っているならば、まずは各顔の頂点を平均し、その中心と隣接する2つの隣接する2つの面を使って簡単に各面の三角形を得ることができます顔の頂点は三角形を与えます。

+0

真実を言わせてください、私は、任意の数の面(少なくとも100まで)で多面体をモデル化したいと思います。私は3Dに慣れていないので、私はちょうど私が言うことができるlibがあることを望んでいました、私に17面の多面体を与えてください。 :-) –

+0

私はそれを見たことがない。しかし、5つのプラトン固体しか存在しません。任意の多面体については、プラトンのような素敵なものは得られません。あなたは球の上に一定数の点を投げて、彼らが安定するまでお互いを押すようにすることができます。 – Nosredna

+0

私は偶数のために解決します。ポイントは、私は多面体を多くの側でユーザーの要求としたいです。 SVGソリューションはかなり安定しています。 –

1

あなたの質問に直接答えることはできませんが、あなたがWebKitだけを言及しているのを見て、わたしはかなり最近にWebkitに追加された新しい3D CSS Transformのサポートを指摘したいと考えました。これにより、Javascriptを使用せずに、あなたが望むことをすることができます。 3D多面体の例は見ていませんが、キューブなどの例があります。例えばhereです。

ほんの少し複雑なデモhereには、長方形のリングがあります。あなたができることの本当の味(アニメーションのためにJavascriptを使用していますが)については、Snow Stackのデモをご覧ください。

+0

それは興味深いです。私は最近、2Dトランスフォームをたくさん試しています(http://segdeha.com/experiments/css-transitions/)。任意の辺を持つ多面体の構築にどのように適用できますか? –

+0

@Andrew:パスして、私は実際にこれで何かを実装していない、私はちょうどそれについて最近聞いた。正方形で始まって三角形に変形しなければならない可能性があります(生の変換行列にアクセスできるように見えます)。 – DaveR

+0

私はこの考えが好きです。実装するには非常に軽量でなければなりません(おそらくすべてのCSS)。上記のSVGソリューションが面倒であると判明したら、私はこれを追求し、ブログを投稿します。 –

関連する問題