Optimize polar, interval scale rounding error fix

src/component/angleAxis.js

@@ -5,18 +5,9 @@ define(function(require) {
 
     var elementList = ['axisLine', 'axisLabel', 'axisTick', 'splitLine', 'splitArea'];
 
-    function getPointOnAxisLine(cx, cy, r, radian) {
-        var dx = r * Math.cos(radian);
-        var dy = r * Math.sin(radian);
-
-        return [cx + dx, cy + dy];
-    }
-
-    function getAxisLineShape(cx, cy, r0, r, angle) {
-        var radian = angle / 180 * Math.PI;
-
-        var start = getPointOnAxisLine(cx, cy, r0, radian);
-        var end = getPointOnAxisLine(cx, cy, r, radian);
+    function getAxisLineShape(polar, r0, r, angle) {
+        var start = polar.coordToPoint([r0, angle]);
+        var end = polar.coordToPoint([r, angle]);
 
         return {
             x1: start[0],
@@ -39,8 +30,6 @@ define(function(require) {
             var polarModel = ecModel.getComponent('polar', angleAxisModel.get('polarIndex'));
             var angleAxis = angleAxisModel.axis;
             var polar = polarModel.coordinateSystem;
-            var cx = polar.cx;
-            var cy = polar.cy;
             var radiusExtent = polar.getRadiusAxis().getExtent();
             var ticksAngles = angleAxis.getTicksCoords();
 
@@ -51,7 +40,7 @@ define(function(require) {
 
             zrUtil.each(elementList, function (name) {
                 if (angleAxisModel.get(name +'.show')) {
-                    this['_' + name](angleAxisModel, ticksAngles, radiusExtent, cx, cy, api);
+                    this['_' + name](angleAxisModel, polar, ticksAngles, radiusExtent, api);
                 }
             }, this);
         },
@@ -59,13 +48,13 @@ define(function(require) {
         /**
          * @private
          */
-        _axisLine: function (angleAxisModel, ticksAngles, radiusExtent, cx, cy, api) {
+        _axisLine: function (angleAxisModel, polar, ticksAngles, radiusExtent, api) {
             var lineStyleModel = angleAxisModel.getModel('axisLine.lineStyle');
 
             var circle = new api.Circle({
                 shape: {
-                    cx: cx,
-                    cy: cy,
+                    cx: polar.cx,
+                    cy: polar.cy,
                     r: radiusExtent[1]
                 },
                 style: lineStyleModel.getLineStyle()
@@ -78,14 +67,14 @@ define(function(require) {
         /**
          * @private
          */
-        _axisTick: function (angleAxisModel, ticksAngles, radiusExtent, cx, cy, api) {
+        _axisTick: function (angleAxisModel, polar, ticksAngles, radiusExtent, api) {
             var tickModel = angleAxisModel.getModel('axisTick');
 
             var tickLen = (tickModel.get('inside') ? -1 : 1) * tickModel.get('length');
 
             var lines = zrUtil.map(ticksAngles, function (tickAngle) {
                 return new api.Line({
-                    shape: getAxisLineShape(cx, cy, radiusExtent[1], radiusExtent[1] + tickLen, tickAngle)
+                    shape: getAxisLineShape(polar, radiusExtent[1], radiusExtent[1] + tickLen, tickAngle)
                 });
             });
             this.group.add(api.mergePath(
@@ -98,7 +87,7 @@ define(function(require) {
         /**
          * @private
          */
-        _axisLabel: function (angleAxisModel, ticksAngles, radiusExtent, cx, cy, api) {
+        _axisLabel: function (angleAxisModel, polar, ticksAngles, radiusExtent, api) {
             var axis = angleAxisModel.axis;
 
             var labelModel = angleAxisModel.getModel('axisLabel');
@@ -111,9 +100,10 @@ define(function(require) {
 
             // Use length of ticksAngles because it may remove the last tick to avoid overlapping
             for (var i = 0; i < ticksAngles.length; i++) {
-                var tickAngle = labelsAngles[i] * Math.PI / 180;
                 var r = radiusExtent[1];
-                var p = getPointOnAxisLine(cx, cy, r + labelMargin, tickAngle);
+                var p = polar.coordToPoint([r + labelMargin, labelsAngles[i]]);
+                var cx = polar.cx;
+                var cy = polar.cy;
 
                 var labelTextAlign = Math.abs(p[0] - cx) / r < 0.3
                     ? 'center' : (p[0] > cx ? 'left' : 'right');
@@ -137,7 +127,7 @@ define(function(require) {
         /**
          * @private
          */
-        _splitLine: function (angleAxisModel, ticksAngles, radiusExtent, cx, cy, api) {
+        _splitLine: function (angleAxisModel, polar, ticksAngles, radiusExtent, api) {
             var splitLineModel = angleAxisModel.getModel('splitLine');
             var lineStyleModel = splitLineModel.getModel('lineStyle');
             var lineColors = lineStyleModel.get('color');
@@ -152,7 +142,7 @@ define(function(require) {
                 var colorIndex = (lineCount++) % lineColors.length;
                 splitLines[colorIndex] = splitLines[colorIndex] || [];
                 splitLines[colorIndex].push(new api.Line({
-                    shape: getAxisLineShape(cx, cy, radiusExtent[0], radiusExtent[1], ticksAngles[i])
+                    shape: getAxisLineShape(polar, radiusExtent[0], radiusExtent[1], ticksAngles[i])
                 }))
             }
 
@@ -174,7 +164,7 @@ define(function(require) {
         /**
          * @private
          */
-        _splitArea: function (angleAxisModel, ticksAngles, radiusExtent, cx, cy, api) {
+        _splitArea: function (angleAxisModel, polar, ticksAngles, radiusExtent, api) {
 
         }
     });

src/component/polar.js

@@ -7,10 +7,6 @@ define(function(require) {
 
     // Polar view
     require('../echarts').extendComponentView({
-
-        type: 'polar',
-
-        render: function (gridModel, ecModel, api) {
-        }
+        type: 'polar'
     });
 });
\ No newline at end of file

src/component/radiusAxis.js

@@ -6,33 +6,6 @@ define(function(require) {
 
     var elementList = ['splitLine', 'splitArea', 'axisLine', 'axisTick', 'axisLabel'];
 
-    function getPointOnAxisLine(cx, cy, r, radian) {
-        var dx = r * Math.cos(radian);
-        var dy = r * Math.sin(radian);
-
-        return [cx + dx, cy + dy];
-    }
-
-    function getAxisLineShape(radiusAxisModel, cx, cy) {
-
-        var radiusAxis = radiusAxisModel.axis;
-        var radius = radiusAxis.getExtent();
-
-        var axisAngle = radiusAxisModel.get('axisAngle');
-
-        var radian = axisAngle / 180 * Math.PI;
-
-        var start = getPointOnAxisLine(cx, cy, radius[0], radian);
-        var end = getPointOnAxisLine(cx, cy, radius[1], radian);
-
-        return {
-            x1: start[0],
-            y1: start[1],
-            x2: end[0],
-            y2: end[1]
-        };
-    }
-
     require('../coord/polar/polarCreator');
 
     require('../echarts').extendComponentView({
@@ -45,13 +18,12 @@ define(function(require) {
             var polarModel = ecModel.getComponent('polar', radiusAxisModel.get('polarIndex'));
             var radiusAxis = radiusAxisModel.axis;
             var polar = polarModel.coordinateSystem;
-            var cx = polar.cx;
-            var cy = polar.cy;
-            var angleExtent = polar.getAngleAxis().getExtent();
             var ticksCoords = radiusAxis.getTicksCoords();
+            var axisAngle = radiusAxisModel.get('axisAngle');
+            var radiusExtent = radiusAxis.getExtent();
             zrUtil.each(elementList, function (name) {
                 if (radiusAxisModel.get(name +'.show')) {
-                    this['_' + name](radiusAxisModel, ticksCoords, angleExtent, cx, cy, api);
+                    this['_' + name](radiusAxisModel, polar, axisAngle, radiusExtent, ticksCoords, api);
                 }
             }, this);
 
@@ -64,9 +36,16 @@ define(function(require) {
         /**
          * @private
          */
-        _axisLine: function (radiusAxisModel, ticksCoords, angleExtent, cx, cy, api) {
+        _axisLine: function (radiusAxisModel, polar, axisAngle, radiusExtent, ticksCoords, api) {
+            var p1 = polar.coordToPoint([radiusExtent[0], axisAngle]);
+            var p2 = polar.coordToPoint([radiusExtent[1], axisAngle]);
             var arc = new api.Line({
-                shape: getAxisLineShape(radiusAxisModel, cx, cy),
+                shape: {
+                    x1: p1[0],
+                    y1: p1[1],
+                    x2: p2[0],
+                    y2: p2[1]
+                },
                 style: radiusAxisModel.getModel('axisLine.lineStyle').getLineStyle()
             });
 
@@ -76,12 +55,11 @@ define(function(require) {
         /**
          * @private
          */
-        _axisTick: function (radiusAxisModel, ticksCoords, angleExtent, cx, cy, api) {
+        _axisTick: function (radiusAxisModel, polar, axisAngle, radiusExtent, ticksCoords, api) {
             var tickModel = radiusAxisModel.getModel('axisTick');
 
-            var lineShape = getAxisLineShape(radiusAxisModel, cx, cy);
-            var start = [lineShape.x1, lineShape.y1];
-            var end = [lineShape.x2, lineShape.y2];
+            var start = polar.coordToPoint([radiusExtent[0], axisAngle]);
+            var end = polar.coordToPoint([radiusExtent[1], axisAngle]);
 
             var len = vector.dist(end, start);
             var direction = [
@@ -117,16 +95,15 @@ define(function(require) {
         /**
          * @private
          */
-        _axisLabel: function (radiusAxisModel, ticksCoords, angleExtent, cx, cy, api) {
+        _axisLabel: function (radiusAxisModel, polar, axisAngle, radiusExtent, ticksCoords, api) {
             var axis = radiusAxisModel.axis;
             var labelModel = radiusAxisModel.getModel('axisLabel');
             var textStyleModel = labelModel.getModel('textStyle');
 
             var labels = radiusAxisModel.formatLabels(axis.scale.getTicksLabels());
 
-            var lineShape = getAxisLineShape(radiusAxisModel, cx, cy);
-            var start = [lineShape.x1, lineShape.y1];
-            var end = [lineShape.x2, lineShape.y2];
+            var start = polar.coordToPoint([radiusExtent[0], axisAngle]);
+            var end = polar.coordToPoint([radiusExtent[1], axisAngle]);
 
             var len = vector.dist(end, start);
             var direction = [
@@ -161,7 +138,7 @@ define(function(require) {
         /**
          * @private
          */
-        _splitLine: function (radiusAxisModel, ticksCoords, angleExtent, cx, cy, api) {
+        _splitLine: function (radiusAxisModel, polar, axisAngle, radiusExtent, ticksCoords, api) {
             var splitLineModel = radiusAxisModel.getModel('splitLine');
             var lineStyleModel = splitLineModel.getModel('lineStyle');
             var lineColors = lineStyleModel.get('color');
@@ -177,8 +154,8 @@ define(function(require) {
                 splitLines[colorIndex] = splitLines[colorIndex] || [];
                 splitLines[colorIndex].push(new api.Circle({
                     shape: {
-                        cx: cx,
-                        cy: cy,
+                        cx: polar.cx,
+                        cy: polar.cy,
                         r: ticksCoords[i]
                     },
                     silent: true
@@ -203,7 +180,7 @@ define(function(require) {
         /**
          * @private
          */
-        _splitArea: function (radiusAxisModel, ticksCoords, angleExtent, cx, cy, api) {
+        _splitArea: function (radiusAxisModel, polar, axisAngle, radiusExtent, ticksCoords, api) {
 
         }
     });

src/coord/Axis.js

@@ -163,11 +163,13 @@ define(function (require) {
 
         /**
          * Get bands.
-         * If axis has ticks [1, 2, 3, 4]. Bands on the axis are
+         * 
+         * If axis has labels [1, 2, 3, 4]. Bands on the axis are
          * |---1---|---2---|---3---|---4---|.
          *
          * @return {Array}
          */
+         // FIXME Situation when labels is on ticks
         getBands: function () {
             var extent = this._extent;
             var bands = [];
@@ -192,7 +194,8 @@ define(function (require) {
         getBandWidth: function () {
             var axisExtent = this._extent;
             var extent = this.scale.getExtent();
-            var len = extent[1] - extent[0] + 1;
+
+            var len = extent[1] - extent[0] + (this.onBand ? 1 : 0);
 
             var size = axisExtent[1] - axisExtent[0];
 

src/coord/polar/Polar.js

@@ -60,6 +60,13 @@ define(function(require) {
                 && this._angleAxis.contain(coord[1]);
         },
 
+        /**
+         * @return {module:echarts/coord/polar/AngleAxis|module:echarts/coord/polar/RadiusAxis}
+         */
+        getAxis: function (axisType) {
+            return this['_' + axisType + 'Axis'];
+        },
+
         /**
          * @return {module:echarts/coord/polar/AngleAxis}
          */
@@ -94,13 +101,10 @@ define(function(require) {
          * @return {Array.<number>}
          */
         dataToPoint: function (data) {
-            var radius = this._radiusAxis.dataToRadius(data[0]);
-            var radian = this._angleAxis.dataToAngle(data[1]) / 180 * Math.PI;
-
-            var x = Math.cos(radian) * radius + this.cx;
-            var y = Math.sin(radian) * radius + this.cy;
-
-            return [x, y];
+            return this.coordToPoint([
+                this._radiusAxis.dataToRadius(data[0]),
+                this._angleAxis.dataToAngle(data[1])
+            ])
         },
 
         /**
@@ -110,7 +114,6 @@ define(function(require) {
          */
         pointToData: function (point) {
             var coord = this.pointToCoord(point);
-
             return [
                 this._radiusAxis.radiusToData(coord[0]),
                 this._angleAxis.angleToData(coord[1]) / Math.PI * 180
@@ -133,6 +136,20 @@ define(function(require) {
             var angle = Math.atan2(dy, dx);
 
             return [radius, angle];
+        },
+
+        /**
+         * Convert a (radius, angle) coord to (x, y) point
+         * @param {Array.<number>} coord
+         * @return {Array.<number>}
+         */
+        coordToPoint: function (coord) {
+            var radius = coord[0];
+            var radian = coord[1] / 180 * Math.PI;
+            var x = Math.cos(radian) * radius + this.cx;
+            var y = Math.sin(radian) * radius + this.cy;
+
+            return [x, y];
         }
     }
 

src/layout/barGrid.js

@@ -19,7 +19,7 @@ define(function(require) {
 
             if (categoryAxis) {
                 var columnsOnAxis = columnsMap[cartesian.name] || {
-                    remainedWidth: categoryAxis.getBandWidth(true),
+                    remainedWidth: categoryAxis.getBandWidth(),
                     autoWidthCount: 0,
                     categoryGap: '20%',
                     gap: '30%',
@@ -65,7 +65,7 @@ define(function(require) {
             var categoryGap = columnsOnAxis.categoryGap;
             var barGapPercent = columnsOnAxis.gap;
             var categoryAxis = columnsOnAxis.axis;
-            var bandWidth = categoryAxis.getBandWidth(true);
+            var bandWidth = categoryAxis.getBandWidth();
             if (typeof categoryGap === 'string') {
                 categoryGap = (parseFloat(categoryGap) / 100) * bandWidth;
             }

src/scale/Interval.js

@@ -224,10 +224,10 @@ define(function (require) {
             var interval = this._interval;
 
             if (! fixMin) {
-                extent[0] = mathFloor(extent[0] / interval) * interval;
+                extent[0] = numberUtil.round(mathFloor(extent[0] / interval) * interval);
             }
             if (! fixMax) {
-                extent[1] = mathCeil(extent[1] / interval) * interval;
+                extent[1] = numberUtil.round(mathCeil(extent[1] / interval) * interval);
             }
         }
     };