Bug fix for dygraph point selection touch event.

[dygraphs.git] / tests / plotters.html
diff --git a/tests/plotters.html b/tests/plotters.html

index 9b800ec..b5e935f 100644 (file)
--- a/tests/plotters.html
+++ b/tests/plotters.html
@@ -1,12 +1,9 @@
  <!DOCTYPE html>
  <html>
    <head>
-    <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7; IE=EmulateIE9">
+    <link rel="stylesheet" href="../dist/dygraph.css">
      <title>Plotters demo</title>
-    <!--[if IE]>
-    <script type="text/javascript" src="../excanvas.js"></script>
-    <![endif]-->
-    <script type="text/javascript" src="../dygraph-dev.js"></script>
+    <script type="text/javascript" src="../dist/dygraph.js"></script>
  
      <script type="text/javascript" src="data.js"></script>
      <style type="text/css">
@@ -51,7 +48,19 @@
      and showing error bars only for some series.</p>
      <div id="mixed-error" class="chart"></div>
  
+    <h2>Smooth Lines</h2>
+    <p>See the <a href="smooth-plots.html">smooth-plots demo</a> for an example of a custom plotter which connects points using bezier curves instead of straight lines.</p>
+
      <script type="text/javascript">
+      // Darken a color
+      function darkenColor(colorStr) {
+        // Defined in dygraph-utils.js
+        var color = Dygraph.toRGB_(colorStr);
+        color.r = Math.floor((255 + color.r) / 2);
+        color.g = Math.floor((255 + color.g) / 2);
+        color.b = Math.floor((255 + color.b) / 2);
+        return 'rgb(' + color.r + ',' + color.g + ',' + color.b + ')';
+      }
  
        // This function draws bars for a single series. See
        // multiColumnBarPlotter below for a plotter which can draw multi-series
@@ -61,13 +70,7 @@
          var points = e.points;
          var y_bottom = e.dygraph.toDomYCoord(0);
  
-        // The RGBColorParser class is provided by rgbcolor.js, which is
-        // packed in with dygraphs.
-        var color = new RGBColorParser(e.color);
-        color.r = Math.floor((255 + color.r) / 2);
-        color.g = Math.floor((255 + color.g) / 2);
-        color.b = Math.floor((255 + color.b) / 2);
-        ctx.fillStyle = color.toRGB();
+        ctx.fillStyle = darkenColor(e.color);
  
          // Find the minimum separation between x-values.
          // This determines the bar width.
@@ -105,8 +108,12 @@
                  includeZero: true,
                  dateWindow: [ Date.parse("2012/07/20"), Date.parse("2012/07/26") ],
                  animatedZooms: true,
-                drawXGrid: false,
-                plotter: barChartPlotter
+                plotter: barChartPlotter,
+                axes: {
+                  x: {
+                    drawGrid: false
+                  }
+                }
                }
            );
  
@@ -240,11 +247,13 @@ var candleData = "Date,Open,Close,High,Low\n" +
              {
                labels: ['Date', 'A', 'B'],
                includeZero: true,
-              "A": {
-                strokeWidth: 2
-              },
-              "B": {
-                plotter: barChartPlotter
+              series: {
+                "A": {
+                  strokeWidth: 2
+                },
+                "B": {
+                  plotter: barChartPlotter
+                }
                }
              });
  
@@ -274,11 +283,7 @@ var candleData = "Date,Open,Close,High,Low\n" +
        var fillColors = [];
        var strokeColors = g.getColors();
        for (var i = 0; i < strokeColors.length; i++) {
-        var color = new RGBColorParser(strokeColors[i]);
-        color.r = Math.floor((255 + color.r) / 2);
-        color.g = Math.floor((255 + color.g) / 2);
-        color.b = Math.floor((255 + color.b) / 2);
-        fillColors.push(color.toRGB());
+        fillColors.push(darkenColor(strokeColors[i]));
        }
  
        for (var j = 0; j < sets.length; j++) {
@@ -312,12 +317,14 @@ var candleData = "Date,Open,Close,High,Low\n" +
              NoisyData(),
              {
                errorBars: true,
-              'A': {
-                plotter: Dygraph.Plotters.errorPlotter
-              },
-              'B': {
-                plotter: Dygraph.Plotters.linePlotter,
-                strokePattern: Dygraph.DASHED_LINE
+              series: {
+                'A': {
+                  plotter: Dygraph.Plotters.errorPlotter
+                },
+                'B': {
+                  plotter: Dygraph.Plotters.linePlotter,
+                  strokePattern: Dygraph.DASHED_LINE
+                }
                }
              });