tests/significant-figures.html

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