如何动态更改svg线的宽度

Question

我写了下面的代码，成功地增加了svg行的大小，但是却没有减小它的大小。 以下是代码：

 var x = function(a,s){ var line = document.getElementById('l1'); if (s > line.getAttribute(a) ) { // if si greater for (var i = line.getAttribute(a); i<=s;i++ ){ line.setAttribute(a, i); } }; if(s < line.getAttribute(a)){ for (var i = line.getAttribute(a); i<s;i-- ){ line.setAttribute(a, i); } }; }; x('x2', 400); // changes the width of the svg x('x2', 40); // fail

 <html> <body> <svg heigth="210" width="500" id="svg1" > <line id="l1" x1="0" y1="50" x2="100" y2="50" style="stroke:rgb(250,30,0); stroke-width:2"/> </svg> </body> </html>

如您所见，它可以增加宽度但不能减小宽度？

我在i<s和i--的第二个if语句中感到困惑，我认为存在所有错误（也许不是）

如果您能解释您的答案，那将非常好，这样它不仅对我有用，而且对其他人也有用。

谢谢！

Answer 1

这样可行

if(s < line.getAttribute(a)){
                for (var i = line.getAttribute(a); i > s;i-- ){ //changes here
                line.setAttribute(a, i);
                }
        };

http://jsfiddle.net/4xnpn3wj/

如何动态更改svg线的宽度

问题描述

1 个解决方案

解决方案1
0 已采纳 2014-11-20 09:17:03

如何动态更改svg线的宽度

问题描述

1 个解决方案

解决方案1 0 已采纳 2014-11-20 09:17:03

解决方案1
0 已采纳 2014-11-20 09:17:03