Reloj con el tag html <canvas>

He estado probando esta nueva etiqueta html solamente implementada por el momento en los navegadores Firefox, Safari y Opera.

He creado un reloj analógico con 'milisegundero' opcional. Para usarlo incluir lo siguiente:

1) Añadir la librería javascript relojcanvas.js, situada en mi página personal GitHub https://github.com/17cosas/RelojCanvas

2) Añadir el tag html <canvas>, por ejemplo:

<canvas height="200" id="micanvas" width="200" > 
Tu navegador no soporta el tag html <canvas>
</canvas>


3) Crear un objeto con las diferentes opciones que permite la clase, por ejemplo:


var reloj=new RelojCanvas({
            id: 'micanvas',
            radio: 90,
            conSombra: true,
            conMilisegs: true
            });
       
        reloj.start();




El resultado es el siguiente:

 

Referencias:

https://developer.mozilla.org/en/Canvas_tutorial

http://canvaspaint.org/ (un buen ejemplo de lo que se puede conseguir con este tag)

http://www.xs4all.nl/~peterned/3d/ (y otro magnífico ejemplo de canvas en 3d)