Workshop : SVG and Animation (SMIL, script based)

Organizers: Stefan Goessner,  Michel Hirtzler

 Buil analog clock with hour, minute and second hand

Content: 
- use javascript to create drawing
- use 'animateTransform' 
- use additive='sum' 
- mechanical synchronized motion

1) Build the clock

You can use javascript to draw graduation and numbers for dial :   Example - 
Or use circles and stroke-dasharray to draw graduation :   Example -

2) Add animation for the three hands - To verify animation, take one minute for one hour!

Example -

3) Change to get real time and add possibility to adjust real time

Example  - Adjust also seconds, give graphic solution to adjust time .....

4) And a chronometer.

You can use javascript to draw part of chronometer:   Example -

5) Add start and stop for chronometer

Example -