JAVASCRIPT PROGRAM

JavaScriptで三角関数を使ってアナログ時計を作成しよう【初心者向け】

三角関数を使ってアナログ時計を作成しよう

前回は現在時刻に合わせて、秒針を表示するやり方を説明しました。
今回は長針と短針も表示して、アナログ時計を作成しましょう。

短針(時)の角度を計算する

秒針は1秒毎に6度ずつ針の角度を変更しました。
長針(分)も0分から59分まであるので、360÷60で1分毎に6度ずつ針を動かします。
短針(時)の場合は、0(12)時から11時まであるので、360÷12で1時間毎に30度ずつ針を動かすことになります。
ただし、短針は1時間毎に30度動かすのではなく、1分ごとに少しずつ針を動かすようにします。
60分で1時間なので、30度÷60分で短針は1分間で0.5度ずつ動かしていきます。
短針を1分ごとに動かす式は、以下のようになります。

90度 - 30度 × 現在時(hour) - 0.5度 × 現在分(minute)

アナログ時計を表示するプログラム

アナログ時計を表示するプログラムは、以下の通りです。

ファイルをダブルクリックするとプログラムが実行され、WEBブラウザ上にアナログ時計が表示されます。

JavaScriptの詳しい使い方は、以下の「MDN Web Docs」を参照してください。

-JAVASCRIPT, PROGRAM
-