mirror of
https://git.rwth-aachen.de/acs/public/villas/web/
synced 2025-03-09 00:00:01 +01:00
Add fixed axis length to charts
Fix now really switching entities when chart was shown
This commit is contained in:
parent
14e29f91cc
commit
453638477e
3 changed files with 43 additions and 16 deletions
|
@ -3,6 +3,7 @@ import Ember from 'ember';
|
|||
export default Ember.Component.extend({
|
||||
tagName: 'div',
|
||||
classNames: ['line-chart'],
|
||||
xaxisLength: 30,
|
||||
|
||||
init: function() {
|
||||
this._super();
|
||||
|
@ -22,13 +23,29 @@ export default Ember.Component.extend({
|
|||
},
|
||||
|
||||
_drawPlot: function() {
|
||||
var elementId = this.get('elementId');
|
||||
if (elementId) {
|
||||
$.plot('#' + elementId, this.data);
|
||||
}
|
||||
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;
|
||||
|
||||
Ember.run.later(this, function() {
|
||||
this._drawPlot();
|
||||
}, 500);
|
||||
if (length > this.xaxisLength) {
|
||||
startIndex = length - this.xaxisLength;
|
||||
endIndex = length;
|
||||
}
|
||||
|
||||
// display the chart
|
||||
$.plot('#' + element.id, this.data, {
|
||||
xaxis: {
|
||||
min: startIndex,
|
||||
max: endIndex
|
||||
},
|
||||
});
|
||||
|
||||
Ember.run.later(this, function() {
|
||||
this._drawPlot();
|
||||
}, 500);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
|
|
@ -11,9 +11,11 @@ export default DS.RESTSerializer.extend({
|
|||
// create record if needed, otherwise add to current one
|
||||
var record = store.peekRecord('property', item.id);
|
||||
if (record) {
|
||||
var length = record.get('history')[0].length;
|
||||
record.get('history')[0].push([length, record.get('value')]);
|
||||
record.set('value', item.attributes.value);
|
||||
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);
|
||||
|
|
|
@ -82,11 +82,19 @@ footer {
|
|||
}
|
||||
|
||||
#properties > .layout-left {
|
||||
width: 30%;
|
||||
width: 25%;
|
||||
}
|
||||
|
||||
#properties > .layout-right {
|
||||
width: 70%;
|
||||
width: 75%;
|
||||
}
|
||||
|
||||
#main > .layout-left {
|
||||
width: 40%;
|
||||
}
|
||||
|
||||
#main > .layout-right {
|
||||
width: 60%;
|
||||
}
|
||||
|
||||
.data-table {
|
||||
|
@ -125,15 +133,15 @@ footer {
|
|||
}
|
||||
|
||||
.line-chart {
|
||||
width: 500px;
|
||||
height: 300px;
|
||||
width: 100%;
|
||||
height: 500px;
|
||||
|
||||
margin: 10px;
|
||||
}
|
||||
|
||||
.mockup-image {
|
||||
width: 600px;
|
||||
height: 400px;
|
||||
width: 100%;
|
||||
height: 75%;
|
||||
|
||||
border: 1px solid black;
|
||||
|
||||
|
|
Loading…
Add table
Reference in a new issue