Improve algorithm for axis rotated

c3.js

@@ -1121,6 +1121,10 @@
         return undefined;
     };
 
+    c3_chart_internal_fn.rotateCoeff = function(x){
+        return Math.abs(Math.sin(Math.PI * x / 180));
+    };
+
     c3_chart_internal_fn.getDefaultConfig = function () {
         var config = {
             bindto: '#chart',
@@ -2821,7 +2825,7 @@
         if (axisId === 'y2' && !config.axis_y2_show) { return $$.rotated_padding_top; }
         // Calculate x axis height when tick rotated
         if (axisId === 'x' && !config.axis_rotated && config.axis_x_tick_rotate) {
-            h = $$.getMaxTickWidth(axisId) * Math.sin(Math.PI * Math.abs(config.axis_x_tick_rotate) / 180) + 45;
+            h = $$.getMaxTickWidth(axisId) * $$.rotateCoeff(config.axis_x_tick_rotate) + 45;
         }
         return h + ($$.getAxisLabelPositionById(axisId).isInner ? 10 : 15) + (axisId === 'y2' ? -10 : 0);
     };
@@ -4931,7 +4935,7 @@
     };
 
     c3_chart_internal_fn.xForRotatedTickText = function (r) {
-        return 8 * Math.sin(Math.PI * (r / 180));
+        return 8 * Math.sin(Math.PI * r / 180);
     };
     c3_chart_internal_fn.yForRotatedTickText = function (r) {
         return 11.5 - 2.5 * (r / 15) * (r > 0 ? 1 : -1);
@@ -5116,19 +5120,42 @@
 
     c3_chart_internal_fn.getMaxTickWidthAllowed = function(){
         var $$ = this;
-        var widthCoef, heightCoef;
+        var sizeCoef, ticksCoef;
+
+        sizeCoef = $$.getSizeCoef();
+        ticksCoef = $$.getTicksCoef();
+
+        return Math.max(sizeCoef, ticksCoef);
+    };
+
+    c3_chart_internal_fn.getTicksCoef = function(){
+        var $$ = this;
 
-        var widthPadding = 0;
-        var width = $$.getCurrentWidth() - $$.margin.left - $$.margin.right;
         var ticks = $$.getXAxisTickValues() || [];
         var ticksNum = ticks.length;
-        widthCoef = width / ticksNum + widthPadding;
 
-        var heightPadding = -30;
+        if($$.config.axis_rotated){
+            var height = $$.getCurrentHeight() - $$.margin.top - $$.margin.bottom;
+            return height / ticksNum;
+        } else {
+            var width = $$.getCurrentWidth() - $$.margin.left - $$.margin.right;
+            return width / ticksNum;
+        }
+     
+    };
+
+    c3_chart_internal_fn.getSizeCoef = function(){
+        var $$ = this;
+
         // Excel shortens ticks the way so they don't take more than half of all chart
-        heightCoef  = $$.getCurrentHeight()/2 + heightPadding;
+        if($$.config.axis_rotated){
+            var widthPadding = -30;
+            return $$.getCurrentWidth()/2 + widthPadding;
+        } else {
+            var heightPadding = -30;
+            return $$.getCurrentHeight()/2 + heightPadding;
+        }
 
-        return Math.max(widthCoef, heightCoef);
     };
 
     c3_chart_internal_fn.tuneAxis = function(sync, callback){

src/axis.js

@@ -304,7 +304,7 @@ c3_chart_internal_fn.textAnchorForY2AxisLabel = function () {
 };
 
 c3_chart_internal_fn.xForRotatedTickText = function (r) {
-    return 8 * Math.sin(Math.PI * (r / 180));
+    return 8 * Math.sin(Math.PI * r / 180);
 };
 c3_chart_internal_fn.yForRotatedTickText = function (r) {
     return 11.5 - 2.5 * (r / 15) * (r > 0 ? 1 : -1);
@@ -489,19 +489,42 @@ c3_chart_internal_fn.tuneAxisTicks = function(){
 
 c3_chart_internal_fn.getMaxTickWidthAllowed = function(){
     var $$ = this;
-    var widthCoef, heightCoef;
+    var sizeCoef, ticksCoef;
+
+    sizeCoef = $$.getSizeCoef();
+    ticksCoef = $$.getTicksCoef();
+
+    return Math.max(sizeCoef, ticksCoef);
+};
+
+c3_chart_internal_fn.getTicksCoef = function(){
+    var $$ = this;
 
-    var widthPadding = 0;
-    var width = $$.getCurrentWidth() - $$.margin.left - $$.margin.right;
     var ticks = $$.getXAxisTickValues() || [];
     var ticksNum = ticks.length;
-    widthCoef = width / ticksNum + widthPadding;
 
-    var heightPadding = -30;
+    if($$.config.axis_rotated){
+        var height = $$.getCurrentHeight() - $$.margin.top - $$.margin.bottom;
+        return height / ticksNum;
+    } else {
+        var width = $$.getCurrentWidth() - $$.margin.left - $$.margin.right;
+        return width / ticksNum;
+    }
+ 
+};
+
+c3_chart_internal_fn.getSizeCoef = function(){
+    var $$ = this;
+
     // Excel shortens ticks the way so they don't take more than half of all chart
-    heightCoef  = $$.getCurrentHeight()/2 + heightPadding;
+    if($$.config.axis_rotated){
+        var widthPadding = -30;
+        return $$.getCurrentWidth()/2 + widthPadding;
+    } else {
+        var heightPadding = -30;
+        return $$.getCurrentHeight()/2 + heightPadding;
+    }
 
-    return Math.max(widthCoef, heightCoef);
 };
 
 c3_chart_internal_fn.tuneAxis = function(sync, callback){

src/core.js

@@ -1115,3 +1115,7 @@ c3_chart_internal_fn.updateValue = function(d){
     }
     return undefined;
 };
+
+c3_chart_internal_fn.rotateCoeff = function(x){
+    return Math.abs(Math.sin(Math.PI * x / 180));
+};

src/size.js

@@ -86,7 +86,7 @@ c3_chart_internal_fn.getHorizontalAxisHeight = function (axisId) {
     if (axisId === 'y2' && !config.axis_y2_show) { return $$.rotated_padding_top; }
     // Calculate x axis height when tick rotated
     if (axisId === 'x' && !config.axis_rotated && config.axis_x_tick_rotate) {
-        h = $$.getMaxTickWidth(axisId) * Math.sin(Math.PI * Math.abs(config.axis_x_tick_rotate) / 180) + 45;
+        h = $$.getMaxTickWidth(axisId) * $$.rotateCoeff(config.axis_x_tick_rotate) + 45;
     }
     return h + ($$.getAxisLabelPositionById(axisId).isInner ? 10 : 15) + (axisId === 'y2' ? -10 : 0);
 };