如何使用動畫縮放svg元素？

Question

類似的問題似乎已經問過，但沒有一個解決方案，似乎爲我，所以在這裏工作是我的代碼：

this.animate({scale(2, 2, vinerBBoxX, vinerBBoxY)}, 100, mina.easeinout); 

vinerBBoxX是元素的x中心和vinerBBoxY是y中心，無論是在縮放而沒有動畫效果時工作得很好。

我一般都會遇到縮放問題，網絡上有這麼多的解決方案，我發現完全不可能。請幫忙！

Answer 1

Snap使用其自己的字符串格式進行轉換。 s代表縮放比例，默認情況下它會圍繞其中心縮放。

要設置動畫的屬性是'transform'與scale相反（變換可以在設置時將比例作爲字符串的一部分，例如transform：'scale（2,2）'，但這不會用作動畫，因爲它是。

最簡單的方法是這樣的......

g.animate({ transform: 's2,4'}, 2000) 

您可以組合變換元素，以及像

g.animate({ transform: 't200,200s2,4'}, 2000) 

爲了翻譯「T」 200,200 followe d by scalex，y's'2,4

jsfiddle