CODEWITHSUNDEEP
javascripthtmlsvg
Chris
Chris

Reputation: 547

How to move SVG line with javascript

I don't know how to set the x1, y1, x2, y2 parameters in javascript from the SVG element.

<svg height="210" width="500">
    <line id="line" x1="0" y1="0" x2="200" y2="200" style="stroke:rgb(255,0,0);stroke-width:2" />
</svg>

Thanks for helping.

Upvotes: 0

Views: 3486

Answers (2)

Robert Longson
Robert Longson

Reputation: 124219

It's just

var line = document.getElementById("line");
line.setAttribute("x1", "5");

etc.

Upvotes: 3

Cees Timmerman
Cees Timmerman

Reputation: 19664

var line = document.getElementById('line')
line.x1.baseVal.value = 5

Is one char shorter (three if counting noise) than the other answer.

Upvotes: 1

Related Questions