Added tests for yValueFormatter and showLabelsOnHighlight. s/staticLabels/showLabelsO...
[dygraphs.git] / tests / labelsKMB.html
CommitLineData
02ecfa7a
DV
1<html>
2 <head>
3 <title>labelsKMB</title>
4 <!--[if IE]>
5 <script type="text/javascript" src="excanvas.js"></script>
6 <![endif]-->
7 <script type="text/javascript" src="../dygraph-combined.js"></script>
8 <script type="text/javascript" src="../dygraph-canvas.js"></script>
9 <script type="text/javascript" src="../dygraph.js"></script>
10 </head>
11 <body>
12 <p>labelsKMB:</p>
13 <div id="labelsKMB" style="width:600px; height: 300px;"></div>
14
d160cc3b 15 <p>labelsKMG2:</p>
02ecfa7a
DV
16 <div id="labelsKMG2" style="width:600px; height: 300px;"></div>
17
d160cc3b
NK
18 <p>labelsKMG2 with yValueFormatter:</p>
19 <div id="labelsKMG2yValueFormatter" style="width:600px; height: 300px;"></div>
20
02ecfa7a
DV
21 <p>The curves are exponentials. Zooming in should reveal each of the 'K',
22 'M', 'B', etc. labels.</p>
23
24 <script type="text/javascript">
25 var data = [];
26 for (var i = 0, n = 1; i < 43; i++, n *= 2) {
27 data.push([i, n]);
28 }
29
d160cc3b
NK
30 var suffixes = ['', 'k', 'M', 'G', 'T'];
31 function formatValue(v) {
32 if (v < 1000) return v;
33
34 var magnitude = Math.floor(String(Math.floor(v)).length / 3);
35 if (magnitude > suffixes.length - 1)
36 magnitude = suffixes.length - 1;
37 return String(g.round_(v / Math.pow(10, magnitude * 3), 2)) +
38 suffixes[magnitude];
39 }
40
02ecfa7a
DV
41 new Dygraph(document.getElementById("labelsKMB"), data, { labelsKMB: true });
42 new Dygraph(document.getElementById("labelsKMG2"), data, { labelsKMG2: true });
d160cc3b
NK
43 var g = new Dygraph(document.getElementById("labelsKMG2yValueFormatter"), data,
44 { labelsKMG2: true, yValueFormatter: formatValue });
02ecfa7a
DV
45 </script>
46 </body>
47</html>