Question

<!DOCTYPE html>
<html>
<body>

<svg width="500" height="500">
<polyline style="fill: lime; stroke: green; stroke-width: 3;" points="0,0,273,133,214,42"/>
</svg>

</body>
</html>

这是我的代码，请问为什么svg多边形的一边有缺少的笔划或边框，但为什么会这样？

<polygon points="200,10 250,190 160,210" style="fill:lime;stroke:purple;stroke-width:3" />

Answer 1

SVG中<polygon>和<polyline>之间的差异是polygon已关闭，即它有一条额外的线将最后一点连接回第一点。

您可以使用polyline手动执行此操作，方法是添加一个与第一个点位于同一位置的额外点。

Answer 2

最后添加额外的0,0。

points="0,0,273,133,214,42,0,0"

为什么svg多边形上缺少笔划

2 个答案: