snap svg 尝试旋转具有中心点的对象但不起作用

Question

我学习使用snap svg这个库，想旋转一个物体。但是，我得到了一个奇怪的旋转效果，找不到问题所在。

下面是代码片段，大家可以看看

var s = Snap("#container"); 

//lets draw 2 rects at position 100,100 and then reposition them

var r = s.rect(100,100,100,100).attr({fill: 'red' });

var g = s.group(r);

var bbox = g.getBBox();


s.text(20, 20, bbox.cx);

s.text(20, 40, bbox.cy);

g.animate({ transform: 'r180,'+ bbox.cx + ',' + bbox.cy }, 1000, mina.bounce );

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/snap.svg/0.5.1/snap.svg-min.js"></script>
</head>
<body>
  
  <div style="width: 335px; height: 600px;">
  
    
    <svg width='100%' height='100%' id='container'></svg>
    
  </div>
    
    </body>
</html>

希望有人能告诉我:)

Answer 1

我认为 Snap 0.5/0.5.1 中存在错误，请参阅 here。

我要做的第一件事是尝试 Snap 0.4.1，例如 here，看看是否可以解决问题。我认为它已在 0.5.2 中修复，但不确定它是否可用。

如果没有解决，请更新问题以提及您也尝试过 0.4.1。

snap svg 尝试旋转具有中心点的对象但不起作用

snap svg try to rotate an object with center point but not work

svg

snap.svg