通过路径绘制的多边形与SVG中的多边形的示例 [英] Examples of polygons drawn by path vs polygon in SVG

问题描述

我想学习SVG，并且正在尝试学习如何通过使用点(带有多边形)或通过路径(路径)动态渲染同一张图像.

I would like to learn SVG, and am trying to learn how the same image can be rendered by using either the point (with polygon) or by dynamically by paths (path).

我想在SVG多边形和SVG路径中都使用SAME多边形的一些示例(三角形，正方形和五边形足以开始)，以便我可以比较代码.我可以找到由任何一个绘制的单个图像，但没有一个是相同的.

I would like a few examples of the SAME polygon (triangle, square, and pentagon are enough to begin) in BOTH SVG polygon AND SVG path, so that I can compare the code. I can find individual images drawn by either, but none that are the SAME.

推荐答案

这很简单:基本上可以通过添加M并添加z.

It's trivial: You can basically take the points attribute of a polygon and turn it into a path's d attribute by prepending M and appending z.

<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>

这篇关于通过路径绘制的多边形与SVG中的多边形的示例的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！