SVG.js：形状扩展：动画错误

Question

下面是一个使用 SVG.js 形状扩展创建星形的示例。当我请求将其从 7 点（尖峰）设置为 10 点（尖峰）时，它会生成错误。

有什么想法吗？

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>SVG.js - Shapes Extension: animate error</title>
    <script type="text/javascript" src="//svgDiscovery.com/SVG.js/svg.js"></script>
    <script type="text/javascript" src="//svgDiscovery.com/SVG.js/Plugins/svg.shapes.js"></script>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <meta name="viewport" content="width=device-width">
</head>
<body style='padding:10px;font-family:arial;'>
<center>
<h4>SVG.js - Shapes Extension: animate error</h4>
<table>
<tr>
<td>
<div id="svgDiv" style='background-color:lightgreen;width:400px;height:400px;'></div>
</td>
</tr></table>
<script id=myScript>
//---access the empty DIV---
var mySVG = SVG('svgDiv').size(400, 400);

var myStar = mySVG.polygon().attr({id:'myPolygon',stroke:'blue','stroke-width':3,fill:'yellow'}).star({
  inner:  50
, outer:  100
, spikes: 7
}).move(100,100)

//---creates error---
 myStar.animate().star({ spikes: 10 })
</script>
</body>
</html>

Answer 1

所以我抽空更新了这个扩展。它可以在 bower 上使用，只要在 npm 上解决了包冲突。

它现在需要 svg.js 的第 2 版并且完全按照您指定的方式工作

mySVG
  .polygon()
  .ngon()
  .animate()
  .star()

SVG.js：形状扩展：动画错误

SVG.js : Shapes extension: animate error

javascript

svg

svg.js