昨日、「てっく煮ブログ AS3.0 で 3D プログラミングを１から勉強する (1)」をJavascriptに移植してみたが、原理を理解する前になにやら回転処理が出来てしまった。
いきなり3Dをやる前に2Dで理解することにする。
(x,y)の点を反時計回りにθだけ回転させる場合(回転後の点は(x',y'))には下記の数式がある。
x' = x * cosθ - y * sinθ
y' = x * sinθ + y * cosθ
まずは、この数式を理解する必要がある。
三角関数で座標(cosθ,sinθ)が、90度以上に左側に回転すると座標(-sinθ,cosθ)となる。
つまり、sinとcosが入れ替わる。
その疑問について調べてみると、「東大生が教えるビジュアル数学」が参考になった。
座標(cos(90+θ)、sin(90+θ))は、座標(-sinθ,cosθ)と同等になるわけです。
他にも「金沢工業大学のKIT数学ナビゲーション」も参考になります。
プログラムを組んだ時に、角度をマイナスにしています。
私たちは数学で普段習う時には、y軸の正の向きが上向きのデカルト座標を使っています。
しかし、スクリーン座標系のコンピュータ画面では上から下に向かって読むように設定されているので、y軸の正の向きは下向きになっています。
例えば、原点(0,0)の30度の座標(cos30度,sin30度)になります。ラジアンで表現すると30度の座標は(0.866025404,0.5)と両方とも正の値です。
コンピュータ画面では右斜め下に表示されます。つまり角度を増やすと時計回りに回転するのです。
スクリーン座標系のままでも良かったのですが、みさなんが数学で習ったイメージを考えると30度の座標は右上になるようにしたかったので、角度をマイナスにして、反時計回りにしました。
「OpenGLとDirect3Dの座標系の違い」のサイトを参照してもらうと、OpenGLは数学的、DirectXはコンピュータ的な違いがみてとれます。
