3

この問題を回避するために数時間を費やしました...本当に単純な形状(つまり、複雑さが非常に低い立方体)をレンダリングし、Three.jsのテクスチャマップ機能を使用すると、立方体を回転させると画像が回転中に歪むと、立方体の表面を横切る線が歪みとして表示されます。

http://screencast.com/t/VpSPRsr1Jkss

それがキャンバスレンダリングの制限であることは理解していますが、これは非常に簡単なことのようです.1つの面に画像がある立方体を歪みなしで回転させます.

私が取ることができる別のキャンバスライブラリまたはアプローチはありますか? いくつかのロゴやその他の要素をアニメーション化するために Three.js を使用することを本当に楽しみにしていましたが、ロゴや顧客向けのランディング ページでそのような歪みを持つことはできません。

読んでくれてありがとう、私はここで提案を受け付けています。

顔全体に歪みを分散させるだけなので、解決策として顔の複雑さを増すことは受け入れません。画像を平らな面にレンダリングして、そのオブジェクトを回転できるようにしたいだけです。

4

1 に答える 1

4

見える歪みは、2 つの三角形だけがその平面を作るためです。簡単な修正は、より詳細な平面を持つことです。

PlaneGeometry を使用している場合は、セグメントの数を増やします。CubeGeometry を使用している場合は、必要な平面上のセグメントの数を増やします (3 つのうち 2 つ)。

まともな外観と最適なパフォーマンスの最適なバランスを見つけるには、少し手間がかかります (セグメントが増えると、より多くのコンピューティングが必要になるため)。うまくいけば、単純なシーンの場合、大きな遅延が発生することはありません。

于 2013-04-17T15:02:04.353 に答える