Bug fix for dygraph point selection touch event.
[dygraphs.git] / tests / plotters.html
index 7f5242b..b5e935f 100644 (file)
@@ -1,13 +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="../extras/smooth-plotter.js"></script>
+    <script type="text/javascript" src="../dist/dygraph.js"></script>
 
     <script type="text/javascript" src="data.js"></script>
     <style type="text/css">
@@ -18,9 +14,6 @@
         width: 640px;
         height: 320px;
       }
-      input[type="range"] {
-        width: 400px;
-      }
     </style>
   </head>
   <body>
@@ -56,9 +49,7 @@
     <div id="mixed-error" class="chart"></div>
 
     <h2>Smooth Lines</h2>
-    <p>This plotter draws smooth lines between points using bezier curves:</p>
-    Smoothing:&nbsp;<input type="range" id="smoothing-amount" min=0 max=0.7 step=0.02 value=0.3><br>
-    <div id="smooth-line" class="chart"></div>
+    <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
                 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
+                  }
+                }
               }
           );
 
@@ -252,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
+                }
               }
             });
 
@@ -320,54 +317,17 @@ 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
+                }
               }
             });
 
-
-    // Smooth line plotter
-    var functionData = [];
-    var vs = [10, 20, 40, 0, 30, 15, 25, 60, 35, 45];
-    for (var i = 0; i < 10; i++) {
-      var v = vs[i];
-      functionData.push([i, v, v]);
-    }
-
-    var g6;
-    function drawSmoothPlot() {
-      g6 = new Dygraph(document.getElementById('smooth-line'),
-                       functionData,
-                       {
-                         labels: ['Year', 'Straight', 'Smoothed'],
-                         series: {
-                           Straight: {
-                             color: 'rgba(0,0,0,0.33)',
-                             strokeWidth: 2,
-                             drawPoints: true,
-                             pointSize: 3
-                           },
-                           Smoothed: {
-                             plotter: smoothPlotter,
-                             color: 'red',
-                             strokeWidth: 2
-                           }
-                         },
-                         legend: 'always',
-                         gridLineColor: '#ddd'
-                       });
-    }
-    drawSmoothPlot();
-
-    var smoothRangeEl = document.getElementById('smoothing-amount');
-    smoothRangeEl.addEventListener('input', function() {
-      smoothPlotter.smoothing = parseFloat(smoothRangeEl.value);
-      drawSmoothPlot();
-    });
     </script>
 </body>
 </html>