Newbie - Sweep Clock Second Hand Movement

[calvin.tsf]

Hi all, am a Newbie building fitbit clock faces.

Is there a way to get continuous, sweeping movement for second hand on the basic Analog clock?

https://dev.fitbit.com/build/guides/clockfaces/

[LifeOmic-Dev]

There's a few ways you might be able to do it.  The limitations will be in what properties you can change in your JS code and how "jumpy" the animation may appear following adjustments.

• One way may be to add an "animateTransform" element in the "secs" group.  This transformation would be set to "rotate" with a duration of 1 second.  You would then adjust the "to" and "from" rotation each tick and then trigger the rotation by invoking ".enable()" on that element.
• If the above complains about adjusting the "to" and "from" properties, you could set a fixed "to" and "from" angles and instead rotate the entire group, much like in the provided example.
• The final method I can think of throws all of that updating out.  You still include an animation, but instead you set it to rotate through all 360 degrees in a minute and set the animation to repeat indefinitely.  The secs group is then set to the initial angle for the second hand and the animation handles the rest.  This approach may need to be tweaked slightly if the display going to sleep doesn't continue to "redraw".

Check out this guide on animations for more details and ideas: https://dev.fitbit.com/build/guides/user-interface/animations/

[Gondwana]

If SVG animations can't do it, you could try requestAnimationFrame.