tests/significant-figures.html

   1 <html>
   2   <head>
   3     <title>significant figures</title>
   4     <!--[if IE]>
   5     <script type="text/javascript" src="../excanvas.js"></script>
   6     <![endif]-->
   7     <script type="text/javascript" src="../strftime/strftime-min.js"></script>
   8     <script type="text/javascript" src="../rgbcolor/rgbcolor.js"></script>
   9     <script type="text/javascript" src="../dygraph-canvas.js"></script>
  10     <script type="text/javascript" src="../dygraph.js"></script>
  11   </head>
  12   <body>
  13     <p>Tests for various inputs to Dygraph.significantFigures().  All tests
  14        should have result PASS.</p>
  15     <div id="tests"></div>
  16
  17     <script type="text/javascript">
  18       // Helper functions for generating an HTML table for holding the test
  19       // results.
  20       createRow = function(columnType, columns) {
  21         var row = document.createElement('tr');
  22         for (var i = 0; i  < columns.length; i ++) {
  23           var th = document.createElement(columnType);
  24           var text = document.createTextNode(columns[i]);
  25           th.appendChild(text);
  26           row.appendChild(th);
  27         };
  28         return row;
  29       };
  30
  31       createHeaderRow = function(columns) {
  32         return createRow('th', columns);
  33       };
  34
  35       createDataRow = function(columns) {
  36         return createRow('td', columns);
  37       };
  38
  39       createTable = function(headerColumns, dataColumnsList) {
  40         var table = document.createElement('table');
  41         table.appendChild(createHeaderRow(headerColumns));
  42         for (var i = 0; i < dataColumnsList.length; i++) {
  43           table.appendChild(createDataRow(dataColumnsList[i]));
  44         }
  45         table.setAttribute('border', '1');
  46         return table;
  47       };
  48
  49       // input gives input floating point in string form
  50       // expected gives number of significant figures
  51       var testData = [
  52           {input: '1.0', expected: 1},
  53           {input: '1.0000', expected: 1},
  54           {input: '3.14159', expected: 6},
  55           {input: '3.05', expected: 3},
  56           {input: '3.0000001', expected: 8},
  57           {input: '1.999999999999', expected: 13}  // = 13 digits.
  58       ];
  59
  60       var headers = ['Input', 'Output', 'Expected', 'Test Result'];
  61       var data = [];
  62
  63       for (var i = 0; i < testData.length; i++) {
  64         var test = testData[i];
  65         var output = Dygraph.significantFigures(parseFloat(test.input));
  66         data[i] = [test.input, output, test.expected,
  67                    (output == test.expected ? 'PASS' : 'FAIL')];
  68       }
  69
  70       var root = document.getElementById('tests');
  71       root.appendChild(createTable(headers, data));
  72     </script>
  73
  74     <br>
  75     <br>
  76
  77     <p>Check for correct number of significant figures with very small
  78        y values.  Both plots have the same input x,y values.</p>
  79
  80     <div id="smallvals1" style="width:600px; height:300px;"></div>
  81     <br>
  82     <br>
  83     <div id="smallvals2" style="width:600px; height:300px;"></div>
  84
  85     <script type="text/javascript">
  86       var data = [
  87           [2.036e-7, 1.02e-7],
  88           [2.125e-7, 1.1e-7],
  89           [2.212e-7, 1.2e-7],
  90           [2.333e-7, 1.522e-7]
  91       ];
  92
  93       new Dygraph(document.getElementById("smallvals1"), data,
  94           {
  95             labels: ["Date","CustomFormatting"],
  96             xValueFormatter: function(x) { return x.toPrecision(4); },
  97             yValueFormatter: function(x) { return x.toPrecision(3); }
  98           });
  99
 100       new Dygraph(document.getElementById("smallvals2"), data,
 101           {
 102             labels: ["Date","DefaultFormat"]
 103           });
 104     </script>
 105   </body>
 106 </html>