如何创建一个" U"形状使用Snap.svg?

时间:2017-04-18 18:30:01

标签: javascript svg polyline snap.svg

我需要使用javascript创建反向U形,但我无法弄明白。有点像这条折线形状,但最后弯曲,使用这些相同的点。我找到了带有曲线和东西的复杂动画的代码示例,但并不简单。

var lsvg = Snap('#svg');

var arrow = lsvg.polyline([6,10, 3,0, 0,10]).attr({stroke: '#000', fill: '#f2f4f3'});

Jsbin

1 个答案:

答案 0 :(得分:0)

我最终遵循了Ian的建议,并使用了path命令。我实际上想用它作为一条线的标记,每次我使用U字母(作为文本)时它都会变形,所以这就是为什么我不能这样做。

var arrow = lsvg.path("M20,30 Q10,0 0,30").attr({stroke: '#000', fill:"none" });

我用了三点:(20,30),(10,0),(0,30)。

Updated Jsbin