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

How to change "stroke-width" property of line via javascript?

How to change "stroke-width" property of line via javascript?

 

I tried 

let items = document.getElementsByClassName("dial");
items.forEach(function(item) {
item.style['stroke-width'] = 3;

item.style.strokeWidth = 3;
});

 

but it did not work. Any pointers?

Best Answer
4 REPLIES 4

I can't crack it, either. Seems like a bug.

Peter McLennan
Gondwana Software
Best Answer
0 Votes

I think the stroke and fill properties are not changeable via JS.

Best Answer
0 Votes

As per the documentation:

The Fitbit rendering engine does not support the CSS stroke or border properties. To achieve a similar effect you need to draw two overlapping shapes.

The larger background shape should be filled with the desired border color, and the smaller foreground shape should be filled with the desired foreground color.

Best Answer
0 Votes

It appears this does work now, not sure what SDK version this was fixed but as of SDK 6.1 the stroke width can be changed via .style.strokeWidth in js

let myLine = document.getElementById("my-line");
myLine.style.strokeWidth = 10;

 

Best Answer
0 Votes