From a69f4e772e3c9d1c8510eb351cf380c2a7bf3c02 Mon Sep 17 00:00:00 2001
From: DungSaga <dung.saga+github@gmail.com>
Date: Mon, 8 Dec 2014 20:02:52 +0700
Subject: [PATCH] add option textAnchor: 'start' to put text near the start
 (instead of the end) of grid line

---
 c3.js       | 12 ++++++------
 src/grid.js | 12 ++++++------
 2 files changed, 12 insertions(+), 12 deletions(-)

diff --git a/c3.js b/c3.js
index 17870b0..7b14d65 100644
--- a/c3.js
+++ b/c3.js
@@ -3451,9 +3451,9 @@
         xgridLine.append('line')
             .style("opacity", 0);
         xgridLine.append('text')
-            .attr("text-anchor", "end")
+            .attr("text-anchor", function (d) { return d.textAnchor === 'start' ? "start" : "end"; })
             .attr("transform", config.axis_rotated ? "" : "rotate(-90)")
-            .attr('dx', config.axis_rotated ? 0 : -$$.margin.top)
+            .attr('dx', config.axis_rotated ? 0 : function (d) { return d.textAnchor === 'start' ? $$.margin.top : -$$.margin.top; })
             .attr('dy', -5)
             .style("opacity", 0);
         // udpate
@@ -3475,9 +3475,9 @@
         ygridLine.append('line')
             .style("opacity", 0);
         ygridLine.append('text')
-            .attr("text-anchor", "end")
+            .attr("text-anchor", function (d) { return d.textAnchor === 'start' ? "start" : "end"; })
             .attr("transform", config.axis_rotated ? "rotate(-90)" : "")
-            .attr('dx', config.axis_rotated ? 0 : -$$.margin.top)
+            .attr('dx', config.axis_rotated ? 0 : function (d) { return d.textAnchor === 'start' ? $$.margin.top : -$$.margin.top; })
             .attr('dy', -5)
             .style("opacity", 0);
         // update
@@ -3491,7 +3491,7 @@
             .style("opacity", 1);
         $$.ygridLines.select('text')
           .transition().duration(duration)
-            .attr("x", config.axis_rotated ? 0 : $$.width)
+            .attr("x", config.axis_rotated ? 0 : function (d) { return d.textAnchor === 'start' ? 0 : $$.width; })
             .attr("y", yv)
             .text(function (d) { return d.text; })
             .style("opacity", 1);
@@ -3509,7 +3509,7 @@
                          .attr("y2", config.axis_rotated ? xv : $$.height)
                          .style("opacity", 1));
         transitions.push($$.xgridLines.select('text').transition()
-                         .attr("x", config.axis_rotated ? $$.width : 0)
+                         .attr("x", config.axis_rotated ? $$.width : function (d) { return d.textAnchor === 'start' ? -$$.height : 0; })
                          .attr("y", xv)
                          .text(function (d) { return d.text; })
                          .style("opacity", 1));
diff --git a/src/grid.js b/src/grid.js
index 0465c04..ce93e29 100644
--- a/src/grid.js
+++ b/src/grid.js
@@ -89,9 +89,9 @@ c3_chart_internal_fn.redrawGrid = function (duration) {
     xgridLine.append('line')
         .style("opacity", 0);
     xgridLine.append('text')
-        .attr("text-anchor", "end")
+        .attr("text-anchor", function (d) { return d.textAnchor === 'start' ? "start" : "end"; })
         .attr("transform", config.axis_rotated ? "" : "rotate(-90)")
-        .attr('dx', config.axis_rotated ? 0 : -$$.margin.top)
+        .attr('dx', config.axis_rotated ? 0 : function (d) { return d.textAnchor === 'start' ? $$.margin.top : -$$.margin.top; })
         .attr('dy', -5)
         .style("opacity", 0);
     // udpate
@@ -113,9 +113,9 @@ c3_chart_internal_fn.redrawGrid = function (duration) {
     ygridLine.append('line')
         .style("opacity", 0);
     ygridLine.append('text')
-        .attr("text-anchor", "end")
+        .attr("text-anchor", function (d) { return d.textAnchor === 'start' ? "start" : "end"; })
         .attr("transform", config.axis_rotated ? "rotate(-90)" : "")
-        .attr('dx', config.axis_rotated ? 0 : -$$.margin.top)
+        .attr('dx', config.axis_rotated ? 0 : function (d) { return d.textAnchor === 'start' ? $$.margin.top : -$$.margin.top; })
         .attr('dy', -5)
         .style("opacity", 0);
     // update
@@ -129,7 +129,7 @@ c3_chart_internal_fn.redrawGrid = function (duration) {
         .style("opacity", 1);
     $$.ygridLines.select('text')
       .transition().duration(duration)
-        .attr("x", config.axis_rotated ? 0 : $$.width)
+        .attr("x", config.axis_rotated ? 0 : function (d) { return d.textAnchor === 'start' ? 0 : $$.width; })
         .attr("y", yv)
         .text(function (d) { return d.text; })
         .style("opacity", 1);
@@ -147,7 +147,7 @@ c3_chart_internal_fn.addTransitionForGrid = function (transitions) {
                      .attr("y2", config.axis_rotated ? xv : $$.height)
                      .style("opacity", 1));
     transitions.push($$.xgridLines.select('text').transition()
-                     .attr("x", config.axis_rotated ? $$.width : 0)
+                     .attr("x", config.axis_rotated ? $$.width : function (d) { return d.textAnchor === 'start' ? -$$.height : 0; })
                      .attr("y", xv)
                      .text(function (d) { return d.text; })
                      .style("opacity", 1));