fix(line): rotate by default if symbolRotate in markLine is not specified or NaN.

plainheart · plainheart · commit f949aebae88f · 2020-04-08T21:44:00.000+08:00
diff --git a/src/chart/helper/Line.js b/src/chart/helper/Line.js
@@ -56,7 +56,10 @@ function createSymbol(name, lineData, idx) {
         symbolSize[0], symbolSize[1], color
     );
 
-    symbolPath.rotation = (symbolRotate || 0) * Math.PI / 180 || 0;
+    // rotate by default if symbolRotate is not specified or NaN
+    symbolPath.rotation = symbolRotate == null || isNaN(symbolRotate)
+        ? undefined
+        : +symbolRotate * Math.PI / 180 || 0;
     symbolPath.name = name;
 
     return symbolPath;
@@ -125,9 +128,11 @@ function updateSymbolAndLabelBeforeLineUpdate() {
     if (symbolFrom) {
         symbolFrom.attr('position', fromPos);
         // Fix #12388
-        //  when symbol is set to be 'arrow' in markLine,
-        //  symbolRotate value will be ignored, and compulsively use tangent angle.
-        if(symbolFrom.shape && symbolFrom.shape.symbolType === 'arrow') {
+        // when symbol is set to be 'arrow' in markLine,
+        // symbolRotate value will be ignored, and compulsively use tangent angle.
+        // rotate by default if symbol rotation is not specified
+        if (symbolFrom.rotation == null
+            || (symbolFrom.shape && symbolFrom.shape.symbolType === 'arrow')) {
             var tangent = line.tangentAt(0);
             symbolFrom.attr('rotation', Math.PI / 2 - Math.atan2(
                 tangent[1], tangent[0]
@@ -140,7 +145,9 @@ function updateSymbolAndLabelBeforeLineUpdate() {
         // Fix #12388
         // when symbol is set to be 'arrow' in markLine,
         // symbolRotate value will be ignored, and compulsively use tangent angle.
-        if(symbolTo.shape && symbolTo.shape.symbolType === 'arrow') {
+        // rotate by default if symbol rotation is not specified
+        if (symbolTo.rotation == null
+            || (symbolTo.shape && symbolTo.shape.symbolType === 'arrow')) {
             var tangent = line.tangentAt(1);
             symbolTo.attr('rotation', -Math.PI / 2 - Math.atan2(
                 tangent[1], tangent[0]
diff --git a/test/markLine-symbolRotate.html b/test/markLine-symbolRotate.html
@@ -116,10 +116,12 @@
                             }),
                             markLine: {
                                 silent: true,
+                                // symbol: 'triangle',
                                 data: [
                                 {
                                     yAxis: 50,
-                                    symbolRotate: 60,
+                                    // symbolRotate: 0,
+                                    // symbolRotate: null,
                                     symbol: 'triangle',
                                     symbolSize: 20
                                 },{
@@ -153,7 +155,8 @@
                                     symbolRotate: 180,
                                     label: {
                                         position: 'start',
-                                        formatter: 'Average'
+                                        formatter: 'Average',
+                                        distance: 10
                                     },
                                     type: 'average',
                                     lineStyle: {
