Start(evt)
Start() is the entry point for SVG animation. It runs once when the SVG loads and then sets up a timer to continuously update the gears. This pattern—initialize once, then loop forever—is the backbone of real-time animation.
function Start(evt)
{
Update();
setInterval(Update, 50);
}Line-by-line explanation (3 lines)
🔧 Subcomponents:
function-call
Initial Update
Update();
Draws the gears at their correct position for the current time before animation begins
function-call
Continuous Timer
setInterval(Update, 50);
Calls Update every 50 milliseconds to keep the gears rotating smoothly
function Start(evt)- This function runs automatically when the SVG finishes loading (triggered by onload='Start(evt)' in the HTML)
Update();- Immediately calls Update() once so the gears are positioned correctly at the moment the page loads
setInterval(Update, 50);- Schedules the Update function to run every 50 milliseconds (20 times per second), creating smooth continuous animation
