added occupancy to the chart

This commit is contained in:
Martin Donnelly 2016-08-23 14:10:36 +01:00
parent 88cb33f29a
commit 7226a31a8e
2 changed files with 33 additions and 23 deletions

View File

@ -65,7 +65,7 @@
if (typeof branch === 'undefined') return count;
_(branch).each(function(item) {
if ((tsMS >= new Date(item.start).getTime()) && (tsMS <= new Date(item.end).getTime())) {
if ((tsMS >= item.startMS) && (tsMS <= item.endMS)) {
count = item.count;
return count;
}
@ -79,9 +79,13 @@
*/
var _tree = {};
_(occupancy).each(function(item) {
let newItem = item;
let day, month,year;
let _date = new Date(item.start);
newItem.startMS = new Date(item.start).getTime();
newItem.endMS = new Date(item.end).getTime();
day = _date.getDate().toString();
month = _date.getMonth().toString();
year = _date.getFullYear().toString();
@ -101,7 +105,7 @@
_tree[year][month][day] = [];
}
_tree[year][month][day].push(item);
_tree[year][month][day].push(newItem);
}
@ -115,6 +119,7 @@
processAdded: function() {
console.log('Model:ProcessAdded');
console.time('processAdd');
var self = this;
var skipOccupancy = false;
var tempCollection = new Backbone.Collection();
@ -151,8 +156,9 @@
DeviceCollection.models = tempCollection.models;
console.timeEnd('processAdd');
DeviceCollection.trigger('update');
notification.notify('success', 'Data loaded');
}, decoder: function(data) {
@ -316,13 +322,10 @@
doChartV2: function(chartData) {
var self = this;
console.time('doChartV2');
self.chart = AmCharts.makeChart('chartdiv', {
type: 'serial',
theme: 'light',
dataSets: [
],
legend: {
useGraphSettings: true,
@ -392,9 +395,9 @@
],
graphs: [{id: 'occ',
valueAxis: 'occupancy',
"type": "column",
"clustered":true,
"columnWidth":1,
type: 'column',
clustered: true,
columnWidth: 1,
lineColor: '#aaaaaa',
title: 'Occupancy',
valueField: 'occupancy',
@ -439,18 +442,18 @@
}*/
],
chartScrollbar: {
graph:'occ',"oppositeAxis":false,
"offset":30,
"scrollbarHeight": 80,
"backgroundAlpha": 0,
"selectedBackgroundAlpha": 0.1,
"selectedBackgroundColor": "#888888",
"graphFillAlpha": 0,
"graphLineAlpha": 0.5,
"selectedGraphFillAlpha": 0,
"selectedGraphLineAlpha": 1,
"autoGridCount":true,
"color":"#AAAAAA"
graph: 'occ',oppositeAxis: false,
offset: 30,
scrollbarHeight: 80,
backgroundAlpha: 0,
selectedBackgroundAlpha: 0.1,
selectedBackgroundColor: '#888888',
graphFillAlpha: 0,
graphLineAlpha: 0.5,
selectedGraphFillAlpha: 0,
selectedGraphLineAlpha: 1,
autoGridCount: true,
color: '#AAAAAA'
},
chartCursor: {
cursorPosition: 'mouse',
@ -473,9 +476,12 @@ graph:'occ',"oppositeAxis":false,
$('#chartdiv').empty();
self.chart.write('chartdiv');
console.timeEnd('doChartV2');
}, updateGraphV2: function() {
console.time('updateGraphV2');
var self = this;
var chartData = [];
console.time('chartData');
_(this.collection.models).each(function(i) {
chartData.push({
date: i.get('dt'),
@ -487,9 +493,11 @@ graph:'occ',"oppositeAxis":false,
occupancy: i.get('occupancy')
});
});
console.timeEnd('chartData');
// Console.log(chartData);
self.doChartV2(chartData);
console.timeEnd('updateGraphV2');
}
});

View File

@ -3,6 +3,8 @@
<head>
<meta charset="UTF-8">
<title>Graph</title>
<meta name="viewport"
content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">
<link href="css/mui.css" rel="stylesheet" type="text/css"/>
<link href="css/test.css" rel="stylesheet" type="text/css"/>
<link href="css/style.css" rel="stylesheet" type="text/css"/>