Fixed attribute name typo in legend follow (#792)

[dygraphs.git] / gallery / linear-regression.js

diff --git a/gallery/linear-regression.js b/gallery/linear-regression.js
index 0a93b8f..cb6b9d9 100644 (file)
--- a/gallery/linear-regression.js
+++ b/gallery/linear-regression.js
@@ -1,26 +1,27 @@
-// Use this as a template for new Gallery entries.
+/*global Gallery,Dygraph,data */
 Gallery.register(
   'linear-regression',
   {
     name: 'Linear Regressions',
     title: 'Linear Regression Demo',
     setup: function(parent) {
-      parent.innerHTML =
-        "<p>Click the buttons to generate linear regressions over either data "+
-        "series. If you zoom in and then click the regression button, the regression "+
-        "will only be run over visible points. Zoom back out to see what the local "+
-        "regression looks like over the full data.</p> "+
-        "<div id='demodiv' style='width: 480px; height: 320px;'></div>" +
-        "<div style='text-align:center; width: 480px'>" + 
-        "<button style='color: green;' id='ry1'>Regression (Y1)</button> " +
-        "<button style='color: blue;' id='ry2'>Regression (Y2)</button> " +
-        "<button id='clear'>Clear Lines</button>" +
-        "</div>";
+      parent.innerHTML = [
+        "<p>Click the buttons to generate linear regressions over either data ",
+        "series. If you zoom in and then click the regression button, the regression ",
+        "will only be run over visible points. Zoom back out to see what the local ",
+        "regression looks like over the full data.</p> ",
+        "<div id='demodiv' style='width: 480px; height: 320px;'></div>",
+        "<div style='text-align:center; width: 480px'>",
+        "<button style='color: green;' id='ry1'>Regression (Y1)</button> ",
+        "<button style='color: blue;' id='ry2'>Regression (Y2)</button> ",
+        "<button id='clear'>Clear Lines</button>",
+        "</div>"].join("\n");
     },
     run: function() {
-      document.getElementById("ry1").onclick = function() { regression(1) };
-      document.getElementById("ry2").onclick = function() { regression(2) };
-      document.getElementById("clear").onclick = function() { clearLines() };
+      var g, regression, clearLines;  // defined below
+      document.getElementById("ry1").onclick = function() { regression(1); };
+      document.getElementById("ry2").onclick = function() { regression(2); };
+      document.getElementById("clear").onclick = function() { clearLines(); };
 
       var data = [];
       for (var i = 0; i < 120; i++) {
@@ -33,7 +34,7 @@ Gallery.register(
       // if coeffs = [ null, [1, 2], null ] then we draw a regression for series 1
       // only. The regression line is y = 1 + 2 * x.
       var coeffs = [ null, null, null ];
-      function regression(series) {
+      regression = function(series) {
         // Only run the regression over visible points.
         var range = g.xAxisRange();
 
@@ -43,7 +44,7 @@ Gallery.register(
           if (x < range[0] || x > range[1]) continue;
 
           var y = g.getValue(i, series);
-          if (y == null) continue;
+          if (y === null || y === undefined) continue;
           if (y.length == 2) {
             // using fractions
             y = y[0] / y[1];
@@ -65,12 +66,12 @@ Gallery.register(
         }
 
         g.updateOptions({});  // forces a redraw.
-      }
+      };
 
-      function clearLines() {
+      clearLines = function() {
         for (var i = 0; i < coeffs.length; i++) coeffs[i] = null;
         g.updateOptions({});
-      }
+      };
 
       function drawLines(ctx, area, layout) {
         if (typeof(g) == 'undefined') return;  // won't be set on the initial draw.
@@ -89,11 +90,11 @@ Gallery.register(
           var p1 = g.toDomCoords(x1, y1);
           var p2 = g.toDomCoords(x2, y2);
 
-          var c = new RGBColor(g.getColors()[i - 1]);
+          var c = Dygraph.toRGB_(g.getColors()[i - 1]);
           c.r = Math.floor(255 - 0.5 * (255 - c.r));
           c.g = Math.floor(255 - 0.5 * (255 - c.g));
           c.b = Math.floor(255 - 0.5 * (255 - c.b));
-          var color = c.toHex();
+          var color = 'rgb(' + c.r + ',' + c.g + ',' + c.b + ')';
           ctx.save();
           ctx.strokeStyle = color;
           ctx.lineWidth = 1.0;
@@ -105,7 +106,7 @@ Gallery.register(
           ctx.restore();
         }
       }
-      
+
       g = new Dygraph(
               document.getElementById("demodiv"),
               data,
@@ -113,6 +114,7 @@ Gallery.register(
                 labels: ['X', 'Y1', 'Y2'],
                 underlayCallback: drawLines,
                 drawPoints: true,
+                drawAxesAtZero: true,
                 strokeWidth: 0.0
               }
           );