Canvas Clock Start

In these chapters we build an analog clock using HTML Canvas.

Part V - Start the Clock

To start the clock, call the drawClock function at intervals:

JavaScript:

const canvas = document.getElementById("canvas");
const ctx = canvas.getContext("2d");
let radius = canvas.height / 2;
ctx.translate(radius, radius);
radius = radius * 0.90
//drawClock();
setInterval(drawClock, 1000);

Try it Yourself »

Example Explained

The only thing you have to do (to start the clock) is to call the drawClock function at intervals.

Substitute:

drawClock();

With:

setInterval(drawClock, 1000);

Note

Intervals are in milliseconds. drawClock() will be called for each 1000 milliseconds.

Canvas Clock Start

Part V - Start the Clock

JavaScript:

Example Explained

Note

See Also: