Canvas 時計の開始

❮ 前章へ 次章へ ❯

これまでの章で、HTML Canvas を使用したアナログ時計を作成してきました。


パート V - 時計の開始

時計を開始するには、間隔を置いて drawClock 関数を呼び出します:

JavaScript:

var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");
var radius = canvas.height / 2;
ctx.translate(radius, radius);
radius = radius * 0.90
//drawClock();
setInterval(drawClock, 1000);
Try it Yourself »

例の説明

時計を開始するのに唯一必要なことは、間隔を置いて drawClock 関数を呼び出すことだけです。

次のコードを:

drawClock();

下のコードに置き換えます:

setInterval(drawClock, 1000);

間隔はミリ秒です。 1000ミリ秒ごとに drawClock を呼び出します。


❮ 前章へ 次章へ ❯