Snap SVG迭代對象構建動畫屬性

我正在尋找一個涉及Snap SVG的函數，該函數允許我傳入一個對象或值的數組，通過它可以迭代構建動畫屬性。Snap SVG迭代對象構建動畫屬性

例如，如果我能通過： [變換： 't100,100'，轉變： 'r10,10,10']

進入這個：

animateElementWithSnap: function(element, parentSVG, animationValues, duration, easing) { 
     var s = Snap.select("#"+ parentSVG), 
      theElement = s.select("#"+ element); 

     theElement.animate({ 
      // Iterate over Object.keys(animationValues) 
      transform: 't100,100', 
      transform: 'r10,10,10' 
     }, duration, easing); 
    }

來源

2015-06-16 Yuschick

我有點困惑的問題是什麼，你可以傳遞animate（）一個對象，所以我不確定你是否過分簡化了沒有必要的東西。也許如果你在jsfiddle中包含源代碼，那麼問題可能會更加明顯。我也不太明白你想要做什麼2變換，而不是一個組合的變換字符串。 – Ian

你不需要迭代一組屬性。您實際上可以創建animationValues作爲對象。

給你設置你的價值觀是這樣的：

var animationValues = { 
    transform: 't100,100', 
    transform: 'r10,10,10' 
};

然後你就可以改變你的生命的呼喚這樣的：

animateElementWithSnap: function(element, parentSVG, animationValues, duration, easing) { 
    var s = Snap.select("#"+ parentSVG), 
     theElement = s.select("#"+ element); 

    theElement.animate(animationValues, duration, easing); 
};

來源

2015-06-16 20:14:23

Snap SVG迭代對象構建動畫屬性

回答

相關問題