X-Git-Url: https://adrianiainlam.tk/git/?a=blobdiff_plain;f=tests%2Fgrid_dot.html;h=3a1c70f8932adf0224a946652ca68787b165d166;hb=59ee387ba6d5113ceedba2b16b1c0c53ddfa072c;hp=ca5cef25f54f4ce4242e1131a90a0a115d1488cb;hpb=1f75a05ce24d88587871a7305f1982010577cd33;p=dygraphs.git

diff --git a/tests/grid_dot.html b/tests/grid_dot.html
index ca5cef2..3a1c70f 100644
--- a/tests/grid_dot.html
+++ b/tests/grid_dot.html
@@ -1,13 +1,10 @@
+<!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../dist/dygraph.css">
     <title>Custom grid and Dot</title>
-    <!--[if IE]>
-    <script type="text/javascript" src="../excanvas.js"></script>
-    <![endif]-->
-    <script type="text/javascript" src="../strftime/strftime-min.js"></script>
-    <script type="text/javascript" src="../rgbcolor/rgbcolor.js"></script>
-    <script type="text/javascript" src="../dygraph-canvas.js"></script>
-    <script type="text/javascript" src="../dygraph.js"></script>
+    <script type="text/javascript" src="../dist/dygraph.js"></script>
+
     <script type="text/javascript" src="data.js"></script>
   </head>
 
@@ -27,5 +24,61 @@
             }
           );
     </script>
+    
+    <p>Use axis specific grid options. (independentTicks, gridLinePattern, ...)</p>
+    <div id="div_g15" style="width:600px; height:300px;"></div>
+
+    <script type="text/javascript">
+      var data = [];
+      for (var i = 1; i <= 100; i++) {
+        var m = "01", d = i;
+        if (d > 31) { m = "02"; d -= 31; }
+        if (m == "02" && d > 28) { m = "03"; d -= 28; }
+        if (m == "03" && d > 31) { m = "04"; d -= 31; }
+        if (d < 10) d = "0" + d;
+        // two series, one with range 1-100, one with range 1-2M
+        data.push([new Date("2010/" + m + "/" + d),
+                   i,
+                   100 - i,
+                   1e6 * (1 + i * (100 - i) / (50 * 50)),
+                   1e6 * (2 - i * (100 - i) / (50 * 50))]);
+      }
+      g15 = new Dygraph(
+            document.getElementById("div_g15"),
+            data,
+            {
+              labels: [ 'Date', 'Y1', 'Y2', 'Y3', 'Y4' ],
+              series : {
+                'Y3': {
+                  axis: 'y2'
+                },
+                'Y4': {
+                  axis: 'y2'
+                }
+              },
+              axes: {
+                x: {
+                  gridLineWidth: 2,
+                  drawGrid: true,
+                  independentTicks: true
+                },
+                y: {
+                  valueRange: [40, 80],
+                  drawGrid: true,
+                  independentTicks: true
+                },
+                y2: {
+                  // set axis-related properties here
+                  labelsKMB: true,
+                  ticker: Dygraph.numericLinearTicks,
+                  drawGrid: true,
+                  independentTicks: true,
+                  gridLineColor: "#ff0000",
+                  gridLinePattern: [4,4]
+                }
+              }
+            }
+          );
+    </script>
   </body>
 </html>
