寻找svg多边形的点答案

【问题标题】：Finding point of svg polygon寻找svg多边形的点
【发布时间】：2018-03-07 21:42:43
【问题描述】：

我有一个 SVG 对象，一个具有 3 个点的多边形。我想使用 javascript 来旋转多边形并在该点附近添加文本。如何找到点的坐标？

<svg width="165" height="165" style="border: 1px solid black; ">
  <path d="M5 0   Q 80 70 160 0" stroke="black" fill="transparent"/>
  <path d="M5 165 Q 80 90 160 165" stroke="black" fill="transparent"/>

  <polygon points="77.5,20 87.5,20 82.5,75" 
           style="fill:transparent;stroke:black;stroke-width:1"                                                   transform="rotate(90 82.5 20) " />

</svg>

我想将多边形从原来的 90 度位置旋转到 0 到 -180 度之间，并在尖端添加一个标签，以便用户知道它旋转了多远。

【问题讨论】：

对这两个问题都是肯定的。
@OvidiuDolha 这很公平。我改变了我的问题，以深入到我真正感到困惑的地方。

标签： javascript svg

【解决方案1】：

要旋转多边形，您可以使用 CSS 变换属性，例如

.svg-el {
 transform: rotate(90deg);
}

要为您使用 JS 操作的多边形中的任何路径或点设置动画，您可以使用像animejs http://animejs.com/documentation/#motionPath这样的库

【讨论】：