4 <meta http-equiv=
"X-UA-Compatible" content=
"IE=EmulateIE7; IE=EmulateIE9">
5 <title>dygraphs number display
</title>
7 <script type=
"text/javascript" src=
"../excanvas.js"></script>
9 <script type=
"text/javascript" src=
"../strftime/strftime-min.js"></script>
10 <script type=
"text/javascript" src=
"../rgbcolor/rgbcolor.js"></script>
11 <script type=
"text/javascript" src=
"../dygraph-canvas.js"></script>
12 <script type=
"text/javascript" src=
"../dygraph.js"></script>
13 <style type=
"text/css">
15 border:
1px solid black;
17 border-collapse: collapse;
21 border:
1px solid black;
27 <h2>dygraphs number display
</h2>
28 <p>Dygraphs can display numbers in either scientific mode (fixed number of significant figures) or fixed-point mode (fixed number of digits after the decimal point). It is in fixed-point mode by default.
</p>
29 <p>To switch to scientific mode, set the
<i>sigFigs
</i> option to the number of significant figures in your data.
</p>
30 <p>In fixed-point mode, you can control the number of digits after the decimal using the
<i>digitsAfterDecimal
</i> option. For particularly large numbers, this format can get unwieldy (i.e. '
100000000' for
100M is a bit lengthy). Once the numbers get to a certain length, dygraphs will switch over to scientific notation. This is controlled by the
<i>maxNumberWidth
</i> option.
</p>
34 <script type=
"text/javascript">
71 var scientific = [
1,
2,
3,
4,
5,
6 ];
72 var fixed = [ [
2,
6], [
3,
6], [
5,
6], [
1,
10], [
2,
10], [
5,
10] ];
74 // Helper functions for generating an HTML table for holding the test
76 createRow = function(columnType, columns) {
77 var row = document.createElement('tr');
78 for (var i =
0; i < columns.length; i ++) {
79 var th = document.createElement(columnType);
80 var text = document.createTextNode(columns[i]);
87 var html = '
<table class=thinborder
>';
88 html += '
<tr><th> </th><th colspan=' + scientific.length + '
>Scientific (sigFigs)
</th><th colspan=' + fixed.length + '
>Fixed (digitsAfterDecimal, maxNumberWidth)
</th></tr>\n';
89 html += '
<tr><th>Number
</th>';
90 for (var i =
0; i < scientific.length; i++) {
91 html += '
<th>' + scientific[i] + '
</th>';
93 for (var i =
0; i < fixed.length; i++) {
94 html += '
<th>' + fixed[i] + '
</th>';
104 for (var j =
0; j < nums.length; j++) {
107 html += '
<td>' + x + '
</td>';
108 for (var i =
0; i < scientific.length; i++) {
109 attr = { sigFigs: scientific[i] };
110 html += '
<td>' + Dygraph.numberFormatter(x, g_mock) + '
</td>';
112 for (var i =
0; i < fixed.length; i++) {
113 attr = { sigFigs: null, digitsAfterDecimal: fixed[i][
0], maxNumberWidth: fixed[i][
1] };
114 html += '
<td>' + Dygraph.numberFormatter(x, g_mock) + '
</td>';
120 document.getElementById('blah').innerHTML = html;