剣の軌跡の綺麗な出し方

ゲームによくある剣を振ると軌跡が出る処理を作ってみたのでざっくり書きます。

Dxライブラリを使用。

やり方としては、軌跡を出す根元の位置と先の位置を取得し、
その位置をいくつかの過去の分と一緒に保存しておいて、
それを使ってポリゴンに軌跡の画像をひっつけて描画するだけ。

今回ひっつける画像はこれ

f:id:haina817:20160517231910p:plain

急いでいたのですごく適当だけどこれでも意外ときれいに写った。
出来るならば対角線から色がはみ出ないようにすると綺麗な半月型になる。


Dxライブラリには3D描画に使用する頂点データ型として、
「VERTEX3D」って構造体があるので、
そこに取得した座標と法線、ディフューズカラー、テクスチャ座標(UV)等を入れるだけ。

後になるにつれて透過させて行きたいならば、
この構造体のアルファ値を変動させれば上手いこと行く。

テクスチャ座標に関しては、
Vは根本1の先0固定でおk。
Uは根本も先も各自(今の頂点数/全体の頂点数)を求めればおk。

ちなみに描画にはDrawPolygonIndexed3D関数を使用。

やってみるとこんな感じ...

f:id:haina817:20160517223311p:plain

なんかカクカクしてる。

私が思い描いたのは曲線の滑らかな軌跡。
だが、これは滑らかな曲線とは言い難いカクカク軌跡...

原因はこんな感じで描画してるから。

f:id:haina817:20160517224533p:plain

つまりこれを曲線に見せるには、
この一辺をもう少し割って角度を変えていけばそれっぽく見えるはず...


そーいや前にqiitaで「ベジエ曲線を使ってみよう」って投稿みたことあったな。
(これ→http://qiita.com/hart_edsf/items/cec5af01a70b62ca93f2)

ベジエ曲線とは始点、終点、及びその他いくつかの制御点からできる曲線で、
特徴として「始点と終点を必ず通る」ことが挙げられる。

できれば制御点も通したいんだよなぁ。
と思ったら親切に下の方に全部通すやり方書いてくださってた。

これを使ってすべての頂点を通る曲線を作って
その間の座標を何分割かして保管すれば綺麗に見えるらしい。

そしてコメントの所に、全部の点を通る曲線を手軽に使いたい場合、
スプライン曲線もいい選択と書いていたので調べた(ありがたい)

両方使って試してみたがスプライン曲線の方が簡単だったので、
今回はスプライン曲線を使う。

分割数は...適当に1辺につき8分割にしようか。
それを根本と先の両方にする。

完成図はこんな感じ(もっと細かいけど)

 

f:id:haina817:20160517232832p:plain

 

黒が分割前のポリゴンの辺で赤の線が補完した点を使った新しい辺。
(この図をペイントで作成した時に曲線のツールがベジェ曲線使ってて何気に感動した)

後はその分割した分だけ頂点インデックスリストを作成する。

んで出来た軌跡がこれ

f:id:haina817:20160517225741p:plain

すごい滑らかになった。

これ応用したらもっと面白いエフェクト出来そうだな...
とにかく今はゲームを完成させないといけないんだけど...
と言うかこの場合ソースコードとか乗せた方がいいのかな?
まぁ今回は初めての投稿だし見る人が身内以外でいるかわからないから無しという事で。

 

それではまた。
最後までお付き合いいただき、ありがとうございました。