Intanto grazie dell'aiuto. Non mi è chiaro cosa intendi per creare un loop sul json di partenza. Ho provato a modificare una bar-chart con quello che trovavo su internet, ma credo di essere fuori strada.
codice:
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script> <script type="text/javascript">
var url = 'http://192.168.0.100:80';
google.charts.load('current', {'packages':['bar']});
google.charts.setOnLoadCallback(drawChart);
var data;
var chart;
//////////////////////////////////////////////////////////////
$(document).ready(function(){
var i = 0;
function requestData(){
$.ajax({
url: url,
data: { '': ''},
dataType: 'jsonp',
crossDomain: true,
jsonp: false,
jsonpCallback: 'dati',
success: function(data) {
$('#sensor1').text(data.sensor1);
$('#sensor2').text(data.sensor2);
i++;
setGrafico(i,data.sensor1,data.sensor2);
console.log(data);
}
});
return false;
}
setInterval(requestData, 400);
});
/////////////////////////////////////////////////////////////////
function drawChart() {
var data = google.visualization.arrayToDataTable([
['Temperature ed Umidità', 'Temperatura', 'Umidità'],
// ['Interno', 1000, 400]
]);
var options = {
chart: {
title: 'Grafico Temperatura e umidità',
subtitle: 'Interni ed esterni',
},
bars: 'horizontal' // Required for Material Bar Charts.
};
function setGrafico(i, sensor1,sensor2){
data.addRow([i,sensor1,sensor2]);
chart = new google.charts.Bar(document.getElementById('barchart_material'));
chart.draw(data, options);
return false;
}
</script>
<div id="barchart_material" style="width: 900px; height: 500px;"></div>
Seguendo un esempio in rete ho modificato il json in questo modo:
codice:
dati({sensor1: 0, sensor2: 0})
Però non ne capisco il funzionamento