WIP(chord): init animation

Author: Ovilia

src/chart/chord/ChordEdge.ts

@@ -113,33 +113,6 @@ export class ChordEdge extends graphic.Path<ChordEdgePathProps> {
         if (firstCreate) {
             el.setShape(shape);
             applyEdgeFill(el, edge, nodeData, lineStyle);
-
-            if (startAngle != null) {
-                const x = shape.cx + shape.r * Math.cos(startAngle);
-                const y = shape.cy + shape.r * Math.sin(startAngle);
-                el.setShape({
-                    s1: [x, y],
-                    s2: [x, y],
-                    sStartAngle: startAngle,
-                    sEndAngle: startAngle,
-                    t1: [x, y],
-                    t2: [x, y],
-                    tStartAngle: startAngle,
-                    tEndAngle: startAngle
-                });
-                graphic.initProps(el, {
-                    shape
-                }, seriesModel, edgeIdx);
-            }
-            else {
-                el.setShape({
-                    sEndAngle: el.shape.sStartAngle,
-                    tEndAngle: el.shape.tStartAngle
-                });
-                graphic.updateProps(el, {
-                    shape
-                }, seriesModel, edgeIdx);
-            }
         }
         else {
             saveOldStyle(el);

src/chart/chord/ChordPiece.ts

@@ -43,24 +43,11 @@ export default class ChordPiece extends graphic.Sector {
 
         if (firstCreate) {
             el.setShape(shape);
-
-            if (startAngle != null) {
-                el.setShape({
-                    startAngle,
-                    endAngle: startAngle
-                });
-                graphic.initProps(el, {
-                    shape: {
-                        startAngle: shape.startAngle,
-                        endAngle: shape.endAngle
-                    }
-                }, seriesModel, idx);
-            }
-            else {
-                graphic.updateProps(el, {
-                    shape: shape
-                }, seriesModel, idx);
-            }
+        }
+        else {
+            graphic.updateProps(el, {
+                shape: shape
+            }, seriesModel, idx);
         }
 
         const sectorShape = extend(

src/chart/chord/ChordView.ts

@@ -26,9 +26,8 @@ import SeriesData from '../../data/SeriesData';
 import ChordSeriesModel from './ChordSeries';
 import ChordPiece from './ChordPiece';
 import { ChordEdge } from './ChordEdge';
-import { normalizeArcAngles } from 'zrender/src/core/PathProxy';
+import { parsePercent } from '../../util/number';
 
-const PI2 = Math.PI * 2;
 const RADIAN = Math.PI / 180;
 
 class ChordView extends ChartView {
@@ -71,6 +70,18 @@ class ChordView extends ChartView {
 
             .execute();
 
+        if (!oldData) {
+            const center = seriesModel.get('center');
+            this.group.scaleX = 0.01;
+            this.group.scaleY = 0.01;
+            this.group.originX = parsePercent(center[0], api.getWidth());
+            this.group.originY = parsePercent(center[1], api.getHeight());
+            graphic.initProps(this.group, {
+                scaleX: 1,
+                scaleY: 1
+            }, seriesModel);
+        }
+
         this._data = data;
 
         this.renderEdges(seriesModel, startAngle);