はじめに
どうも、オレンジです。
今回は多角形の形にスプライトを貼り付ける方法についてまとめました。
ほぼほぼEar Clipping Algorithmの説明になっており、
全部で4つの記事になっています。
そこで、今回は4つの記事を軽くまとめた記事を作りました。
順番に読んでいったほうが理解しやすいですが、特定のポイントのみを知りたい場合は個別に記事を読んでいったほうが効率がいいです。
また、今回はサンプルプロジェクトも作ってきましたので、
そちらの紹介もしようと思います。
数学的な話がよくわからなくても、プログラムを読めばわかるという方もいらっしゃると思いますので
参考にしてください。
サンプルプロジェクト
3つのサンプルを含んだプロジェクトになっています。
ダウンロードはこちらから。
サンプルプロジェクトですが、そのまま個人のプロジェクトに導入して使っても問題ありません。
使用する際に許可なども必要ありません。ご自由に使用してください。
サンプル1. マウスで描いた形を三角形に分割する
こちらの動画のようなサンプルになっています。
マウスでクリックをした点に頂点を作り、
その頂点を結んだ多角形を三角形に分割するサンプルです。
三角形に分割した後はスプライトを貼り付ける事ができるので、
マウスで描いた形のオブジェクトを作ることも可能です。
サンプル2. ランダムに配置した頂点から多角形を作って三角形に分割する
こちらの動画のようなサンプルになっています。
ランダムに頂点を配置し、その頂点を結んだ多角形を三角形に分割するサンプルです。
ランダムに頂点を配置した後に重心を設定し、
その重心からの角度を計算して頂点を左回りにする処理が含まれています。
こちらも三角形に分割した後はスプライトを貼り付ける事ができるので、
ちょっとおしゃれな形のオブジェクトを作ることができます。
サンプル3. マウスで描いた形でオブジェクトを切る
こちらの動画のようなサンプルになっています。
マウスで描いた線に沿ってオブジェクトを分割することができます。
切った欠片は落下します。
切った欠片は別のオブジェクトにすることができるため、
汎用的に使用できるようなコードになっています。
記事の紹介
ここからは記事の紹介です。
Ear Clipping Algorithmについて
個別の記事の紹介の前に、
すべての記事で共通していることですが、Ear Clipping Algorithmという手法について説明しています。
Ear Clipping Algorithmは下記の論文に記されている手法になります。
https://www.geometrictools.com/Documentation/TriangulationByEarClipping.pdf
多角形を三角形に分割する手法についてまとめてあります。
こちらの論文に記されている手法については、私がスライドを作ってまとめました。
今回の記事ではこのスライドに載っていることをベースに説明しています。
このスライド自体はフリー素材なのでご自由に使ってもらって構いません。
.pptxで欲しい方がいらっしゃいましたら個別に連絡してください。
では、各記事の紹介に入ります。
多角形の形にスプライトを貼り付ける①
最初の記事ではEar Clipping Algorithmの基本的なロジックを紹介しています。
耳(凸頂点)を切り取って三角形に分割していく処理について説明しています。
多角形の形にスプライトを貼り付ける②
2つ目の記事でもEar Clipping Algorithmについて説明しています。
1つ目の記事の方法では三角形分割がうまくいかない多角形に対応するために、
三角形分割するための条件を追加していきます。
多角形の形にスプライトを貼り付ける③
3つ目の記事でもEar Clipping Algorithmについて説明しています。
1、2つ目の記事の方法では三角形分割がうまくいかない多角形に対応するために、
三角形分割するための条件をさらに追加していきます。
多角形の形にスプライトを貼り付ける④
4つ目の記事ではついに分割した多角形にスプライトを貼り付けています。
draw_vertex_textureの説明が主になります。
ここまで読むことで、多角形の形にスプライトを貼り付けれるようになります。
まとめ
以上で多角形の形にスプライトを貼り付ける記事の紹介を終わりにします。
何かのゲーム開発や勉強の手助けに慣れればなと思います。
