svg dom use variables to define object attributes

Question

can you help me? I want to use javascript in order to alter the form of a svg polygon using given variables. I tried this:

var example = 200;
document.getElementById('myPolygon').setAttribute('points','50,50 50,100 example,100');

It does not work. The double quotation mark doesn't work, either. However, I need the variable because it changes over time. What is the right syntax in this case?

I have looked for such a question, but didn't find it. If there is already a solution for my question provided on this forum, please kindly let me know the link to it. Thank you!

Answer 1

try this.you should append the value of variable example between the string. if you use '50,50 50,100 example,100' ,example is considered as a part of string. '50,50 50,100 '+example+',100' here you are adding value of variable example to string.

document.getElementById('myPolygon').setAttribute('points','50,50 50,100 '+example+',100');