diff --git a/src/chart/line/LineView.js b/src/chart/line/LineView.js
index 70c27a0277a25038fc88131020f884cbbbe85a82..49362e0d437bd1b8e37d41199fb0d3c962f469c8 100644
--- a/src/chart/line/LineView.js
+++ b/src/chart/line/LineView.js
@@ -453,6 +453,9 @@ export default ChartView.extend({
         }
 
         var visualColor = getVisualGradient(data, coordSys) || data.getVisual('color');
+        if (typeof visualColor === 'function') {
+            visualColor = visualColor(seriesModel.getDataParams(0)) || '#000000';
+        }
 
         polyline.useStyle(zrUtil.defaults(
             // Use color in lineStyle first
diff --git a/test/line-itemstyle-color-function.html b/test/line-itemstyle-color-function.html
new file mode 100644
index 0000000000000000000000000000000000000000..db4978ac794c4575cae5a90691edd234e38b0f20
--- /dev/null
+++ b/test/line-itemstyle-color-function.html
@@ -0,0 +1,91 @@
+<!DOCTYPE html>
+<!--
+Licensed to the Apache Software Foundation (ASF) under one
+or more contributor license agreements.  See the NOTICE file
+distributed with this work for additional information
+regarding copyright ownership.  The ASF licenses this file
+to you under the Apache License, Version 2.0 (the
+"License"); you may not use this file except in compliance
+with the License.  You may obtain a copy of the License at
+
+   http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing,
+software distributed under the License is distributed on an
+"AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+KIND, either express or implied.  See the License for the
+specific language governing permissions and limitations
+under the License.
+-->
+<html>
+
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <script src="lib/esl.js"></script>
+    <script src="lib/config.js"></script>
+    <script src="lib/facePrint.js"></script>
+    <script src="lib/testHelper.js"></script>
+    <link rel="stylesheet" href="lib/reset.css" />
+</head>
+
+<body>
+    <div id="main0"></div>
+    <div></div>
+    <script>
+        var chart;
+        var myChart;
+
+        require([
+            'echarts'
+        ], function (echarts) {
+            var option = {
+                legend: {
+                    data: ['回调颜色', '固定颜色'],
+                    left: 'center',
+                    bottom: 'bottom'
+                },
+                xAxis: {
+                    type: 'category',
+                    data: [100, 200, 20, 30, 60, 89],
+                },
+                yAxis: {
+                    type: 'value',
+                },
+                series: [
+                    {
+                        name: '固定颜色',
+                        type: 'line',
+                        data: [123, 568, 111, 222, 123, 56],
+                        itemStyle: {
+                            color: param => {
+                                return colorList[param.seriesIndex]
+                            },
+                            borderWidth: 10,
+                        },
+                        smooth: true
+                    },
+                    {
+                        name: '回调颜色',
+                        type: 'line',
+                        data: [800, 900, 220, 130, 660, 289],
+                        itemStyle: {
+                            color: param => {
+                                return colorList[param.seriesIndex]
+                            },
+                            borderWidth: 10,
+                        },
+                        smooth: true
+                    }
+                ]
+            };
+
+            chart = myChart = testHelper.create(echarts, 'main0', {
+                option: option
+            });
+        });
+
+    </script>
+</body>
+
+</html>
