Inline SVG Javascript Transform Not Working

I am unable to transform rotate the needle using slider. Needle at the center at “rotate(90 129.24 148.63)” right “rotate(180 129.24 148.63)” and left at rotate(0 129.24 148.63) gauge_needle.style.transform=rotate(${this.value} 129.24 148.63)`;

Here is the link
https://codepen.io/johnkelton/pen/KewQLx

Hi,

Ignoring the fact that I know nothing about svg and almost as little about js it seems to me that you should be modifying the transform attribute (which is not a style attribute).

e.g.

gauge_needle.setAttribute('transform','rotate(' + this.value + ' 129.24 148.63)' );

Forked codepen example here:

Also there is no element called gauge_value that I can see.

1 Like

Thanks a lot!

1 Like

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.