weather-odometer.php

   1 <?php ob_start('ob_gzhandler') ?>
   2 <?
   3 if (isset($_GET['item'])) {
   4   $item=$_GET['item'];
   5   $doc = new DOMDocument();
   6   $doc->load('http://weather/weather/all-output.xml');
   7   $arrFeeds = array();
   8   foreach ($doc->getElementsByTagName('weather') as $node) {
   9     $itemRSS = array (
  10       $item => $node->getElementsByTagName($item)->item(0)->nodeValue,
  11       );
  12     array_push($arrFeeds, $itemRSS);
  13   }
  14 }
  15 ?>
  16 <!DOCTYPE html>
  17 <html>
  18 <head>
  19     <script src="../libraries/RGraph.common.core.js" ></script>
  20     <script src="../libraries/RGraph.common.context.js" ></script>
  21     <script src="../libraries/RGraph.common.annotate.js" ></script>
  22     <script src="../libraries/RGraph.common.zoom.js" ></script>
  23     <script src="../libraries/RGraph.odo.js" ></script>
  24
  25     <script>
  26        window.onload = function ()
  27         {
  28             // ID, MINIMUM, MAXIMUM, INDICATED VALUE
  29             var odo2 = new RGraph.Odometer('odo2', 0, 360, <? echo $itemRSS[$item]; ?>);
  30             odo2.Set('chart.annotatable', false);
  31             //odo2.Set('chart.needle.thickness', 6);
  32             odo2.Set('chart.needle.color', 'black');
  33             odo2.Set('chart.needle.tail', false);
  34             //odo2.Set('chart.needle.type', 'triangle');
  35             odo2.Set('chart.label.area', 22);
  36             odo2.Set('chart.contextmenu', [['Clear', function () {RGraph.Clear(odo2.canvas); odo2.Draw();}]]);
  37             //odo2.Set('chart.border', document.all ? false : true);
  38             //odo2.Set('chart.tickmarks.highlighted', true);
  39             odo2.Set('chart.labels', ['N','NE','E','SE','S','SW','W','NW']);
  40             odo2.Set('chart.red.min', 360);
  41             odo2.Set('chart.red.color', 'gray');
  42             //odo2.Set('chart.value.text', true);
  43             odo2.Set('chart.value.units.post', ' degrees');
  44             odo2.Draw();
  45         }
  46     </script>
  47 </head>
  48 <body>
  49
  50     <div style="text-align: center">
  51         <canvas id="odo2" width="200" height="200"><div class="canvasfallback">[No canvas support]</div></canvas>
  52     </div>
  53
  54 </body>
  55 </html>