mirror of
https://git.rwth-aachen.de/acs/public/villas/web/
synced 2025-03-09 00:00:01 +01:00
Use time stamps on X axis
This commit is contained in:
Markus Grigull
parent
2fd9aee6aa
commit
f382dc9e8b
6 changed files with 73 additions and 69 deletions
|
|
@ -3,7 +3,7 @@ import Ember from 'ember';
|
|||
export default Ember.Component.extend({
|
||||
tagName: 'div',
|
||||
classNames: ['line-chart'],
|
||||
xaxisLength: 100,
|
||||
xaxisLength: 60,
|
||||
|
||||
init: function() {
|
||||
this._super();
|
||||
|
|
@ -23,29 +23,38 @@ export default Ember.Component.extend({
|
|||
},
|
||||
|
||||
_drawPlot: function() {
|
||||
var element = this.get('element');
|
||||
if (element && element.id) {
|
||||
// calculate displayed xaxis
|
||||
var length = this.data[0].length;
|
||||
var startIndex = 0;
|
||||
var endIndex = this.xaxisLength;
|
||||
if (this.data) {
|
||||
var element = this.get('element');
|
||||
if (element && element.id) {
|
||||
// calculate displayed xaxis
|
||||
/*var length = this.data.length;
|
||||
var startIndex = 0;
|
||||
var endIndex = this.xaxisLength;
|
||||
|
||||
if (length > this.xaxisLength) {
|
||||
startIndex = length - this.xaxisLength;
|
||||
endIndex = length;
|
||||
if (length > this.xaxisLength) {
|
||||
startIndex = length - this.xaxisLength;
|
||||
endIndex = length;
|
||||
}
|
||||
|
||||
// display the chart
|
||||
$.plot('#' + element.id, this.data, {
|
||||
xaxis: {
|
||||
min: startIndex,
|
||||
max: endIndex
|
||||
},
|
||||
});*/
|
||||
|
||||
$.plot('#' + element.id, [this.data], {
|
||||
xaxis: {
|
||||
mode: 'time',
|
||||
timeformat: '%H:%M:%S'
|
||||
}
|
||||
});
|
||||
|
||||
Ember.run.later(this, function() {
|
||||
this._drawPlot();
|
||||
}, 500);
|
||||
}
|
||||
|
||||
// display the chart
|
||||
$.plot('#' + element.id, this.data, {
|
||||
xaxis: {
|
||||
min: startIndex,
|
||||
max: endIndex
|
||||
},
|
||||
});
|
||||
|
||||
Ember.run.later(this, function() {
|
||||
this._drawPlot();
|
||||
}, 500);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
|
|
|||
|
|
@ -6,6 +6,7 @@ export default DS.Model.extend({
|
|||
type: DS.attr('string'),
|
||||
timestamp: DS.attr('date'),
|
||||
history: DS.attr(),
|
||||
visible: DS.attr('boolean', { defaultValue: false }),
|
||||
entity: DS.belongsTo('entity'),
|
||||
category: DS.belongsTo('category')
|
||||
});
|
||||
|
|
|
|||
|
|
@ -4,22 +4,13 @@ export default DS.RESTSerializer.extend({
|
|||
normalizeFindAllResponse: function(store, primaryModelClass, payload, id, requestType) {
|
||||
var json = { data: [] };
|
||||
|
||||
var _this = this;
|
||||
|
||||
this._normalizePayload(payload, function(item) {
|
||||
if (item.type === 'entity') {
|
||||
json.data.push(item);
|
||||
} else if (item.type === 'property') {
|
||||
// create record if needed, otherwise add to current one
|
||||
var record = store.peekRecord('property', item.id);
|
||||
if (record) {
|
||||
if (record.timestamp !== item.attributes.timestamp) {
|
||||
var length = record.get('history')[0].length;
|
||||
record.get('history')[0].push([length, record.get('value')]);
|
||||
record.set('value', item.attributes.value);
|
||||
}
|
||||
} else {
|
||||
// add new item
|
||||
store.push(item);
|
||||
}
|
||||
_this._updateProperty(item);
|
||||
}
|
||||
|
||||
return true;
|
||||
|
|
@ -31,23 +22,13 @@ export default DS.RESTSerializer.extend({
|
|||
normalizeFindRecordResponse: function(store, primaryModelClass, payload, id, requestType) {
|
||||
var json = { data: {} };
|
||||
|
||||
this._normalizePayload(payload, function(item) {
|
||||
//json.data = item;
|
||||
//return false;
|
||||
var _this = this;
|
||||
|
||||
this._normalizePayload(payload, function(item) {
|
||||
if (item.type === 'entity') {
|
||||
json.data = item;
|
||||
} else if (item.type === 'property') {
|
||||
// create record if needed, otherwise add to current one
|
||||
var record = store.peekRecord('property', item.id);
|
||||
if (record) {
|
||||
var length = record.get('history').length;
|
||||
record.get('history')[0].push([length, record.get('value')]);
|
||||
record.set('value', item.attributes.value);
|
||||
} else {
|
||||
// add new item
|
||||
store.push(item);
|
||||
}
|
||||
_this._updateProperty(item);
|
||||
}
|
||||
|
||||
return true;
|
||||
|
|
@ -59,20 +40,13 @@ export default DS.RESTSerializer.extend({
|
|||
normalizeQueryResponse: function(store, primaryModelClass, payload, id, requestType) {
|
||||
var json = { data: [] };
|
||||
|
||||
var _this = this;
|
||||
|
||||
this._normalizePayload(payload, function(item) {
|
||||
if (item.type === 'entity') {
|
||||
json.data.push(item);
|
||||
} else if (item.type === 'property') {
|
||||
// create record if needed, otherwise add to current one
|
||||
var record = store.peekRecord('property', item.id);
|
||||
if (record) {
|
||||
var length = record.get('history').length;
|
||||
record.get('history')[0].push([length, record.get('value')]);
|
||||
record.set('value', item.attributes.value);
|
||||
} else {
|
||||
// add new item
|
||||
store.push(item);
|
||||
}
|
||||
_this._updateProperty(item);
|
||||
}
|
||||
|
||||
return true;
|
||||
|
|
@ -94,8 +68,7 @@ export default DS.RESTSerializer.extend({
|
|||
type: 'entity',
|
||||
id: item.contextElement.id,
|
||||
attributes: {
|
||||
type: item.contextElement.type//,
|
||||
//properties: []
|
||||
type: item.contextElement.type
|
||||
},
|
||||
relationships: {
|
||||
properties: {
|
||||
|
|
@ -107,6 +80,15 @@ export default DS.RESTSerializer.extend({
|
|||
if (item.contextElement.attributes) {
|
||||
item.contextElement.attributes.forEach(function(attribute) {
|
||||
if (attribute.type !== 'category') {
|
||||
// find timestamp
|
||||
var timestamp = 0;
|
||||
|
||||
attribute.metadatas.forEach(function(metadata) {
|
||||
if (metadata.name === 'timestamp') {
|
||||
timestamp = Date.parse(metadata.value);
|
||||
}
|
||||
});
|
||||
|
||||
// create property
|
||||
var property = {
|
||||
type: 'property',
|
||||
|
|
@ -115,7 +97,9 @@ export default DS.RESTSerializer.extend({
|
|||
name: attribute.name,
|
||||
type: attribute.type,
|
||||
value: attribute.value,
|
||||
history: [[[0, attribute.value]]]
|
||||
timestamp: timestamp,
|
||||
visible: false,
|
||||
history: [[timestamp, attribute.value]]
|
||||
},
|
||||
relationships: {
|
||||
entity: {
|
||||
|
|
@ -124,13 +108,6 @@ export default DS.RESTSerializer.extend({
|
|||
}
|
||||
}
|
||||
|
||||
// find timestamp
|
||||
attribute.metadatas.forEach(function(metadata) {
|
||||
if (metadata.name === 'timestamp') {
|
||||
property.attributes.timestamp = metadata.value;
|
||||
}
|
||||
});
|
||||
|
||||
entity.relationships.properties.data.push({ type: 'property', id: property.id });
|
||||
|
||||
handleItem(property);
|
||||
|
|
@ -161,5 +138,20 @@ export default DS.RESTSerializer.extend({
|
|||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
_updateProperty: function(item) {
|
||||
// create record if needed, otherwise add to current one
|
||||
var record = this.store.peekRecord('property', item.id);
|
||||
if (record) {
|
||||
if (record.timestamp !== item.attributes.timestamp) {
|
||||
record.get('history').push([record.get('timestamp'), record.get('value')]);
|
||||
record.set('value', item.attributes.value);
|
||||
record.set('timestamp', item.attributes.timestamp);
|
||||
}
|
||||
} else {
|
||||
// add new item
|
||||
this.store.push(item);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
|
|
|||
|
|
@ -6,7 +6,6 @@
|
|||
{{#each properties as |property|}}
|
||||
<tr>
|
||||
<td>{{#link-to 'lab-mashup.entity.property' property}}{{property.name}}{{/link-to}}</td>
|
||||
<!--<td>{{property.name}}</td>-->
|
||||
<td>{{property.value}} {{property.type}}</td>
|
||||
<td>{{property.timestamp}}</td>
|
||||
</tr>
|
||||
|
|
|
|||
|
|
@ -17,6 +17,7 @@
|
|||
"Faker": "~3.0.0",
|
||||
"bootstrap": "~3.3.2",
|
||||
"chart.js": "~0.1.0",
|
||||
"flot-charts": "*"
|
||||
"flot-charts": "*",
|
||||
"flot": "*"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -19,5 +19,7 @@ module.exports = function(defaults) {
|
|||
// please specify an object with the list of modules as keys
|
||||
// along with the exports of each module as its value.
|
||||
|
||||
app.import('bower_components/flot/jquery.flot.time.js')
|
||||
|
||||
return app.toTree();
|
||||
};
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue