Skip to content

Instantly share code, notes, and snippets.

@frah
Created Apr 17, 2016
Embed
What would you like to do?
グラフ描画(主要部のみ)
function onMessageArrived(message) {
var j = JSON.parse(message.payloadString);
var data = undefined;
var datas = j.datas;
for (var i=0;i<datas.length;i++) {
switch (datas[i].name) {
case "watt":
data = datas[i];
break;
case "temperature":
tr_cols[0].push(datas[i].value);
break;
case "humidity":
tr_cols[1].push(datas[i].value);
break;
}
}
if (data !== undefined) {
if (columns.length > 0) {
var idx = -1;
for (var i = 0; i < columns.length; i++) {
if (columns[i][0] === j.device) {
idx = i;
break;
}
}
if (idx >= 0)
columns[idx].push(data.value);
else
columns.push([j.device, data.value]);
} else {
columns.push([j.device, data.value]);
}
chart.load({ columns: columns });
} else {
tr_chart.load({ columns: tr_cols });
}
}
var chart = c3.generate({
bindto: '#chart',
data: {
columns: columns
},
zoom: { enabled: true },
axis: {
y: {tick: { format: function(d) { return d + "W"; } }}
}
});
var tr_chart = c3.generate({
bindto: '#TR',
data: {
columns: tr_cols,
axes: {
temperature: 'y',
humidity: 'y2'
}
},
zoom: { enabled: true },
axis: {
y: {
show: true,
tick: { format: function(d) { return d + "C"; } }
},
y2: {
show: true,
tick: { format: function(d) { return d + "%"; } }
}
}
});
d3.json('https://xxxxxxx.execute-api.ap-northeast-1.amazonaws.com/prod/hoge', function(data) {
columns = [data.watt.slice(0,100)];
columns[0].unshift(data.device);
chart.load({columns: columns, type: 'area'});
tr_cols = [data.temperature.slice(0,100), data.humidity.slice(0,100)];
tr_cols[0].unshift('temperature');
tr_cols[1].unshift('humidity');
tr_chart.load({columns: tr_cols, type: 'spline'});
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment