惑星の公転について
惑星の公転を実装するにあたって、
大雑把ですがこんなことを考えました。
動きをつけるにはsetIntervalで時間ごとに描写し直す。
時間ごとに惑星が動くようにするためcountを取る。
countから角度を出す。
この過程でわからなかったのは
1. countから角度を出す。
2. 三角関数を使えるようにするため角度をラジアンに変換する
4.惑星軌道が半時計回りになるしかけ
この4点をそれぞれ以下に解説します。
1. countから角度を出す。
count = 角度ということにします。
count1は1度です。1度惑星が動きます。
2.角度からラジアンを出す。
countを角度ということにしましたが、
肝心の惑星のxとy座標を出すには三角関数のコサインとサインを使います。
javascriptだとMath.cosとMath.sinという関数が用意されていますが、
これは引数がラジアン単位なので、角度をラジアンに変換します。
(角度とラジアンの対応。クリックでアニメーションが見られます。)
角度をラジアンに変換するには
360度 = 6.28ですから
6.28 / 360で1度 = 0.01744...となります。
そして6.28 / 360 * countの度数をかけるとcountがラジアンで何度かが出せます。
ちなみにcountをラジアンに変換するのでなく
countを直接ラジアンにしてしまいたい場合は
count++をcount += 0.0174にすればだいたいそんなもんくらいのラジアンが出せます(0.0174444…と続くのでちょびっとだけ変わりますが)
さて、これでcount(度数)から対応するラジアンが出せました。
あとはラジアンから三角関数を使えば惑星を描画するxとy座標が出せます
そのやり方は後述しますが、
これではどの惑星も1コマ1度ずつしか移動しません。
一周を360に割って、1コマ1ずつ進み、地球も水星も金星も月もみんな360コマ目で一周します。
惑星の公転周期はそれぞれ違うのにこれではキモいので、
惑星ごとに1コマずつ移動する角度を変えてみたいと思います。
例えば、水星は地球の約４倍の早さで太陽の周りを回るので、
地球が1コマ1度ずつ移動するのに対して
水星は1コマ4度ずつ移動するようにしてみます。
こうすれば水星は地球の4倍早く移動するようになります。
まず地球ですが、6.28を360で割ると、1ラジアンが0.01744444444
これが360コマで6.28ラジアン。
水星は地球より4倍ですから、360/4で90。
地球が360コマで一周するのに対し、
水星は90コマで一周するようにしましょう。
6.28を90で割ると
0.069777。1コマで0.069777動き、90コマで一周します。
なので計算式は
6.28 / 90 = 0.069777 １コマの移動する角度(ラジアン単位)
* count それを何回進めたか
になります。
逆にめちゃくちゃ遅くしたい場合は
公転周期1000とかにしてみます。
1000コマ進めてようやく太陽1周です。
6.28 / 1000 = 0.00628なので、1コマごとに0.00628進みます。
太陽と惑星の距離(座標0,0からの半径)が小さいと
1コマでは移動したと気付かないかもしれません。
周期が大きすぎると1コマでは移動せず、数コマ進めるごとに座標が移動することになります。
ちなみにcountが360を超えてしまった場合は？
1周回ってあまりで角度を作ります(表現変ですみません)
900の場合は900 / 360 = 2.5で、2周と0.5ですから360度の半分の180度初期位置から移動します。
さて、惑星ごとのラジアンも出せたところで
をやります。
三角関数というのは三角形の斜めの線に対して
横軸(x)の長さと縦軸(y)の長さがわかるというやつです。
[クリックでアニメーション]
このように円の中心点から三角形を作って、原点から斜めの線の頂点がわかれば
横軸と縦軸の座標がわかります。
javascriptのMath.cosとMath.sinはそれぞれラジアンを渡せばxの座標とyの座標を出してくれます。
しかし、ここで出てくる座標はベクトル(三角形のうちの斜めの辺)の長さを1とした座標です。(単位ベクトルと言います)
(斜めの辺とは言っても0度、90度、180度、360度の場合は斜めではなくなります)
これでは太陽の周りを1マス離れた距離に全部の惑星が回ってしまいます。
なので、今度も惑星ごとに太陽からどのくらい離れているか、
つまり太陽の0,0座標を中心点とした半径を設定し
その半径を三角関数で出たxy座標にそれぞれかけてやれば
ベクトルがちょうどその何倍かになります。
[クリックで単位円のアニメーション]
4.惑星軌道が半時計回りになるしかけ
さて、これで惑星ごとにぐるぐる回るようになったのですが、
惑星たちが半時計回りに回っています。
これは三角関数が1ラジアンと入れると真右を開始地点として上に1ラジアン、
3.14と入れると右を開始地点として半円、つまり真左を3.14ラジアンとするためです。
これを時計回りにするには、sinで出したy座標にマイナスをかけます。
すると+10ラジアン、右から回って右上だった座標がマイナスになり右下となり、
時計回りに回転します。
x座標にマイナスをかけた場合は左右逆転し、
開始位置がマイナスいくらか、つまり座標軸で言う左側になります
