Merge pull request #301 from BoivinBenoit/master

Fixing fillGraph when null values and stepPlot

diff --git a/auto_tests/misc/local.html b/auto_tests/misc/local.html
index f356fc5..455b6cb 100644 (file)
--- a/auto_tests/misc/local.html
+++ b/auto_tests/misc/local.html
@@ -30,6 +30,7 @@
   <script type="text/javascript" src="../tests/date_formats.js"></script>
   <script type="text/javascript" src="../tests/dygraph-options-tests.js"></script>
   <script type="text/javascript" src="../tests/error_bars.js"></script>
+  <script type="text/javascript" src="../tests/fill_step_plot.js"></script>
   <script type="text/javascript" src="../tests/formats.js"></script>
   <script type="text/javascript" src="../tests/grid_per_axis.js"></script>
   <script type="text/javascript" src="../tests/interaction_model.js"></script>

diff --git a/auto_tests/tests/fill_step_plot.js b/auto_tests/tests/fill_step_plot.js
new file mode 100644 (file)
index 0000000..f40f8a5
--- /dev/null
+++ b/auto_tests/tests/fill_step_plot.js
@@ -0,0 +1,58 @@
+/**
+ * @fileoverview Test if you give null values to dygraph with stepPlot
+ * and fillGraph options enabled
+ *
+ * @author benoitboivin.pro@gmail.com (Benoit Boivin)
+ */
+var fillStepPlotTestCase = TestCase("fill-step-plot");
+
+fillStepPlotTestCase.prototype.setUp = function() {
+  document.body.innerHTML = "<div id='graph'></div>";
+};
+
+fillStepPlotTestCase.origFunc = Dygraph.getContext;
+
+fillStepPlotTestCase.prototype.setUp = function() {
+  document.body.innerHTML = "<div id='graph'></div>";
+  Dygraph.getContext = function(canvas) {
+    return new Proxy(fillStepPlotTestCase.origFunc(canvas));
+  };
+};
+
+fillStepPlotTestCase.prototype.tearDown = function() {
+  Dygraph.getContext = fillStepPlotTestCase.origFunc;
+};
+
+
+fillStepPlotTestCase.prototype.testFillStepPlotNullValues = function() {
+  var opts = {
+    labels: ["x","y"],
+    width: 480,
+    height: 320,
+    fillGraph: true,
+    stepPlot: true
+  };
+  var data = [
+    [1,3],
+    [2,0],
+    [3,8],
+    [4,null],
+    [5,9],
+    [6,8],
+    [7,6],
+    [8,3]
+  ];
+  var graph = document.getElementById("graph");
+  var g = new Dygraph(graph, data, opts);
+
+  htx = g.hidden_ctx_;
+  var x1 = data[3][0];
+  var y1 = data[2][1];
+  var x2 = data[3][0];
+  var y2 = 0;
+  var xy1 = g.toDomCoords(x1, y1);
+  var xy2 = g.toDomCoords(x2, y2);
+  
+  // Check if a line is drawn between the previous y and the bottom of the chart
+  CanvasAssertions.assertLineDrawn(htx, xy1, xy2, {});
+};
\ No newline at end of file

diff --git a/dygraph-canvas.js b/dygraph-canvas.js
index 6bf5fbc..5bfbfbf 100644 (file)
--- a/dygraph-canvas.js
+++ b/dygraph-canvas.js
@@ -716,7 +716,7 @@ DygraphCanvasRenderer._fillPlotter = function(e) {
     var last_x, is_first = true;
     while (iter.hasNext) {
       var point = iter.next();
-      if (!Dygraph.isOK(point.y)) {
+      if (!Dygraph.isOK(point.y) && !stepPlot) {
         prevX = NaN;
         if (point.y_stacked !== null && !isNaN(point.y_stacked)) {
           baseline[point.canvasx] = area.h * point.y_stacked + area.y;
@@ -757,7 +757,11 @@ DygraphCanvasRenderer._fillPlotter = function(e) {
         }
 
       } else {
-        newYs = [ point.canvasy, axisY ];
+        if (isNaN(point.canvasy) && stepPlot) {
+          newYs = [ area.y + area.h, axisY ];
+        } else {
+          newYs = [ point.canvasy, axisY ];
+        }
       }
       if (!isNaN(prevX)) {
         ctx.moveTo(prevX, prevYs[0]);