Three.jsで物理シミュレーションを作ってみた(地球の周りを運動する月の運動編)

自分の趣味の一つに,プログラミングを書くことがあります。

今回,趣味で作った,地球の周りを運動する月の運動の物理シミュレーションを作りました。

プログラミングでできることは,月の運動の位置を数値で求めることだけなのですが,それでは面白くないので,視覚的に運動を見るために,google ChromeやInternet Explorerなどのブラウザで3D描画ができる,Three.jsというものを使いました。

左に,月の位置と速度の表示,Stop,Restart,Reloadのボタンを付け加えました。

それだけでなく,ドラックアンドドロップで,月の速度を変更して,動かすようにしました。

マウスをドラッグすると,赤い矢印が出る
マウスをドロップすると,矢印の方向に月が動く

月,地球,宇宙の画像は以下から使わせていただきました。

月の画像

https://raw.githubusercontent.com/82mou/sandbox/master/universe/img/moon.jpg

地球の画像
https://82mou.github.io/threejs/img/real-earth.jpg

宇宙の画像
https://raw.githubusercontent.com/82mou/sandbox/master/universe/img/universe.jpg

月のドラックアンドドロップして,動かすのは,下のサイトを参考にしました。


ここまで,読んでくれてありがとうございます。

もし,これを見て,似たようなものを作りたいという人がいましたら,
プログラミングチュートリアルというチャンネルが勉強になりますので,このチャンネルを見ることをお勧めします。


よろしければサポートお願いします。 いただいたサポートは,皆さんの役に立つ記事を書くための活動費として,使わせていただきます。