svg 多边形点 - Javascript - 不工作答案

【问题标题】：svg Polygon Points - Javascript - Not Workingsvg 多边形点 - Javascript - 不工作
【发布时间】：2015-09-20 12:32:48
【问题描述】：

如何通过 JavaScript 控制 svg polygon 的点？尝试以这种方式解决它，但它不起作用。

function points() {
  document.getElementById("polygon").points = "0,100 0,0 100,100";
}

<svg width="100" height="100">
  <polygon id="polygon" points="0,0 100,0 100,100" style="fill:#000;">
</svg>
  
<input type="button" onClick="points" value="Change Polygon Points">

【问题讨论】：

这基本上是同一个多边形，所以你永远不会知道这个函数是否做了什么。

标签： javascript svg polygon

【解决方案1】：

我已经更改了输出多边形，使其看起来与起始多边形不同，否则看起来代码没有做任何事情。

function points() {
  document.getElementById("polygon").setAttribute("points", "100,0 50,0 100,100");
}

<svg width="100" height="100">
  <polygon id="polygon" points="0,0 100,0 100,100" style="fill:#000;">
</svg>
  
<input type="button" onClick="points()" value="Change Polygon Points">

【讨论】：

是的，有点搞砸了。非常感谢！ :)

【解决方案2】：

document.getElementById('polygon1').setAttribute('points', '100, 0 50, 0 100, 100');

【讨论】：