Finished change of chart api. issue 1
This commit is contained in:
parent
5a7d1042de
commit
0fac8b29f8
2 changed files with 45 additions and 21 deletions
|
|
@ -29,37 +29,25 @@
|
||||||
|
|
||||||
function initChart(elementId, url, time){
|
function initChart(elementId, url, time){
|
||||||
$.getJSON(url, function(json){
|
$.getJSON(url, function(json){
|
||||||
var dataXs = {};
|
|
||||||
var data = [];
|
|
||||||
var labels = [];
|
|
||||||
json.forEach(function(d, i) {
|
|
||||||
var index = 'data'+i;
|
|
||||||
labels[index] = d.name;
|
|
||||||
dataXs[index] = 'data'+i+'x';
|
|
||||||
data.push([index+'x'].concat(d.timestamps));
|
|
||||||
data.push([index].concat(d.data));
|
|
||||||
});
|
|
||||||
|
|
||||||
var chart = c3.generate({
|
var chart = c3.generate({
|
||||||
bindto: elementId,
|
bindto: elementId,
|
||||||
data: {
|
data: getChartData(json),
|
||||||
xs: dataXs,
|
|
||||||
columns: data,
|
|
||||||
names: labels,
|
|
||||||
type: 'spline',
|
|
||||||
xFormat: null,
|
|
||||||
},
|
|
||||||
axis : {
|
axis : {
|
||||||
x : {
|
x : {
|
||||||
type : 'timeseries',
|
type : 'timeseries',
|
||||||
label: 'Timestamp'
|
label: 'Timestamp',
|
||||||
|
tick: {
|
||||||
|
format: '%Y-%m-%d %H:%M'
|
||||||
|
}
|
||||||
},
|
},
|
||||||
y: {
|
y: {
|
||||||
label: 'Power'
|
label: 'Power (kWh)',
|
||||||
|
min: 0,
|
||||||
},
|
},
|
||||||
y2: {
|
y2: {
|
||||||
show: true,
|
show: true,
|
||||||
label: 'Temperature'
|
label: 'Temperature (C)',
|
||||||
|
min: 0,
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
grid: {
|
grid: {
|
||||||
|
|
@ -69,7 +57,41 @@
|
||||||
show: false
|
show: false
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
if(time > 0)
|
||||||
|
setTimeout(function(){ updateChart(chart, url, time); }, time);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
function updateChart(chart, url, time){
|
||||||
|
$.getJSON(url, function(json){
|
||||||
|
chart.flow(getChartData(json));
|
||||||
|
});
|
||||||
|
setTimeout(function(){ updateChart(chart, url, time); }, time);
|
||||||
|
}
|
||||||
|
function getChartData(json){
|
||||||
|
var dataXaxis = {};
|
||||||
|
var dataYaxis = {};
|
||||||
|
var data = [];
|
||||||
|
var labels = [];
|
||||||
|
json.forEach(function(sensor, i) {
|
||||||
|
var index = 'data'+i;
|
||||||
|
labels[index] = sensor.user +": "+ sensor.name;
|
||||||
|
dataXaxis[index] = 'data'+i+'x';
|
||||||
|
data.push([index+'x'].concat(sensor.timestamps));
|
||||||
|
data.push([index].concat(sensor.data));
|
||||||
|
if (sensor.type == "PowerConsumptionSensorData")
|
||||||
|
dataYaxis[index] = 'y';
|
||||||
|
else //if (sensor.type == "TemperatureSensorData")
|
||||||
|
dataYaxis[index] = 'y2';
|
||||||
|
});
|
||||||
|
|
||||||
|
return {
|
||||||
|
xs: dataXaxis,
|
||||||
|
columns: data,
|
||||||
|
names: labels,
|
||||||
|
type: 'spline',
|
||||||
|
axes: dataYaxis,
|
||||||
|
};
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -109,6 +109,8 @@ public class PCOverviewHttpPage extends HalHttpPage implements HalHttpPage.HalJs
|
||||||
|
|
||||||
DataNode deviceNode = new DataNode(DataNode.DataType.Map);
|
DataNode deviceNode = new DataNode(DataNode.DataType.Map);
|
||||||
deviceNode.set("name", sensor.getName());
|
deviceNode.set("name", sensor.getName());
|
||||||
|
deviceNode.set("user", sensor.getUser().getUsername());
|
||||||
|
deviceNode.set("type", sensor.getDeviceConfig().getSensorDataClass().getSimpleName());
|
||||||
deviceNode.set("timestamps", timestampNode);
|
deviceNode.set("timestamps", timestampNode);
|
||||||
deviceNode.set("data", dataNode);
|
deviceNode.set("data", dataNode);
|
||||||
root.add(deviceNode);
|
root.add(deviceNode);
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue