feat(animate): support customize animation for each frame.

antvis · Apr 23, 2018 · 5685e24 · 5685e24
1 parent 8fb20b8
commit 5685e24
Showing 1 changed file with 20 additions and 15 deletions.
diff --git a/src/graphic/animate/timeline.js b/src/graphic/animate/timeline.js
@@ -62,23 +62,28 @@ class Timeline {
       let t = (currentTime - propertyAnim.startTime) / duration;
       t = Math.max(0, Math.min(t, 1));
       t = propertyAnim.easing(t);
-      for (const key in interpolate) {
-        const diff = interpolate[key];
-        const value = diff(t);
-        let newValue;
-        if (key === 'points') {
-          newValue = [];
-          const aLen = Math.max(startState.points.length, endState.points.length);
-          for (let j = 0; j < aLen; j += 2) {
-            newValue.push({
-              x: value[j],
-              y: value[j + 1]
-            });
+
+      if (propertyAnim.onFrame) {
+        propertyAnim.onFrame(t);
+      } else {
+        for (const key in interpolate) {
+          const diff = interpolate[key];
+          const value = diff(t);
+          let newValue;
+          if (key === 'points') {
+            newValue = [];
+            const aLen = Math.max(startState.points.length, endState.points.length);
+            for (let j = 0; j < aLen; j += 2) {
+              newValue.push({
+                x: value[j],
+                y: value[j + 1]
+              });
+            }
+          } else {
+            newValue = value;
           }
-        } else {
-          newValue = value;
+          shape._attrs.attrs[key] = newValue;
         }
-        shape._attrs.attrs[key] = newValue;
       }
 
       const canvas = shape.get('canvas');