Unique Real time analogue clock

 

Clockwise

It shows the real time of your computer; just check it!

The movement of the hour hand, minute hand and seconds' hand are controlled by parametric equations. The second hand moves 60 every second.







 

The Source Code for Live Analogue Clock

Here is the source code for the animation. It is JavaScript.

 

<script type="text/javascript" >
var canvas = document.getElementById('myCanvas');
var context = canvas.getContext('2d');
var k;
function timing() {
//get date
var tme= new Date();
//get seconds
var s=tme.getSeconds();
//get minutes
var m=tme.getMinutes();
//get hours
var h=tme.getHours();
context.clearRect(0,0,500,500);
//seconds
context.beginPath();
context.arc(250,250,100,-Math.PI/2,[s*Math.PI/30]-Math.PI/2)
context.strokeStyle='red';
context.lineWidth=6;
context.stroke();
context.beginPath();
context.arc(250,250,70,-Math.PI/2,[m*Math.PI/30]-Math.PI/2)
context.strokeStyle='blue';
context.lineWidth=10;
context.stroke();
if(h<=12)
{
context.beginPath();
context.arc(250,250,40,-Math.PI/2,[(h)*Math.PI/6]-Math.PI/2)
context.strokeStyle='brown';
context.lineWidth=14;
context.stroke();
}
else
{
context.beginPath();
context.arc(250,250,40,-Math.PI/2,[(h-12)*Math.PI/6]-Math.PI/2)
context.strokeStyle='brown';
context.lineWidth=14;
context.stroke();
}
}
window.setInterval('timing()', 1000);
</script>

 

 

 

Recommended Reading

 

Maths is challenging; so is finding the right book. K A Stroud, in this book, cleverly managed to make all the major topics crystal clear with plenty of examples; popularity of the book speak for itself - 7th edition in print.

amazon icon Amazon Ad

Advertisement