通过路径绘制的多边形与使用SVG中的多边形绘制的示例对比

Question

我想学习SVG，并尝试学习如何使用点（通过多边形）或通过路径（path）动态呈现相同的图像。

我想要几个例子，其中包含同一个多边形（三角形，正方形和五边形就足够了），分别用SVG多边形和SVG路径绘制，以便我可以比较代码。我可以找到分别由两种方法绘制的单独图像，但没有相同的。

- chris Frisina

Answer 1

很简单：你基本上可以通过在多边形的points属性前添加M，并在末尾添加z，将其转换为路径的d属性。

<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%">
  <polygon points="20,20 100,20 100,100 30,110"/>
  <path        d="M20,20 100,20 100,100 30,110z" fill="green" transform="translate(100,0)"/>
</svg>

- Thomas W

---

视觉比较胜利。 - Bob Stein

Answer 2

两者都可以创建形状。

多边形会在至少绘制三条边后自动关闭形状（通过返回到第一个点），由一系列相连的直线组成，这意味着它不适合缩放。

路径可以使用直线或曲线，并且不会自动关闭形状。路径可能是SVG中最强大的基本形状元素。

来源

- TECNO

---

多边形和路径在一系列点上的缩放效果是完全相同的。这个说法需要进一步解释。 - QueueHammer

编辑以提高清晰度（似乎源文指的是多功能性而非规模） - undefined