线的第一个坐标(x0,y0)不影响SVG中的起始位置

Question

我正在我的SVG组件中画一条线,如本博客所示.

svg.append("line")
  .attr({ x0: 300, y0: 100, x1: 340, y1: 200 })
  .attr({ "stroke": "blue", "stroke-width": "1" });

出现该行,但只有第二个坐标(x1,y1)影响其外观.第一个(x0,y0)似乎没有效果,并且该行从原点开始.

我已经尝试添加更多行,希望第二行至少从前一个结束开始,但不是这样.(我不是在寻找折线 - 我只是试图解决问题.)我试图切换回每种方法一个属性的语法.那里也没有运气.

Answer 1

正如你所说的那样

第一个(x0,y0)似乎没有效果,并且该行从原点开始.

因为您的SVG行属性声明而无效

 <line x1="100" y1="100" x2="340" y2="200" style="stroke:rgb(255,0,0);stroke-width:2"/>

因此,行以x1和y1而不是x0和y0开始,以x2,y2结束

希望这就是你要找的东西.