成果物
こんな単純に見える模様にも、ベクトルの交差や、三角関数、内接円など高度な数学が使われています。かなり苦戦しました。
仕組み
delta angleで模様をコントロールしています。具体的には。
タイルの各辺の中央から、deltaの量だけずらした場所から、angleの角度で、対角線上で他の線とぶつかるまで線を伸ばすアルゴリズムです。
この論文の図がわかりやすいと思います。
http://www.cgl.uwaterloo.ca/csk/papers/kaplan_gi2005.pdf
他の線とぶつかるまでというのが難点で、CodingTrainでも一時間以上の解説になっています。
今回使った交差点を求めるアルゴリズムは、こちらです。
※追記 ベクトルの交差点求めなくてよいみたいです…代わりに三角関数で辺の長さを求めることができるようです。Githubの中身を更新して、辺の長さのレベルも変えられるようにしました。
作り方・コード
今回は、まず交差点を求めるプログラムから始めました。
次にCodingTrainにはないN角形の星模様を作れるようにしました。
※追記 p5.jsバージョンでは、CodingTrainにありました。完敗…
N角形の星模様一つのバージョンはIslamic_Star_Patterns_Singleという名前です。
最後に、先ほど作ったN角形の星模様を配置しました。簡単なものを作ってみたのですが、それでも数式が難しいです。Islamic_Star_Patterns_Multiという名前です。