When possible, record the file/line number that logged an error/warning.
[dygraphs.git] / tests / y-axis-formatter.html
CommitLineData
54425b14 1<!DOCTYPE html>
84fc6aa7
NN
2<html>
3 <head>
10494b48 4 <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7; IE=EmulateIE9">
84fc6aa7
NN
5 <title>dygraph</title>
6 <!--[if IE]>
e1fb3740 7 <script type="text/javascript" src="../excanvas.js"></script>
84fc6aa7 8 <![endif]-->
7e5ddc94
DV
9 <!--
10 For production (minified) code, use:
11 <script type="text/javascript" src="dygraph-combined.js"></script>
12 -->
13 <script type="text/javascript" src="../dygraph-dev.js"></script>
14
84fc6aa7
NN
15 </head>
16 <body>
17
18 <h1>Potential Y Axis formatting problems for small values</h1>
19
48e614ac
DV
20 <p>The problem using default y axis formatting for very small values:<br/>
21 (this was more of a problem before dygraphs automatically switched to scientific notation)</p>
84fc6aa7
NN
22 <div id="graph1"></div>
23 <script type="text/javascript">
24 new Dygraph(
25 document.getElementById("graph1"),
26 [
27 [1, 0.0],
28 [2, 0.0001],
29 [3, 0.0002],
30 [4, 0.0004],
31 [5, 0.0005]
32 ],
33 {
34 stepPlot: true,
35 labels: ["X", "Data"]
36 }
37 );
38 </script>
39
40 <p>The solution using a Y axis formatting function:</p>
41 <div id="graph2"></div>
42 <script type="text/javascript">
43 new Dygraph(
44 document.getElementById("graph2"),
45 [
46 [1, 0.0],
47 [2, 0.0001],
48 [3, 0.0002],
49 [4, 0.0004],
50 [5, 0.0005]
51 ],
52 {
53 stepPlot: true,
48e614ac
DV
54 labels: ["X", "Data"],
55 axes: {
56 y: {
57 valueFormatter: function(x) {
58 var shift = Math.pow(10, 5)
59 return Math.round(x * shift) / shift
60 },
61 }
62 }
84fc6aa7
NN
63 }
64 );
65 </script>
66
67 <p>Different yValueFormatter and yAxisLabelFormatter functions:</p>
68 <div id="graph3"></div>
69 <script type="text/javascript">
70 new Dygraph(
71 document.getElementById("graph3"),
72 [
73 [1, 0.0],
74 [2, 0.0001],
75 [3, 0.0002],
76 [4, 0.0004],
77 [5, 0.0005]
78 ],
79 {
80 stepPlot: true,
48e614ac
DV
81 labels: ["X", "Data"],
82 axes: {
83 y: {
84 valueFormatter: function(x) {
85 var shift = Math.pow(10, 5)
86 return "*" + Math.round(x * shift) / shift
87 },
88 axisLabelFormatter: function(x) {
89 var shift = Math.pow(10, 5)
90 return "+" + Math.round(x * shift) / shift
91 }
92 }
93 }
84fc6aa7
NN
94 }
95 );
96 </script>
97
98 </body>
99</html>