1

canvasすばやくレンダリングしたい3D球の描画を作成しようとしています。私の目標は、iPad上の小さな(300ピクセルの正方形)キャンバスのリアルタイムパフォーマンスです。

複雑なHTML5レンダリングのデモのほとんどはWebGL(three.jsなど)を使用していますが、これはすばらしいですが、iOSでのサポートは限られています(実際には、現時点ではありませんが、Appleは技術的に有効にできます)。

canvasただし、うまく機能します。

canvasそのため、CSS3はHW変換を提供canvasし、基本的なテクスチャリングに使用できるため、基本的なレンダリング機能を構築することをより厳密に検討しています。帆布に描くことで照明を偽造できます!これは完全なHWT&L(DX7!...)でもないので、かなり後退しますが、それでも非常にクールなものを構築することは可能であると私は確信しています。秘訣は、(とりわけ)ジオメトリの量を可能な限り最小化することです。

手元のトピックに戻ります。私の実際の質問は非常に具体的です。描画したい球がカメラから十分に離れている場合は、正投影で逃げることができます。この場合、アークパスと、で使用可能な回転およびスケーリング変換を使用して、ワイヤーフレーム球を作成できるようcanvasです。これにより、球にテクスチャを付けることはできませんが、滑らかな曲線が生成され、見栄えが良くなります。

画像に透視投影をスローしたい場合はどうなりますか?このタイプの変換からどのような曲線が生成されますか?ベジェまたはアークパスを使用して、十分に近い近似曲線を描くことができる可能性はありますか?

球の透視投影は楕円であることを私は知っています。楕円は、円をスケーリングすることで簡単に作成できます。投影パラメータが与えられた場合、その楕円の方程式を理解するのと同じくらい簡単かもしれません。誰かがこれを手伝ってくれる?

常に私に開かれているオプションの1つは、円弧を忘れて、ワイヤーフレームを線で描画することです(これcanvasは私にとって便利なアンチエイリアスになります)。これは、従来の方法で、1日と呼びます。たとえば、球にテクスチャを適用したい場合は、これを回避する方法もありません。

4

1 に答える 1

0

この曲線の分析定式化を探す(そしてこれをある種のベジェに適合させようとする)ことは、おそらく穴をどんどん深く掘り下げることになります。

また、組み込みの曲線を使用した場合のパフォーマンスは恐ろしいものになると確信しています。これらは、とにかく使用する線の機能を使用するヘルパーである可能性があるため、レンダリングとパフォーマンスに対する制御を減らすだけです。

于 2012-07-02T16:27:16.953 に答える