スピログラフSpirograph
大きな歯車の内側や外側を小さな歯車が転がり、穴に差したペンが花模様を描いていくループアニメーションです。
どう計算しているか
- 「外側の歯数」と「転がる歯数」から2つの円の半径を決めます。小さい円の中心は大きい円に沿って回り、同時に転がり分だけ自転します。
- ペン先の位置は、公転の cos・sin と、半径比で決まる速さの自転の cos・sin を足して求めます（内側を転がるときはハイポトロコイド、外側ならエピトロコイドという曲線になります）。「ペンの位置」は小さい円の中心からペン先までの距離です。
- 模様が閉じるまでに必要な公転の回数は、転がる歯数を2つの歯数の最大公約数で割った値です。1ループでこの回数だけ公転させます。
- 現在位置から「描線の長さ」ぶんさかのぼった部分を濃く描き、「完成形をうっすら」で1周分の全体像を薄く重ねます。
x = (R−r)cosθ + d·cos((R−r)θ/r), θ = 2π·laps·tループがつながる理由
歯数がどちらも整数なので、決まった回数公転するとペンは必ず出発点に戻り、曲線が閉じます。1ループの角度をちょうどこの周期に合わせているため、最後のコマと最初のコマが一致します。
調整できるパラメータ
形
| 種類 | 内側を転がる・外側を転がる |
|---|---|
| 外側の歯数 | 20 〜 150（初期値 96） |
| 転がる歯数 | 8 〜 90（初期値 36） |
| ペンの位置 | 0.1 〜 1.2（初期値 0.75） |
| ペンの本数 | 1 〜 5（初期値 1） |
| 大きさ | 0.3 〜 1.1（初期値 0.85） |
| 歯車を描く | オン／オフ（初期値 オン） |
| 完成形をうっすら | オン／オフ（初期値 オン） |
| 描線の長さ | 0 〜 1（初期値 0.6） |
| 線幅 | 0.5 〜 8（初期値 2） |
同じ分類のシーン（放射・回転）
- 放射・回転対称Polar Rings同心円上に並んだ図形がリングごとに少しずつ遅れて回り、渦や花のような模様が浮かんでは消えるループアニメーションです。
- 形状モーフShape Morph丸・三角・四角などの輪郭を同じ数の点で表し、点どうしを補間して形を滑らかに変形させ続けるループアニメーションです。
- 入れ子の回転Twist Stack大きさの違う多角形を中心にそろえて重ね、内側ほど遅れて回すことで、ねじれた渦が現れてはほどけるループアニメーションです。
- 万華鏡Kaleidoscope扇形の中で図形を動かし、それを回転と鏡写しで円周に並べることで、万華鏡のような対称模様を作るループアニメーションです。
- 葉序・螺旋Phyllotaxis黄金角ずつ角度をずらして点を並べ、ひまわりの種のような螺旋模様が中心から湧き出して外へ流れ続けるループアニメーションです。
- 無限ズームInfinite Zoom多角形の辺上の点を結んで一回り小さい多角形を作る操作を繰り返し、その入れ子の渦へ無限に吸い込まれていくループアニメーションです。
- 遠近トンネルPerspective Tunnel遠くから迫ってくるリングの列を遠近法で描き、うねる軸とねじれでくねった筒の中を進んでいるように見せるループアニメーションです。
- 花の開閉Bloom何重にも重なった花弁が外側の層から時間差で開いては閉じ、並べると花畑のように波打つループアニメーションです。
- 時計の針の群れClock Swarm格子状に並んだ時計の2本の針が一斉に回り、模様 A と模様 B の間を行き来するループアニメーションです。
- 吸い込まれる渦Black Hole極座標の格子が渦を巻きながら中心の穴へ吸い込まれ続け、中心に近いほど強くねじれるループアニメーションです。
- SDF・等高線GLContour Tunnel図形の距離関数を等高線の縞として描き、縞が中心から湧き出し続けながら2つの図形の間でモーフするループアニメーションです。