3

htmlキャンバス要素を使用して、フォントファイルで使用可能な各文字をキャンバスに描画しようとしています。この質問をできるだけ簡単にするために、1つの文字だけがキャンバスに描かれているふりをします。そこから、Javascriptを使用してキャンバスを分析し、キャラクター全体を構成するキャンバスの三角形の領域を作成します。三角形で必要な理由は、後でデータをWebGLに送信して、テキストをレンダリングでき、テキストサイズを拡大または縮小してもデータが失われないようにするためです。

私はこれを達成するためのある種のアルゴリズム、または私を正しい方向に進めるための少なくともいくつかの知識を探しています。別のアプローチを使用する必要があると思われる場合は、その理由を教えてください。ただし、3Dブロックテキストを作成できるようにするだけでなく、さまざまな方法でテキストを変更する方法を提供するのにこれが最善であると考えました。

4

3 に答える 3

1

キーワードPolygonTriangulationから始めることをお勧めします。

このメソッドを使用すると、次のようにnポリゴンを三角形に分割できます。 上記のウィキペディアからの画像-記事

これらの方法は、実際の(丸みのない)エッジを持つ図にのみ適用できます。

于 2012-10-16T12:00:14.160 に答える
1

シェーダーを使用して解像度に依存しない曲線を描画する方法に関する記事があります

http://research.microsoft.com/en-us/um/people/cloop/loopblinn05.pdf

私の理解では、形状を三角形に分割する代わりに、各四角形の内側に曲線の一部を描画するのに十分な情報を頂点に並べ替えて、図形を四角形に分割します。つまり、シェーダーが各クワッドを描画するときに、各ピクセルについて、そのピクセルが曲線の内側にあるか曲線の外側にあるかを計算できる式があります。

于 2012-10-17T07:25:18.153 に答える
0

それで、あなたはラスター画像をベクターデータに変換しようとしていますか?ズームインすると、非常にギザギザに見えるジオメトリになります。各ピクセルはジオメトリの四角いエッジ部分として扱われているためです。

描画している各グリフの元のベクトル(ベジェ曲線)ジオメトリを手に入れることができませんでしたか?

それを三角ストリップとファンに変換すると、よりスムーズに見えます。

于 2012-10-16T18:01:02.727 に答える