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

所以我找到了更新此扩展程序的时间。它可以在凉亭上使用，只要在npm上解决了包冲突。

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

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

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

1 个答案: