X-Git-Url: https://adrianiainlam.tk/git/?a=blobdiff_plain;f=tests%2Fplotters.html;h=b5e935ff574987a2592c86d7ef18c2b45c82b76f;hb=59ee387ba6d5113ceedba2b16b1c0c53ddfa072c;hp=91c3a7c72d362e9e6c7625e035d79917603faccf;hpb=3bdeeb9b9d123e9e45159a6801b6e7fe74f08690;p=dygraphs.git

diff --git a/tests/plotters.html b/tests/plotters.html
index 91c3a7c..b5e935f 100644
--- 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 RGBColor class is provided by rgbcolor.js, which is
-        // packed in with dygraphs.
-        var color = new RGBColor(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 RGBColor(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
+                }
               }
             });
 
