请问有人可以解释一下SVG多边形的points属性吗？

Question

我想了解SVG多边形点的工作原理。有没有人能够给出清晰的解释或其他链接，使我可以获得清晰的解释。

如果可能的话，请解释一下这些多边形点在内部是如何工作的，我的意思是它使用了哪种算法？

 <svg height="210" width="500">
  <polygon points="100,10 40,198 190,78 10,78 160,198"
  style="fill:lime;stroke:purple;stroke-width:5;fill-rule:nonzero;" />
</svg>

更新：这个问题的主要意图是多边形如何获取点属性，并将其呈现为多边形在浏览器中显示的方式？

- kernal_lora

Answer 1

polygon接收一个points列表（参考这里），其中包含每个点的X和Y坐标对。

在你的示例中，你有

points="100,10 40,198 190,78 10,78 160,198"

这是五个“角”，从（100,10）开始，然后连一条线到（40, 198），以此类推。最后一个点与第一个点相连形成闭合的多边形。

文档告诉我们：

每个点在用户坐标系中由X和Y坐标定义。

单位为像素，并且

初始视口坐标系（因此初始用户坐标系）原点位于视口的左上角，正x轴向右，正y轴向下。

（来自这里）

因此，100,10表示向右100像素，向下10像素。

- doctorlove

Answer 2

元素用于创建至少三个边的图形。多边形由直线组成，形状是“封闭的”（所有线连接在一起）。您可以在这里看到一些示例。

- fernando

---

Maky- 感谢您的快速回复。 这不是我要找的，我正在寻找每个点（x和y坐标）的说明。 例如：100,10 40,198 190,78 10,78 160,198 在上面的坐标中，100,10表示什么，40,198表示什么，我需要知道每个点。 - kernal_lora

链接返回404。 - Shahriar