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

how to rotate <g> in javascript?

ANSWERED

How do I rotate a "g" element in javascript?

 

document.getElementById('g_element').transform = 'rotate(15)'; ?

 

I mean, how do I rotate the clock hands in javascript?

Best Answer
1 BEST ANSWER

Accepted Solutions

Yup. Thanks to another person in the Discord channel I was able to get a nice analog clock going and now working on customisable faces 🙂

View best answer in original post

Best Answer
0 Votes
7 REPLIES 7

JavaScript rotation is coming in the next update, we'll have some new documentation for you.

Best Answer

@JonFitbit any idea when that's coming?  From what I can tell, analog faces aren't possible at the moment.  I've got a rotation on an SVG but don't seem to have a way to manipulate it based on the current time...

Best Answer
0 Votes

@Jacques0130 wrote:

@JonFitbit any idea when that's coming?  From what I can tell, analog faces aren't possible at the moment.  I've got a rotation on an SVG but don't seem to have a way to manipulate it based on the current time...


If you look on the community Discord server, you'll find a pinned example of creating an analogue clock. Search this site for the Discord url.

Best Answer

Yup. Thanks to another person in the Discord channel I was able to get a nice analog clock going and now working on customisable faces 🙂

Best Answer
0 Votes

I have searched in discord but can not find anything that helps me.

You don't mind posting an example here?

 

Thanks in adv.

kmpm

https://github.com/kmpm | Using: Ionic | Retired: Alta
Best Answer
0 Votes

@kmpm wrote:

I have searched in discord but can not find anything that helps me.

You don't mind posting an example here?

 

Thanks in adv.

kmpm


The clockface guide now contains an example https://dev.fitbit.com/build/guides/clockfaces/

 

You can also take a look at the Rotation Animation section here https://dev.fitbit.com/build/guides/user-interface/animations/#transformation-animations

 

Best Answer
0 Votes

How do I rotate an item but not always start at 0 degrees?  I want to start at 45 degrees and finish at 135 degrees.

function stepsToAngle(steps){
  //return Math.Floor((360 / 10000) * steps);
  return (((90 / 10000) *steps));
  if (steps > 10000){
    return (((90 / 10) * steps));
  }
}
Best Answer
0 Votes