You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@echarts.apache.org by sh...@apache.org on 2019/11/22 15:56:52 UTC

[incubator-echarts] branch minor-ticks updated: feat(axis): add minor ticks on polar. more test cases.

This is an automated email from the ASF dual-hosted git repository.

shenyi pushed a commit to branch minor-ticks
in repository https://gitbox.apache.org/repos/asf/incubator-echarts.git


The following commit(s) were added to refs/heads/minor-ticks by this push:
     new 5d4eae7  feat(axis): add minor ticks on polar. more test cases.
5d4eae7 is described below

commit 5d4eae79f5d3449ba488d8c87794a91ce48e0bd9
Author: pissang <bm...@gmail.com>
AuthorDate: Fri Nov 22 23:56:07 2019 +0800

    feat(axis): add minor ticks on polar. more test cases.
---
 src/component/axis/AngleAxisView.js      |  80 ++++++-
 src/component/axis/AxisBuilder.js        |   6 +-
 src/component/axis/CartesianAxisView.js  |   4 +-
 src/component/axis/RadiusAxisView.js     |  41 +++-
 src/coord/Axis.js                        |   7 +-
 src/coord/axisDefault.js                 |  51 +++--
 test/axis-minorTick.html                 | 349 +++++++++++++++++++++++++++----
 test/dynamicData.html                    |   8 +-
 test/dynamicData2.html                   |  13 +-
 test/runTest/actions/__meta__.json       |   1 +
 test/runTest/actions/axis-minorTick.json |   1 +
 11 files changed, 474 insertions(+), 87 deletions(-)

diff --git a/src/component/axis/AngleAxisView.js b/src/component/axis/AngleAxisView.js
index cff1689..4dfaf42 100644
--- a/src/component/axis/AngleAxisView.js
+++ b/src/component/axis/AngleAxisView.js
@@ -23,7 +23,7 @@ import Model from '../../model/Model';
 import AxisView from './AxisView';
 import AxisBuilder from './AxisBuilder';
 
