help menu

Join us on the Community Forums!

  • Community Guidelines

    The Fitbit Community is a gathering place for real people who wish to exchange ideas, solutions, tips, techniques, and insight about the Fitbit products and services they love. By joining our Community, you agree to uphold these guidelines, so please take a moment to look them over.

  • Learn the Basics

    Check out our Frequently Asked Questions page for information on Community features, and tips to make the most of your time here.

  • Join the Community!

    Join an existing conversation, or start a new thread to ask your question. Creating your account is completely free, and takes about a minute.

Not finding your answer on the Community Forums?

Cancel
Turn on suggestions
Auto-suggest helps you quickly narrow down your search results by suggesting possible matches as you type.
Showing results for 
Show  only  | Search instead for 
Did you mean: 

How can I create activity rings?

‎10-29-2020 13:09

‎10-29-2020 13:09

How can I visually represent data like steps in an activity-ring styled watch face?

Best Answer
0 Votes
1 REPLY 1

‎11-16-2020 05:02

‎11-16-2020 05:02

You can use the ARC element and set that programatically.

<arc id="myArc" x="25" y="50" width="100" height="100" fill="red" arc-width="10" start-angle="0" sweep-angle="90" />

https://dev.fitbit.com/build/guides/user-interface/svg/#arc

 

In code it would be something like: 

const myArc = document.getElementById("myArc");
myArc.startAngle = 0;
myArc.sweepAngle = 360;

https://dev.fitbit.com/build/reference/device-api/document/#interface-arcelement

Best Answer
0 Votes