diff --git a/src/chart/line/LineView.ts b/src/chart/line/LineView.ts
index b40f589de4..893ea43712 100644
--- a/src/chart/line/LineView.ts
+++ b/src/chart/line/LineView.ts
@@ -29,7 +29,7 @@ import {ECPolyline, ECPolygon} from './poly';
 import ChartView from '../../view/Chart';
 import {prepareDataCoordInfo, getStackedOnPoint} from './helper';
 import {createGridClipPath, createPolarClipPath} from '../helper/createClipPathFromCoordSys';
-import LineSeriesModel, { LineEndLabelOption, LineSeriesOption } from './LineSeries';
+import LineSeriesModel, { LineSeriesOption } from './LineSeries';
 import type GlobalModel from '../../model/Global';
 import type ExtensionAPI from '../../core/ExtensionAPI';
 // TODO
@@ -59,11 +59,16 @@ import { convertToColorString } from '../../util/format';
 
 type PolarArea = ReturnType<Polar['getArea']>;
 type Cartesian2DArea = ReturnType<Cartesian2D['getArea']>;
-
 interface SymbolExtended extends SymbolClz {
     __temp: boolean
 }
 
+interface ColorStop {
+    offset: number
+    coord?: number
+    color: ColorString
+}
+
 function isPointsSame(points1: ArrayLike<number>, points2: ArrayLike<number>) {
     if (points1.length !== points2.length) {
         return;
@@ -233,17 +238,17 @@ function getVisualGradient(
     // LinearGradient to render `outerColors`.
 
     const axis = coordSys.getAxis(coordDim);
+    const axisScaleExtent = axis.scale.getExtent();
 
-    interface ColorStop {
-        offset: number
-        coord?: number
-        color: ColorString
-    }
     // dataToCoord mapping may not be linear, but must be monotonic.
     const colorStops: ColorStop[] = zrUtil.map(visualMeta.stops, function (stop) {
+        let coord = axis.toGlobalCoord(axis.dataToCoord(stop.value));
+        // normalize the infinite value
+        isNaN(coord) || isFinite(coord)
+            || (coord = axis.toGlobalCoord(axis.dataToCoord(axisScaleExtent[+(coord < 0)])));
         return {
             offset: 0,
-            coord: axis.toGlobalCoord(axis.dataToCoord(stop.value, true)),
+            coord,
             color: stop.color
         };
     });
diff --git a/test/linear-gradient.html b/test/linear-gradient.html
index 5d06ee210b..5ec82008ac 100644
--- a/test/linear-gradient.html
+++ b/test/linear-gradient.html
@@ -39,8 +39,7 @@
 
         <div id="main0"></div>
         <div id="main1"></div>
-
-
+        <div id="main2"></div>
 
 
 
@@ -87,9 +86,9 @@
                             emphasis: {
                                 focus: 'series'
                             },
-                            lineStyle: {
-                                color: '#FEC171'
-                            },
+                            // lineStyle: {
+                            //     color: '#FEC171'
+                            // },
                             data: [15, 200, 3000, 50000, 1200000],
                             markLine: {
                                 data: [{
@@ -110,35 +109,41 @@
                             emphasis: {
                                 focus: 'series'
                             },
-                            lineStyle: {
-                                color: '#409EFF'
-                            },
+                            // lineStyle: {
+                            //     color: '#409EFF'
+                            // },
                             data: [1200000, 50000, 3000, 200, 15],
                             markLine: {
                                 data: [{
-                                    name: `Y 轴值为 150 的水平线`,
-                                    yAxis: 150
+                                    name: `X 轴值为 4-2 的水平线`,
+                                    xAxis: '4-2'
                                 }],
                                 lineStyle: {
-                                    color: '#30B08F'
+                                    color: 'red'
                                 }
                             }
                         }
                     ],
                     visualMap: {
-                        show: false,
+                        // show: false,
                         pieces: [{
-                            gt: 0,
+                            gte: 0,
                             lte: 150,
                             color: '#30B08F'
                         }, {
                             gt: 150,
                             color: '#C03639'
                         }],
-                        left: '55%',
-                        top: -2,
-                        orient: 'horizontal'
-                    }
+                        outOfRange: {
+                            color: 'gray'
+                        },
+                        right: '10%',
+                        bottom: '10%',
+                        orient: 'vertical'
+                    },
+                    dataZoom: [{
+                        type: 'inside'
+                    }]
                 };
 
                 testHelper.create(echarts, 'main0', {
@@ -223,6 +228,144 @@
 
         </script>
 
+        <script>
+            require(['echarts'], function (echarts) {
+                var option = {
+                    tooltip: {
+                        trigger: 'axis'
+                    },
+                    xAxis: {
+                        type: 'time'
+                    },
+                    yAxis: {
+                        //type: 'log',
+                        //logBase: 2
+                    },
+                    visualMap: {
+                        top: 50,
+                        right: 10,
+                        pieces: [
+                            {
+                                "gte": 300,
+                                "lt": 400,
+                                "color": "#FF2E00"
+                            },
+                            {
+                                "gte": 400,
+                                "color": "#D00000"
+                            }
+                        ],
+                        outOfRange: {
+                            color: '#999'
+                        }
+                    },
+                    dataZoom: [{
+                        startValue: '2014-06-01'
+                    }, {
+                        type: 'inside'
+                    }],
+                    series: {
+                        name: 'Beijing AQI',
+                        type: 'line',
+                        data: [
+                            {
+                                "name": "474eb6f5",
+                                "value": [
+                                    1626943980000,
+                                    128
+                                ]
+                            },
+                            {
+                                "name": "474eb6f5",
+                                "value": [
+                                    1626944040000,
+                                    186
+                                ]
+                            },
+                            {
+                                "name": "474eb6f5",
+                                "value": [
+                                    1626944100000,
+                                    262
+                                ]
+                            },
+                            {
+                                "name": "474eb6f5",
+                                "value": [
+                                    1626944160000,
+                                    231
+                                ]
+                            },
+                            {
+                                "name": "474eb6f5",
+                                "value": [
+                                    1626944220000,
+                                    65
+                                ]
+                            },
+                            {
+                                "name": "474eb6f5",
+                                "value": [
+                                    1626944280000,
+                                    200
+                                ]
+                            },
+                            {
+                                "name": "474eb6f5",
+                                "value": [
+                                    1626944340000,
+                                    31
+                                ]
+                            },
+                            {
+                                "name": "474eb6f5",
+                                "value": [
+                                    1626944400000,
+                                    241
+                                ]
+                            },
+                            {
+                                "name": "474eb6f5",
+                                "value": [
+                                    1626944460000,
+                                    103
+                                ]
+                            },
+                            {
+                                "name": "474eb6f5",
+                                "value": [
+                                    1626944520000,
+                                    172
+                                ]
+                            },
+                            {
+                                "name": "474eb6f5",
+                                "value": [
+                                    1626944580000,
+                                    241
+                                ]
+                            },
+                            {
+                                "name": "474eb6f5",
+                                "value": [
+                                    1626944640000,
+                                    222
+                                ]
+                            }
+                        ]
+                    }
+                };
+
+                testHelper.create(echarts, 'main2', {
+                    title: [
+                        'Line color should be correct when visualMap is enabled',
+                        'Test case from https://github.com/apache/echarts/issues/15407'
+                    ],
+                    option: option
+                });
+            });
+        </script>
+
 
 
     </body>