-var elementList = ['axisLine', 'axisLabel', 'axisTick', 'splitLine', 'splitArea'];
+var elementList = ['axisLine', 'axisLabel', 'axisTick', 'minorTick', 'splitLine', 'minorSplitLine', 'splitArea'];
 
 function getAxisLineShape(polar, rExtent, angle) {
     rExtent[1] > rExtent[0] && (rExtent = rExtent.slice().reverse());
@@ -72,6 +72,8 @@ export default AxisView.extend({
         var radiusExtent = polar.getRadiusAxis().getExtent();
 
         var ticksAngles = angleAxis.getTicksCoords();
+        var minorTickAngles = angleAxis.getMinorTicksCoords();
+
         var labels = zrUtil.map(angleAxis.getViewLabels(), function (labelItem) {
             var labelItem = zrUtil.clone(labelItem);
             labelItem.coord = angleAxis.dataToCoord(labelItem.tickValue);
@@ -85,7 +87,7 @@ export default AxisView.extend({
             if (angleAxisModel.get(name + '.show')
                 && (!angleAxis.scale.isBlank() || name === 'axisLine')
             ) {
-                this['_' + name](angleAxisModel, polar, ticksAngles, radiusExtent, labels);
+                this['_' + name](angleAxisModel, polar, ticksAngles, minorTickAngles, radiusExtent, labels);
             }
         }, this);
     },
@@ -133,7 +135,7 @@ export default AxisView.extend({
     /**
      * @private
      */
-    _axisTick: function (angleAxisModel, polar, ticksAngles, radiusExtent) {
+    _axisTick: function (angleAxisModel, polar, ticksAngles, minorTickAngles, radiusExtent) {
         var tickModel = angleAxisModel.getModel('axisTick');
 
         var tickLen = (tickModel.get('inside') ? -1 : 1) * tickModel.get('length');
@@ -159,7 +161,45 @@ export default AxisView.extend({
     /**
      * @private
      */
-    _axisLabel: function (angleAxisModel, polar, ticksAngles, radiusExtent, labels) {
+    _minorTick: function (angleAxisModel, polar, tickAngles, minorTickAngles, radiusExtent) {
+        if (!minorTickAngles.length) {
+            return;
+        }
+
+        var tickModel = angleAxisModel.getModel('axisTick');
+        var minorTickModel = angleAxisModel.getModel('minorTick');
+
+        var tickLen = (tickModel.get('inside') ? -1 : 1) * minorTickModel.get('length');
+        var radius = radiusExtent[getRadiusIdx(polar)];
+
+        var lines = [];
+
+        for (var i = 0; i < minorTickAngles.length; i++) {
+            for (let k = 0; k < minorTickAngles[i].length; k++) {
+                lines.push(new graphic.Line({
+                    shape: getAxisLineShape(polar, [radius, radius + tickLen], minorTickAngles[i][k].coord)
+                }));
+            }
+        }
+
+        this.group.add(graphic.mergePath(
+            lines, {
+                style: zrUtil.defaults(
+                    minorTickModel.getModel('lineStyle').getLineStyle(),
+                    zrUtil.defaults(
+                        tickModel.getLineStyle(), {
+                            stroke: angleAxisModel.get('axisLine.lineStyle.color')
+                        }
+                    )
+                )
+            }
+        ));
+    },
+
+    /**
+     * @private
+     */
+    _axisLabel: function (angleAxisModel, polar, ticksAngles, minorTickAngles, radiusExtent, labels) {
         var rawCategoryData = angleAxisModel.getCategories(true);
 
         var commonLabelModel = angleAxisModel.getModel('axisLabel');
@@ -214,7 +254,7 @@ export default AxisView.extend({
     /**
      * @private
      */
-    _splitLine: function (angleAxisModel, polar, ticksAngles, radiusExtent) {
+    _splitLine: function (angleAxisModel, polar, ticksAngles, minorTickAngles, radiusExtent) {
         var splitLineModel = angleAxisModel.getModel('splitLine');
         var lineStyleModel = splitLineModel.getModel('lineStyle');
         var lineColors = lineStyleModel.get('color');
@@ -248,7 +288,35 @@ export default AxisView.extend({
     /**
      * @private
      */
-    _splitArea: function (angleAxisModel, polar, ticksAngles, radiusExtent) {
+    _minorSplitLine: function (angleAxisModel, polar, ticksAngles, minorTickAngles, radiusExtent) {
+        if (!minorTickAngles.length) {
+            return;
+        }
+
+        var minorSplitLineModel = angleAxisModel.getModel('minorSplitLine');
+        var lineStyleModel = minorSplitLineModel.getModel('lineStyle');
+
+        var lines = [];
+
+        for (var i = 0; i < minorTickAngles.length; i++) {
+            for (let k = 0; k < minorTickAngles[i].length; k++) {
+                lines.push(new graphic.Line({
+                    shape: getAxisLineShape(polar, radiusExtent, minorTickAngles[i][k].coord)
+                }));
+            }
+        }
+
+        this.group.add(graphic.mergePath(lines, {
+            style: lineStyleModel.getLineStyle(),
+            silent: true,
+            z: angleAxisModel.get('z')
+        }));
+    },
+
+    /**
+     * @private
+     */
+    _splitArea: function (angleAxisModel, polar, ticksAngles, minorTickAngles, radiusExtent) {
         if (!ticksAngles.length) {
             return;
         }
diff --git a/src/component/axis/AxisBuilder.js b/src/component/axis/AxisBuilder.js
index 72f8841..12e4539 100644
--- a/src/component/axis/AxisBuilder.js
+++ b/src/component/axis/AxisBuilder.js
@@ -576,7 +576,7 @@ function createTicks(ticksCoords, tickTransform, tickEndCoord, tickLineStyle, an
     var pt1 = [];
     var pt2 = [];
     for (var i = 0; i < ticksCoords.length; i++) {
-        var tickCoord = ticksCoords[i];
+        var tickCoord = ticksCoords[i].coord;
 
         pt1[0] = tickCoord;
         pt1[1] = 0;
@@ -619,9 +619,7 @@ function buildAxisMajorTicks(axisBuilder, axisModel, opt) {
     var lineStyleModel = tickModel.getModel('lineStyle');
     var tickEndCoord = opt.tickDirection * tickModel.get('length');
 
-    var ticksCoords = map(axis.getTicksCoords(), function (item) {
-        return item.coord;
-    });
+    var ticksCoords = axis.getTicksCoords();
 
     var ticksEls = createTicks(ticksCoords, axisBuilder._transform, tickEndCoord, defaults(
         lineStyleModel.getLineStyle(),
diff --git a/src/component/axis/CartesianAxisView.js b/src/component/axis/CartesianAxisView.js
index bc84a15..cc57949 100644
--- a/src/component/axis/CartesianAxisView.js
+++ b/src/component/axis/CartesianAxisView.js
@@ -172,7 +172,7 @@ var CartesianAxisView = AxisView.extend({
 
         for (var i = 0; i < minorTicksCoords.length; i++) {
             for (let k = 0; k < minorTicksCoords[i].length; k++) {
-                var tickCoord = axis.toGlobalCoord(minorTicksCoords[i][k]);
+                var tickCoord = axis.toGlobalCoord(minorTicksCoords[i][k].coord);
 
                 if (isHorizontal) {
                     p1[0] = tickCoord;
@@ -188,7 +188,7 @@ var CartesianAxisView = AxisView.extend({
                 }
 
                 this._axisGroup.add(new graphic.Line({
-                    anid: 'line_' + i + '_' + k,
+                    anid: 'minor_line_' + minorTicksCoords[i][k].tickValue,
                     subPixelOptimize: true,
                     shape: {
                         x1: p1[0],
diff --git a/src/component/axis/RadiusAxisView.js b/src/component/axis/RadiusAxisView.js
index 7d9a136..16b72eb 100644
--- a/src/component/axis/RadiusAxisView.js
+++ b/src/component/axis/RadiusAxisView.js
@@ -26,7 +26,7 @@ var axisBuilderAttrs = [
     'axisLine', 'axisTickLabel', 'axisName'
 ];
 var selfBuilderAttrs = [
-    'splitLine', 'splitArea'
+    'splitLine', 'splitArea', 'minorSplitLine'
 ];
 
 export default AxisView.extend({
@@ -44,6 +44,7 @@ export default AxisView.extend({
         var polar = radiusAxis.polar;
         var angleAxis = polar.getAngleAxis();
         var ticksCoords = radiusAxis.getTicksCoords();
+        var minorTicksCoords = radiusAxis.getMinorTicksCoords();
         var axisAngle = angleAxis.getExtent()[0];
         var radiusExtent = radiusAxis.getExtent();
 
@@ -54,7 +55,7 @@ export default AxisView.extend({
 
         zrUtil.each(selfBuilderAttrs, function (name) {
             if (radiusAxisModel.get(name + '.show') && !radiusAxis.scale.isBlank()) {
-                this['_' + name](radiusAxisModel, polar, axisAngle, radiusExtent, ticksCoords);
+                this['_' + name](radiusAxisModel, polar, axisAngle, radiusExtent, ticksCoords, minorTicksCoords);
             }
         }, this);
     },
@@ -80,8 +81,7 @@ export default AxisView.extend({
                     cx: polar.cx,
                     cy: polar.cy,
                     r: ticksCoords[i].coord
-                },
-                silent: true
+                }
             }));
         }
 
@@ -101,6 +101,39 @@ export default AxisView.extend({
     /**
      * @private
      */
+    _minorSplitLine: function (radiusAxisModel, polar, axisAngle, radiusExtent, ticksCoords, minorTicksCoords) {
+        if (!minorTicksCoords.length) {
+            return;
+        }
+
+        var minorSplitLineModel = radiusAxisModel.getModel('minorSplitLine');
+        var lineStyleModel = minorSplitLineModel.getModel('lineStyle');
+
+        var lines = [];
+
+        for (var i = 0; i < minorTicksCoords.length; i++) {
+            for (let k = 0; k < minorTicksCoords[i].length; k++) {
+                lines.push(new graphic.Circle({
+                    shape: {
+                        cx: polar.cx,
+                        cy: polar.cy,
+                        r: minorTicksCoords[i][k].coord
+                    }
+                }));
+            }
+        }
+
+        this.group.add(graphic.mergePath(lines, {
+            style: zrUtil.defaults({
+                fill: null
+            }, lineStyleModel.getLineStyle()),
+            silent: true
+        }));
+    },
+
+    /**
+     * @private
+     */
     _splitArea: function (radiusAxisModel, polar, axisAngle, radiusExtent, ticksCoords) {
         if (!ticksCoords.length) {
             return;
diff --git a/src/coord/Axis.js b/src/coord/Axis.js
index dc11518..67964de 100644
--- a/src/coord/Axis.js
+++ b/src/coord/Axis.js
@@ -206,7 +206,7 @@ Axis.prototype = {
     },
 
     /**
-     * @return {Array.<Array.<number>>}
+     * @return {Array.<Array.<Object>>} [{ coord: ..., tickValue: ...}]
      */
     getMinorTicksCoords: function (opt) {
         if (this.scale.type === 'ordinal') {
@@ -224,7 +224,10 @@ Axis.prototype = {
         var minorTicks = this.scale.getMinorTicks(splitNumber);
         var minorTicksCoords = map(minorTicks, function (minorTicksGroup) {
             return map(minorTicksGroup, function (minorTick) {
-                return this.dataToCoord(minorTick);
+                return {
+                    coord: this.dataToCoord(minorTick),
+                    tickValue: minorTick
+                };
             }, this);
         }, this);
         return minorTicksCoords;
diff --git a/src/coord/axisDefault.js b/src/coord/axisDefault.js
index f475f65..90a00a0 100644
--- a/src/coord/axisDefault.js
+++ b/src/coord/axisDefault.js
@@ -102,31 +102,6 @@ var defaultOption = {
         areaStyle: {
             color: ['rgba(250,250,250,0.3)', 'rgba(200,200,200,0.3)']
         }
-    },
-
-    minorTick: {
-        // Minor tick, not available for cateogry axis.
-        show: false,
-        // Split number of minor ticks. The value should be in range of (0, 100)
-        splitNumber: 5,
-        // Lenght of minor tick
-        length: 3,
-
-        // Same inside with axisTick
-
-        // Line style
-        lineStyle: {
-            // Default to be same with axisTick
-        }
-    },
-
-    minorSplitLine: {
-        show: false,
-
-        lineStyle: {
-            color: '#eee',
-            width: 1
-        }
     }
 };
 
@@ -191,7 +166,7 @@ axisDefault.valueAxis = zrUtil.merge({
     // scale: false,
 
     // AxisTick and axisLabel and splitLine are caculated based on splitNumber.
-    splitNumber: 5
+    splitNumber: 5,
 
     // Interval specifies the span of the ticks is mandatorily.
     // interval: null
@@ -202,6 +177,30 @@ axisDefault.valueAxis = zrUtil.merge({
     // Specify max interval when auto calculate tick interval.
     // maxInterval: null
 
+    minorTick: {
+        // Minor tick, not available for cateogry axis.
+        show: false,
+        // Split number of minor ticks. The value should be in range of (0, 100)
+        splitNumber: 5,
+        // Lenght of minor tick
+        length: 3,
+
+        // Same inside with axisTick
+
+        // Line style
+        lineStyle: {
+            // Default to be same with axisTick
+        }
+    },
+
+    minorSplitLine: {
+        show: false,
+
+        lineStyle: {
+            color: '#eee',
+            width: 1
+        }
+    }
 }, defaultOption);
 
 axisDefault.timeAxis = zrUtil.defaults({
diff --git a/test/axis-minorTick.html b/test/axis-minorTick.html
index 5f0b48d..f29e966 100644
--- a/test/axis-minorTick.html
+++ b/test/axis-minorTick.html
@@ -141,7 +141,8 @@ under the License.
                     type: 'log',
                     name: 'y',
                     minorTick: {
-                        show: true
+                        show: true,
+                        splitNumber: 10
                     },
                     minorSplitLine: {
                         show: true
@@ -161,7 +162,7 @@ under the License.
 
             var chart = testHelper.create(echarts, 'main2', {
                 title: [
-                    'Minor Ticks for Log'
+                    'Minor Ticks for Log Axis'
                 ],
                 option: option
             });
@@ -173,24 +174,66 @@ under the License.
             var option;
 
             option = {
-                xAxis: {
-                    type: 'category',
-                    boundaryGap: false,
-                    data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
+                grid: {
+                    left: '3%',
+                    right: '7%',
+                    bottom: '3%',
+                    containLabel: true
                 },
-                yAxis: {
-                    type: 'value',
-                    minorTick: {
-                        show: true
+                xAxis : [
+                    {
+                        type : 'value',
+                        scale: true,
+                        axisLabel : {
+                            formatter: '{value} cm'
+                        },
+                        splitLine: {
+                            show: true,
+                            lineStyle: {
+                                color: '#999'
+                            }
+                        },
+                        minorTick: {
+                            show: true
+                        },
+                        minorSplitLine: {
+                            show: true
+                        }
+                    }
+                ],
+                yAxis : [
+                    {
+                        type : 'value',
+                        scale: true,
+                        axisLabel : {
+                            formatter: '{value} kg'
+                        },
+                        splitLine: {
+                            show: true,
+                            lineStyle: {
+                                color: '#999'
+                            }
+                        },
+                        minorTick: {
+                            show: true
+                        },
+                        minorSplitLine: {
+                            show: true
+                        }
+                    }
+                ],
+                series : [
+                    {
+                        name:'女性',
+                        type:'scatter',
+                        data: [[161.2, 51.6], [167.5, 59.0], [159.5, 49.2], [157.0, 63.0], [155.8, 53.6],[170.0, 59.0], [159.1, 47.6], [166.0, 69.8], [176.2, 66.8], [160.2, 75.2],[172.5, 55.2], [170.9, 54.2], [172.9, 62.5], [153.4, 42.0], [160.0, 50.0],[147.2, 49.8], [168.2, 49.2], [175.0, 73.2], [157.0, 47.8], [167.6, 68.8],[159.5, 50.6], [175.0, 82.5], [166.8, 57.2], [176.5, 87.8], [170.2, 72.8],[174.0, 54.5], [173.0, 59.8], [179.9, 67.3], [170.5, 67.8], [160.0, 47.0],[154.4, 46.2], [1 [...]
                     },
-                    minorSplitLine: {
-                        show: true
+                    {
+                        name:'男性',
+                        type:'scatter',
+                        data: [[174.0, 65.6], [175.3, 71.8], [193.5, 80.7], [186.5, 72.6], [187.2, 78.8],[181.5, 74.8], [184.0, 86.4], [184.5, 78.4], [175.0, 62.0], [184.0, 81.6],[180.0, 76.6], [177.8, 83.6], [192.0, 90.0], [176.0, 74.6], [174.0, 71.0],[184.0, 79.6], [192.7, 93.8], [171.5, 70.0], [173.0, 72.4], [176.0, 85.9],[176.0, 78.8], [180.5, 77.8], [172.7, 66.2], [176.0, 86.4], [173.5, 81.8],[178.0, 89.6], [180.3, 82.8], [180.3, 76.4], [164.5, 63.2], [173.0, 60.9],[183.5, 74.8], [1 [...]
                     }
-                },
-                series: [{
-                    data: [820, 932, 901, 934, 1290, 1330, 1320],
-                    type: 'line'
-                }]
+                ]
             };
 
             var chart = testHelper.create(echarts, 'main3', {
@@ -207,24 +250,83 @@ under the License.
             var option;
 
             option = {
-                xAxis: {
-                    type: 'category',
-                    boundaryGap: false,
-                    data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
+                grid: {
+                    left: '3%',
+                    right: '7%',
+                    bottom: '3%',
+                    containLabel: true
                 },
-                yAxis: {
-                    type: 'value',
-                    minorTick: {
-                        show: true
-                    },
-                    minorSplitLine: {
-                        show: true
+                xAxis : [
+                    {
+                        type : 'value',
+                        min: 11.35,
+                        max: 15.13,
+                        splitLine: {
+                            show: true,
+                            lineStyle: {
+                                color: '#555'
+                            }
+                        },
+                        axisTick: {
+                            inside: true,
+                            length: 20,
+                            lineStyle: {
+                                width: 4
+                            }
+                        },
+                        minorTick: {
+                            show: true,
+                            length: 10,
+                            splitNumber: 10,
+                            lineStyle: {
+                                color: 'red',
+                                width: 2
+                            }
+                        },
+                        minorSplitLine: {
+                            show: true,
+                            lineStyle: {
+                                color: 'rgba(255, 0, 0, 0.5)'
+                            }
+                        }
                     }
-                },
-                series: [{
-                    data: [820, 932, 901, 934, 1290, 1330, 1320],
-                    type: 'line'
-                }]
+                ],
+                yAxis : [
+                    {
+                        type : 'value',
+                        min: 7.4,
+                        max: 20.3,
+                        splitLine: {
+                            show: true,
+                            lineStyle: {
+                                color: '#555'
+                            }
+                        },
+                        axisTick: {
+                            inside: true,
+                            length: 20,
+                            lineStyle: {
+                                width: 4
+                            }
+                        },
+                        minorTick: {
+                            show: true,
+                            length: 10,
+                            splitNumber: 3,
+                            lineStyle: {
+                                color: 'green',
+                                width: 2
+                            }
+                        },
+                        minorSplitLine: {
+                            show: true,
+                            lineStyle: {
+                                color: 'rgba(0, 255, 0, 0.5)'
+                            }
+                        }
+                    }
+                ],
+                series : []
             };
 
             var chart = testHelper.create(echarts, 'main4', {
@@ -239,9 +341,79 @@ under the License.
 
         <script>
         require(['echarts'/*, 'map/js/china' */], function (echarts) {
-            var option;
 
-            option = {};
+            var option = {
+                legend: {
+                    data: ['line']
+                },
+                polar: {},
+                tooltip: {
+                    trigger: 'axis',
+                    axisPointer: {
+                        type: 'cross'
+                    }
+                },
+                angleAxis: {
+                    type: 'value',
+                    startAngle: 90,
+                    min: 0,
+                    max: 12,
+                    interval: 3,
+                    axisTick: {
+                        inside: true,
+                        length: 20,
+                        lineStyle: {
+                            width: 4
+                        }
+                    },
+                    splitLine: {
+                        lineStyle: {
+                            color: '#333'
+                        }
+                    },
+                    minorTick: {
+                        show: true,
+                        length: 10,
+                        splitNumber: 5,
+                        lineStyle: {
+                            color: 'red',
+                            width: 2
+                        }
+                    },
+                    minorSplitLine: {
+                        show: true,
+                        lineStyle: {
+                            color: 'rgba(255, 0, 0, 0.5)'
+                        }
+                    }
+                },
+                radiusAxis: {
+                    min: 10,
+                    max: 20,
+                    minorTick: {
+                        show: true
+                    },
+                    axisTick: {
+                        length: 8
+                    },
+                    minorTick: {
+                        show: true,
+                        length: 4,
+                        splitNumber: 3,
+                        lineStyle: {
+                            color: 'green',
+                            width: 2
+                        }
+                    },
+                    minorSplitLine: {
+                        show: true,
+                        lineStyle: {
+                            color: 'rgba(0, 255, 0, 0.5)'
+                        }
+                    }
+                },
+                series: []
+            };
 
             var chart = testHelper.create(echarts, 'main5', {
                 title: [
@@ -256,13 +428,114 @@ under the License.
 
         <script>
         require(['echarts'/*, 'map/js/china' */], function (echarts) {
-            var option;
 
-            option = {};
+            var data1 = [];
+            var data2 = [];
+            var data3 = [];
+
+            var random = function (max) {
+                return (Math.random() * max).toFixed(3);
+            };
+
+            for (var i = 0; i < 10000; i++) {
+                data1.push([random(15), random(10), random(1)]);
+                // data1.push([i, 10, i]);
+                data2.push([random(10), random(10), random(1)]);
+                data3.push([random(15), random(10), random(1)]);
+            }
+
+            option = {
+                    animation: false,
+                    xAxis: {
+                        type: 'value',
+                        min: 'dataMin',
+                        max: 'dataMax',
+                        axisTick: {
+                            inside: true
+                        },
+                        minorTick: {
+                            show: true
+                        },
+                        minorSplitLine: {
+                            show: true
+                        },
+                        splitLine: {
+                            show: true
+                        }
+                    },
+                    yAxis: {
+                        type: 'value',
+                        min: 'dataMin',
+                        max: 'dataMax',
+                        axisTick: {
+                            inside: true
+                        },
+                        minorTick: {
+                            show: true
+                        },
+                        minorSplitLine: {
+                            show: true
+                        },
+                        splitLine: {
+                            show: true
+                        }
+                    },
+                    dataZoom: [
+                        {
+                            show: true,
+                            xAxisIndex: [0],
+                            start: 1,
+                            end: 5
+                        },
+                        {
+                            show: true,
+                            yAxisIndex: [0],
+                            start: 29,
+                            end: 36
+                        },
+                        {
+                            type: 'inside',
+                            xAxisIndex: [0],
+                            start: 1,
+                            end: 5
+                        },
+                        {
+                            type: 'inside',
+                            yAxisIndex: [0],
+                            start: 29,
+                            end: 36
+                        }
+                    ],
+                    series: [
+                        {
+                            type: 'scatter',
+                            symbolSize: function (val) {
+                                return val[2] * 10;
+                            },
+                            data: data1
+                        },
+                        {
+                            name: 'scatter2',
+                            type: 'scatter',
+                            symbolSize: function (val) {
+                                return val[2] * 10;
+                            },
+                            data: data2
+                        },
+                        {
+                            name: 'scatter3',
+                            type: 'scatter',
+                            symbolSize: function (val) {
+                                return val[2] * 10;
+                            },
+                            data: data3
+                        }
+                    ]
+                };
 
             var chart = testHelper.create(echarts, 'main6', {
                 title: [
-                    'Minor Ticks on Dynamic Chart'
+                    'Minor Ticks on Data Zoom'
                 ],
                 option: option
             });
diff --git a/test/dynamicData.html b/test/dynamicData.html
index 3713836..fc48b7d 100644
--- a/test/dynamicData.html
+++ b/test/dynamicData.html
@@ -83,7 +83,7 @@ under the License.
 
                 chart.setOption({
                     legend: {
-                        data: ['line', 'line2']
+                        data: ['line']
                     },
                     tooltip: {
                         trigger: 'axis',
@@ -101,6 +101,12 @@ under the License.
                     },
                     yAxis: {
                         scale: true,
+                        minorTick: {
+                            show: true
+                        },
+                        minorSplitLine: {
+                            show: true
+                        },
                         splitLine: {
                             // show: false
                         }
diff --git a/test/dynamicData2.html b/test/dynamicData2.html
index afab8f8..8809c3a 100644
--- a/test/dynamicData2.html
+++ b/test/dynamicData2.html
@@ -48,9 +48,7 @@ under the License.
                     return (Math.random() + 3).toFixed(3);
                 }
 
-                var chart = echarts.init(document.getElementById('main'), null, {
-
-                });
+                var chart = echarts.init(document.getElementById('main'));
 
 
 
@@ -98,9 +96,16 @@ option = {
     },
     yAxis: {
         type: 'value',
-        boundaryGap: [0, '100%'],
+        // boundaryGap: [0, '100%'],
+        max: 'dataMax',
         splitLine: {
             show: false
+        },
+        minorSplitLine: {
+            show: true
+        },
+        minorTick: {
+            show: true
         }
     },
     series: [{
diff --git a/test/runTest/actions/__meta__.json b/test/runTest/actions/__meta__.json
index d9f3b07..bfc94d3 100644
--- a/test/runTest/actions/__meta__.json
+++ b/test/runTest/actions/__meta__.json
@@ -12,6 +12,7 @@
   "axis-interval": 3,
   "axis-interval2": 3,
   "axis-lastLabel": 5,
+  "axis-minorTick": 1,
   "axis-multiple": 1,
   "axis-style": 2,
   "axisPosition": 2,
diff --git a/test/runTest/actions/axis-minorTick.json b/test/runTest/actions/axis-minorTick.json
new file mode 100644
index 0000000..0f981f0
--- /dev/null
+++ b/test/runTest/actions/axis-minorTick.json
@@ -0,0 +1 @@
+[{"name":"Action 1","ops":[{"type":"mousemove","time":182,"x":412,"y":361},{"type":"mousedown","time":326,"x":422,"y":355},{"type":"mousemove","time":412,"x":421,"y":355},{"type":"mousemove","time":618,"x":227,"y":434},{"type":"mousemove","time":827,"x":190,"y":452},{"type":"mouseup","time":939,"x":190,"y":452},{"time":940,"delay":400,"type":"screenshot-auto"},{"type":"mousemove","time":966,"x":190,"y":452},{"type":"mousemove","time":1166,"x":179,"y":336},{"type":"mousemove","time":1372, [...]
\ No newline at end of file


---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org