Merge pull request #844 from ka7/feature/spelling
[dygraphs.git] / tests / iframe.html
CommitLineData
2bad4d92
DV
1<!DOCTYPE html>
2<html>
3 <head>
fd6b8dad 4 <link rel="stylesheet" href="../dist/dygraph.css">
2bad4d92 5 <title>demo</title>
fbd6834a 6 <script type="text/javascript" src="../dist/dygraph.js"></script>
2bad4d92
DV
7
8 <style type="text/css">
9 .chart {
10 position: absolute;
11 left: 10px;
12 width: 500px;
13 height: 250px;
14 border: 1px solid black;
15 }
16 #chart1 {
17 top: 10px;
18 }
19 #chart2 {
20 top: 270px;
21 }
22 #iframe {
23 border: 1px solid black;
24 position: absolute;
25 left: 520px;
26 }
27 p {
28 position: absolute;
29 top: 550px;
30 }
31 </style>
32 </head>
33 <body>
34 <div class="chart" id="chart1"></div>
35 <div class="chart" id="chart2"></div>
36 <iframe id="iframe" width=400 height=520 src="http://en.wikipedia.org/">iframe here</iframe>
37
38 <p>Click on various places in the chart, then drag the mouse over the iframe
2b66af4f 39 and release it. When you mouse back over the charts, strange things shouldn't
2bad4d92
DV
40 happen.</p>
41
42 <script type="text/javascript">
43 var data = function() {
44 var zp = function(x) { if (x < 10) return "0"+x; else return x; };
45 var r = "date,parabola,line,another line,sine wave\n";
46 for (var i=1; i<=31; i++) {
47 r += "200610" + zp(i);
48 r += "," + 10*(i*(31-i));
49 r += "," + 10*(8*i);
50 r += "," + 10*(250 - 8*i);
51 r += "," + 10*(125 + 125 * Math.sin(0.3*i));
52 r += "\n";
53 }
54 return r;
55 };
56
57 g1 = new Dygraph(
58 document.getElementById("chart1"), data,
59 { }
60 );
61 g2 = new Dygraph(
62 document.getElementById("chart2"), data,
63 {
64 showRangeSelector: true
65 }
66 );
67 </script>
68</body>
69</html>