Prev Demo
HTML5
>
Canvas Clock
Next Demo
Write code here
J
|
B
|
A
<!DOCTYPE html> <html> <body> <canvas id="canvas" width="200" height="200" style="background-color:green"></canvas> <p><b>Creating clock shape with canvas</b> </p> <script> var canvas = document.getElementById("canvas"); var ctx = canvas.getContext("2d"); var radius = 100; ctx.translate(100, 100); radius = radius * 0.9 drawClock(); function drawClock() { ctx.arc(0, 0, 100, 0, 2 * Math.PI); ctx.fillStyle = "pink"; ctx.fill(); } </script> </body> </html>
Note: We DO NOT save your trial code in our database.
Output
