Commit | Line | Data |
---|---|---|
54425b14 | 1 | <!DOCTYPE html> |
51e9f651 YK |
2 | <html> |
3 | <head> | |
e21e69e2 | 4 | <title>reverse y-axis</title> |
51e9f651 | 5 | <!--[if IE]> |
a2b2c3a1 | 6 | <script type="text/javascript" src="../excanvas.js"></script> |
51e9f651 | 7 | <![endif]--> |
67b65269 DV |
8 | <script type="text/javascript" src="../strftime/strftime-min.js"></script> |
9 | <script type="text/javascript" src="../rgbcolor/rgbcolor.js"></script> | |
51e9f651 YK |
10 | <script type="text/javascript" src="../dygraph-canvas.js"></script> |
11 | <script type="text/javascript" src="../dygraph.js"></script> | |
12 | </head> | |
13 | <body> | |
e21e69e2 DV |
14 | <h2>Reverse y-axis</h2> |
15 | <font size=-1>This test uses the same data as the <a | |
16 | href='demo.html'>demo</a> test, but reverses the y-axis.</font><br/> | |
51e9f651 YK |
17 | <table><tr><td> |
18 | <div id="demodiv"></div> | |
19 | </td><td valign=top> | |
20 | <div id="status" style="width:200px; font-size:0.8em; padding-top:5px;"></div> | |
21 | </td> | |
22 | </tr></table> | |
23 | <script type="text/javascript"> | |
00259bf3 | 24 | g = new Dygraph( |
51e9f651 YK |
25 | document.getElementById("demodiv"), |
26 | function() { | |
27 | var zp = function(x) { if (x < 10) return "0"+x; else return x; }; | |
28 | var r = "date,parabola,line,another line,sine wave\n"; | |
29 | for (var i=1; i<=31; i++) { | |
30 | r += "200610" + zp(i); | |
31 | r += "," + 10*(i*(31-i)); | |
32 | r += "," + 10*(8*i); | |
33 | r += "," + 10*(250 - 8*i); | |
34 | r += "," + 10*(125 + 125 * Math.sin(0.3*i)); | |
35 | r += "\n"; | |
36 | } | |
37 | return r; | |
38 | }, | |
39 | null, | |
40 | { | |
41 | rollPeriod: 1, | |
42 | labelsDiv: document.getElementById('status'), | |
43 | labelsSeparateLines: true, | |
44 | labelsKMB: true, | |
45 | colors: ["rgb(51,204,204)", | |
46 | "rgb(255,100,100)", | |
47 | "#00DD55", | |
48 | "rgba(50,50,200,0.4)"], | |
49 | padding: {left: 40, right: 30, top: 15, bottom: 15}, | |
50 | width: 480, | |
51 | height: 320, | |
e21e69e2 | 52 | valueRange: [3000, 0] // Reverse y-axis |
51e9f651 YK |
53 | } |
54 | ); | |
55 | </script> | |
56 | </body> | |
57 | </html> |