Estuve viendo SVG y creo que es el más sencillo.
Código:
<svg id="id_svg" xmlns="http://www.w3.org/2000/svg">
<line id="id_line" x1="0" y1="0" x2="100" y2="0" style="stroke:red; stroke-width:14"/>
</svg>
De esta forma se crea una línea, pero ¿cómo puedo modificar los valores x1,x2,y1,y2 con javascript?
He probado así pero me temo que no es así...
Código:
document.getElementById("id_line").x2="400";