Fix axis.x.default

10 years ago · 50bd61a0ea
6 changed files with 67 additions and 13 deletions
--- a/c3.js
+++ b/c3.js
@ -253,9 +253,7 @@
            .on("dblclick.zoom", null);

        // Set default extent if defined
-        if (config.axis_x_default) {
-            $$.brush.extent(isFunction(config.axis_x_default) ? config.axis_x_default($$.getXDomain($$.data.targets)) : config.axis_x_default);
-        }
+        if (config.axis_x_default) { $$.brush.extent($$.getDefaultExtent()); }

        // Add Axis
        $$.initAxis();
@ -4915,6 +4913,14 @@
        $$.context.attr("transform", $$.getTranslate('context'));
        subXAxis.attr("transform", $$.getTranslate('subx'));
    };
+    c3_chart_internal_fn.getDefaultExtent = function () {
+        var $$ = this, config = $$.config,
+            extent = isFunction(config.axis_x_default) ? config.axis_x_default($$.getXDomain($$.data.targets)) : config.axis_x_default;
+        if ($$.isTimeSeries()) {
+            extent = [$$.parseDate(extent[0]), $$.parseDate(extent[1])];
+        }
+        return extent;
+    };

    c3_chart_internal_fn.initZoom = function () {
        var $$ = this, d3 = $$.d3, config = $$.config;
--- a/c3.min.js
+++ b/c3.min.js
--- a/htdocs/samples/subchart.html
+++ b/htdocs/samples/subchart.html
@ -5,6 +5,7 @@
  <body>
    <div id="chart1"></div>
    <div id="chart2"></div>
+    <div id="chart3"></div>

    <script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
    <script src="/js/c3.js"></script>
@ -41,6 +42,26 @@
        }
      });

+      var chart3 = c3.generate({
+        bindto: '#chart3',
+        data: {
+          columns: [
+            ['data1', 30, 200, 100, 400, 150, 250],
+            ['data2', 50, 20, 10, 40, 15, 25]
+          ],
+          labels: true
+        },
+        axis: {
+          x: {
+            default: [3, 5]
+          }
+        },
+        subchart: {
+          show: true
+        },
+      });
+
+
    </script>
  </body>
 </html>
--- a/htdocs/samples/zoom.html
+++ b/htdocs/samples/zoom.html
@ -3,26 +3,47 @@
    <link rel="stylesheet" type="text/css" href="/css/c3.css">
  </head>
  <body>
-    <div id="chart"></div>
+    <div id="chart1"></div>
    <button onclick="load()">Load</button>
+    <div id="chart2"></div>

    <script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
    <script src="/js/c3.js"></script>
    <script>

-      var chart = c3.generate({
-        bindto: '#chart',
+      var chart1 = c3.generate({
+        bindto: '#chart1',
        data: {
          columns: [
            generateData(100)
          ],
        },
+        axis: {
+          x: {
+            default: [30, 60]
+          }
+        },
        zoom: { enabled: true },
        subchart: { show: true }
      });

+      var chart2 = c3.generate({
+        bindto: '#chart2',
+        data: {
+          columns: [
+            generateData(100)
+          ],
+        },
+        axis: {
+          x: {
+            default: [30, 60]
+          }
+        },
+        zoom: { enabled: true },
+      });
+
      function load() {
-        chart.load({
+        chart1.load({
          columns: [
            generateData(Math.random() * 1000)
          ],
--- a/src/core.js
+++ b/src/core.js
@ -248,9 +248,7 @@ c3_chart_internal_fn.initWithData = function (data) {
        .on("dblclick.zoom", null);

    // Set default extent if defined
-    if (config.axis_x_default) {
-        $$.brush.extent(isFunction(config.axis_x_default) ? config.axis_x_default($$.getXDomain($$.data.targets)) : config.axis_x_default);
-    }
+    if (config.axis_x_default) { $$.brush.extent($$.getDefaultExtent()); }

    // Add Axis
    $$.initAxis();
--- a/src/subchart.js
+++ b/src/subchart.js
@ -181,3 +181,11 @@ c3_chart_internal_fn.transformContext = function (withTransition, transitions) {
    $$.context.attr("transform", $$.getTranslate('context'));
    subXAxis.attr("transform", $$.getTranslate('subx'));
 };
+c3_chart_internal_fn.getDefaultExtent = function () {
+    var $$ = this, config = $$.config,
+        extent = isFunction(config.axis_x_default) ? config.axis_x_default($$.getXDomain($$.data.targets)) : config.axis_x_default;
+    if ($$.isTimeSeries()) {
+        extent = [$$.parseDate(extent[0]), $$.parseDate(extent[1])];
+    }
+    return extent;
+};