From ab39c8afa1d6b9ba132e9fbdefd52e093df89401 Mon Sep 17 00:00:00 2001
From: plainheart <yhen@all-my-life.cn>
Date: Thu, 17 Nov 2022 18:48:49 +0800
Subject: [PATCH] fix(dataZoom): fallback to extent start/end when parsed value
 or percent is invalid.

---
 src/component/dataZoom/AxisProxy.ts |  9 +++++++--
 test/axis-lastLabel.html            | 29 ++++++++++-------------------
 2 files changed, 17 insertions(+), 21 deletions(-)

diff --git a/src/component/dataZoom/AxisProxy.ts b/src/component/dataZoom/AxisProxy.ts
index 19a14c9ba8..8c05f8cea7 100644
--- a/src/component/dataZoom/AxisProxy.ts
+++ b/src/component/dataZoom/AxisProxy.ts
@@ -189,8 +189,13 @@ class AxisProxy {
 
             // valueWindow[idx] = round(boundValue);
             // percentWindow[idx] = round(boundPercent);
-            valueWindow[idx] = boundValue;
-            percentWindow[idx] = boundPercent;
+            // fallback to extent start/end when parsed value or percent is invalid
+            valueWindow[idx] = boundValue == null || isNaN(boundValue)
+                ? dataExtent[idx]
+                : boundValue;
+            percentWindow[idx] = boundPercent == null || isNaN(boundPercent)
+                ? percentExtent[idx]
+                : boundPercent;
         });
 
         asc(valueWindow);
diff --git a/test/axis-lastLabel.html b/test/axis-lastLabel.html
index d34e5a39f2..5a8f9b6090 100644
--- a/test/axis-lastLabel.html
+++ b/test/axis-lastLabel.html
@@ -130,10 +130,6 @@
                 'echarts'
             ], function (rainfallData, echarts) {
 
-                var chart = echarts.init(document.getElementById('chart0'), null, {
-
-                });
-
                 var option = {
                     tooltip : {
                         trigger: 'axis'
@@ -204,10 +200,6 @@
                 'echarts'
             ], function (rainfallData, echarts) {
 
-                var chart = echarts.init(document.getElementById('chart1'), null, {
-
-                });
-
                 var option = {
                     tooltip : {
                         trigger: 'axis'
@@ -289,10 +281,6 @@
                 'echarts'
             ], function (rainfallData, echarts) {
 
-                var chart = echarts.init(document.getElementById('chart1'), null, {
-
-                });
-
                 var option = {
                     tooltip: {
                         trigger: 'axis'
@@ -300,8 +288,15 @@
                     dataZoom: {
                         show: true,
                         realtime: true,
-                        startValue: '2009-09-20 12:00',
-                        end: 100
+                        // The `startValue` does not exist in the categories as it's splitted by '-' rather than '/'
+                        // It will fallback to the first category
+                        // The same to `endValue` / `end` / `start`
+                        startValue: '2009-07-20 12:00',
+                        // the `endValue` should work
+                        endValue: '2009/8/20 12:00',
+                        // start: 50,
+                        // end: 60,
+                        // end: 'aaaa'
                     },
                     xAxis: {
                         axisTick: {
@@ -372,10 +367,6 @@
                 'echarts'
             ], function (rainfallData, echarts) {
 
-                var chart = echarts.init(document.getElementById('chart1'), null, {
-
-                });
-
                 var option = {
                     tooltip : {
                         trigger: 'axis',
@@ -461,4 +452,4 @@
 
 
     </body>
-</html>
\ No newline at end of file
+</html>