Cancel
Showing results for 
Show  only  | Search instead for 
Did you mean: 

How to draw programatically?

ANSWERED

Just wondered if there are examples of how to draw using code for non-static elements?  

 

eg Using lines to draw a graph or drawing arcs to show the seconds around the edge (like Fitbit Blaze Chronograph face).

 

Thanks,

 

NiVZ

Best Answer
1 BEST ANSWER

Accepted Solutions

Great question.

 

We don't currently have a drawing or canvas API, but it's something we're definitely aware of the benefits.

 

You also can't directly modify the innerHTML, or it's equivalent in this case. 

 

You can however dynamically adjust the attributes of the existing svg elements, like <arc>.

 

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

 

I'll try to add an example to the developer website.

View best answer in original post

Best Answer
5 REPLIES 5

I'm interested in this as well.

 

I'm wondering if the answer is essentially that you have to modify the document's innerHTML manually to edit "inline" .gui files.

 

Perhaps with the help of Preact if it can handle the 3kb memory hit it could be accomplished in a React / JSX style way. I could be overthinking things and introducing unneeded complexity, but I'm not seeing an actual drawing library like <canvas> provides.

Best Answer
0 Votes

Great question.

 

We don't currently have a drawing or canvas API, but it's something we're definitely aware of the benefits.

 

You also can't directly modify the innerHTML, or it's equivalent in this case. 

 

You can however dynamically adjust the attributes of the existing svg elements, like <arc>.

 

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

 

I'll try to add an example to the developer website.

Best Answer

Examples will really help get us started. The initial ones don't cover all we need, as Paul has highlighted.

Best Answer
0 Votes

I know that visibility can't be toggled, but what about access to an element's classList methods?

Best Answer
0 Votes

classList isn't available, sorry.

Best Answer
0 Votes