mirror of
https://gitlab.silvrtree.co.uk/martind2000/mdot_server.git
synced 2025-02-25 10:53:35 +00:00
added occupancy to the chart
This commit is contained in:
parent
88cb33f29a
commit
7226a31a8e
@ -65,7 +65,7 @@
|
|||||||
|
|
||||||
if (typeof branch === 'undefined') return count;
|
if (typeof branch === 'undefined') return count;
|
||||||
_(branch).each(function(item) {
|
_(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;
|
count = item.count;
|
||||||
return count;
|
return count;
|
||||||
}
|
}
|
||||||
@ -79,9 +79,13 @@
|
|||||||
*/
|
*/
|
||||||
var _tree = {};
|
var _tree = {};
|
||||||
_(occupancy).each(function(item) {
|
_(occupancy).each(function(item) {
|
||||||
|
let newItem = item;
|
||||||
let day, month,year;
|
let day, month,year;
|
||||||
let _date = new Date(item.start);
|
let _date = new Date(item.start);
|
||||||
|
|
||||||
|
newItem.startMS = new Date(item.start).getTime();
|
||||||
|
newItem.endMS = new Date(item.end).getTime();
|
||||||
|
|
||||||
day = _date.getDate().toString();
|
day = _date.getDate().toString();
|
||||||
month = _date.getMonth().toString();
|
month = _date.getMonth().toString();
|
||||||
year = _date.getFullYear().toString();
|
year = _date.getFullYear().toString();
|
||||||
@ -101,7 +105,7 @@
|
|||||||
_tree[year][month][day] = [];
|
_tree[year][month][day] = [];
|
||||||
}
|
}
|
||||||
|
|
||||||
_tree[year][month][day].push(item);
|
_tree[year][month][day].push(newItem);
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -115,6 +119,7 @@
|
|||||||
|
|
||||||
processAdded: function() {
|
processAdded: function() {
|
||||||
console.log('Model:ProcessAdded');
|
console.log('Model:ProcessAdded');
|
||||||
|
console.time('processAdd');
|
||||||
var self = this;
|
var self = this;
|
||||||
var skipOccupancy = false;
|
var skipOccupancy = false;
|
||||||
var tempCollection = new Backbone.Collection();
|
var tempCollection = new Backbone.Collection();
|
||||||
@ -151,8 +156,9 @@
|
|||||||
|
|
||||||
DeviceCollection.models = tempCollection.models;
|
DeviceCollection.models = tempCollection.models;
|
||||||
|
|
||||||
|
console.timeEnd('processAdd');
|
||||||
DeviceCollection.trigger('update');
|
DeviceCollection.trigger('update');
|
||||||
|
|
||||||
notification.notify('success', 'Data loaded');
|
notification.notify('success', 'Data loaded');
|
||||||
|
|
||||||
}, decoder: function(data) {
|
}, decoder: function(data) {
|
||||||
@ -316,13 +322,10 @@
|
|||||||
|
|
||||||
doChartV2: function(chartData) {
|
doChartV2: function(chartData) {
|
||||||
var self = this;
|
var self = this;
|
||||||
|
console.time('doChartV2');
|
||||||
self.chart = AmCharts.makeChart('chartdiv', {
|
self.chart = AmCharts.makeChart('chartdiv', {
|
||||||
type: 'serial',
|
type: 'serial',
|
||||||
theme: 'light',
|
theme: 'light',
|
||||||
dataSets: [
|
|
||||||
|
|
||||||
],
|
|
||||||
|
|
||||||
legend: {
|
legend: {
|
||||||
useGraphSettings: true,
|
useGraphSettings: true,
|
||||||
@ -392,9 +395,9 @@
|
|||||||
],
|
],
|
||||||
graphs: [{id: 'occ',
|
graphs: [{id: 'occ',
|
||||||
valueAxis: 'occupancy',
|
valueAxis: 'occupancy',
|
||||||
"type": "column",
|
type: 'column',
|
||||||
"clustered":true,
|
clustered: true,
|
||||||
"columnWidth":1,
|
columnWidth: 1,
|
||||||
lineColor: '#aaaaaa',
|
lineColor: '#aaaaaa',
|
||||||
title: 'Occupancy',
|
title: 'Occupancy',
|
||||||
valueField: 'occupancy',
|
valueField: 'occupancy',
|
||||||
@ -439,18 +442,18 @@
|
|||||||
}*/
|
}*/
|
||||||
],
|
],
|
||||||
chartScrollbar: {
|
chartScrollbar: {
|
||||||
graph:'occ',"oppositeAxis":false,
|
graph: 'occ',oppositeAxis: false,
|
||||||
"offset":30,
|
offset: 30,
|
||||||
"scrollbarHeight": 80,
|
scrollbarHeight: 80,
|
||||||
"backgroundAlpha": 0,
|
backgroundAlpha: 0,
|
||||||
"selectedBackgroundAlpha": 0.1,
|
selectedBackgroundAlpha: 0.1,
|
||||||
"selectedBackgroundColor": "#888888",
|
selectedBackgroundColor: '#888888',
|
||||||
"graphFillAlpha": 0,
|
graphFillAlpha: 0,
|
||||||
"graphLineAlpha": 0.5,
|
graphLineAlpha: 0.5,
|
||||||
"selectedGraphFillAlpha": 0,
|
selectedGraphFillAlpha: 0,
|
||||||
"selectedGraphLineAlpha": 1,
|
selectedGraphLineAlpha: 1,
|
||||||
"autoGridCount":true,
|
autoGridCount: true,
|
||||||
"color":"#AAAAAA"
|
color: '#AAAAAA'
|
||||||
},
|
},
|
||||||
chartCursor: {
|
chartCursor: {
|
||||||
cursorPosition: 'mouse',
|
cursorPosition: 'mouse',
|
||||||
@ -473,9 +476,12 @@ graph:'occ',"oppositeAxis":false,
|
|||||||
$('#chartdiv').empty();
|
$('#chartdiv').empty();
|
||||||
self.chart.write('chartdiv');
|
self.chart.write('chartdiv');
|
||||||
|
|
||||||
|
console.timeEnd('doChartV2');
|
||||||
}, updateGraphV2: function() {
|
}, updateGraphV2: function() {
|
||||||
|
console.time('updateGraphV2');
|
||||||
var self = this;
|
var self = this;
|
||||||
var chartData = [];
|
var chartData = [];
|
||||||
|
console.time('chartData');
|
||||||
_(this.collection.models).each(function(i) {
|
_(this.collection.models).each(function(i) {
|
||||||
chartData.push({
|
chartData.push({
|
||||||
date: i.get('dt'),
|
date: i.get('dt'),
|
||||||
@ -487,9 +493,11 @@ graph:'occ',"oppositeAxis":false,
|
|||||||
occupancy: i.get('occupancy')
|
occupancy: i.get('occupancy')
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
console.timeEnd('chartData');
|
||||||
|
|
||||||
// Console.log(chartData);
|
// Console.log(chartData);
|
||||||
self.doChartV2(chartData);
|
self.doChartV2(chartData);
|
||||||
|
console.timeEnd('updateGraphV2');
|
||||||
}
|
}
|
||||||
|
|
||||||
});
|
});
|
||||||
|
@ -3,6 +3,8 @@
|
|||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<title>Graph</title>
|
<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/mui.css" rel="stylesheet" type="text/css"/>
|
||||||
<link href="css/test.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"/>
|
<link href="css/style.css" rel="stylesheet" type="text/css"/>
|
||||||
|
Loading…
Reference in New Issue
Block a user