2013年6月1日土曜日

Raspberry Pi: Mincraft-Piも試し終わり,どうしようと思った所で@shokaiさんのLindaで遊び始めた.

タイトルの通り,Lindaをraspberry piに入れて遊んでます.linda-arduino-sensorも動かしてるのでこいつを,flotでグラフ化してみた.

(温度センサもCdSも安定してない…)
(rpi.localはlinda-baseの動いてるraspberry piのこと.Lindaはクロスドメインをデフォルトでは許可してるのでこのコード自体はローカルファイルのfoobar.htmlでも動く)
<html>
 <head>
  <!-- http://jquery.com -->
  <script src="./jquery.min.js"></script>
  
  <!-- http://www.flotcharts.org -->
  <script src="./jquery.flot.min.js" type="text/javascript"></script>
  <script src="./jquery.flot.time.js" type="text/javascript"></script>
  
  <!-- https://github.com/shokai/linda-base -->
  <script src="http://rpi.local:5000/rocketio/linda.js"></script>
  
  <script>
   var space_name= "myhome";
   var tuple= ["sensor"];
   var linda= new Linda();
   var ts= new linda.TupleSpace(space_name);
   var data= [];
   var data2= [];
   $(function() {
    //linda
    linda.io.on("connect", function() {
     ts.watch(tuple, function(_tuple) {
      log(_tuple)
     });
    });
    linda.io.on("disconnect", function() {
    });
    var log= function(msg) {
     if(msg[1] == 'light')
      data.push([(new Date()).getTime(), msg[2]]);
     else if(msg[1] == 'temperature')
      data2.push([(new Date()).getTime(), msg[2]]);
    }
    
    //flot
    var container= $("#placeholder");
    var maximum= container.outerWidth() / 2 || 300;
    function getData(_data) {
     while(_data.length > maximum) {
      _data= _data.slice(1);
     }
     return _data;
    }
    series= [{
     data: getData(data),
     label: "light",
     lines: {
      fill: false,
     }
    }, {
     data: getData(data2),
     label: "temp.",
     yaxis: 2,
     lines: {
      fill: false,
     }
    }];
    var plot= $.plot(container, series, {
     grid: {
      borderWidth: 1,
      minBorderMargin: 20,
      labelMargin: 10,
      backgroundColor: {
       colors: ["#fff", "#e4f4f4"]
      },
      margin: {
       top: 8,
       bottom: 20,
       left: 20
      },
      markings: function(axes) {
       var markings= [];
       var xaxis= axes.xaxis;
       for(var x= Math.floor(xaxis.min); x < xaxis.max; x+= xaxis.tickSize * 2) {
        markings.push({
         xaxis: {
          from: x,
          to: x + xaxis.tickSize
         },
         color: "rgba(232, 232, 255, 0.2)"
        });
       }
       return markings;
      }
     },
     xaxis: {
      mode: "time",
      timezone: "browser",
      timeformat: "%H:%M:%S",
      ticks: 8,
     },
     yaxes: [{
      tickFormatter: function(val, axis){return val.toFixed(1)},
     }, {
      tickFormatter: function(val, axis){return val.toFixed(1)},
     }],
     legend: {
      show: true,
      position: "sw",
     }
    });
    setInterval(function updateSeries() {
     series[0].data= getData(data);
     series[1].data= getData(data2);
     plot.setData(series);
     plot.setupGrid();
     plot.draw();
    }, 1000);
   });
  </script>
 </head>
 <body>
  <div id="container">
   <div id="placeholder" style="width:800px;height:300px;"></div>
  </div>
 </body>
</html>
ちなみにsystem_timerはruby1.9.3でうまく入らなかったのでtwを使う上ではrubyは1.8系である必要があった(私だけかもしれないけど).

0 件のコメント: