Mirrors/VILLASweb
1
0
Fork 0
mirror of https://git.rwth-aachen.de/acs/public/villas/web/ synced 2025-03-09 00:00:01 +01:00
Code Issues Releases Wiki Activity

Improve performance

Browse source
This commit is contained in:
Markus Grigull 2015-10-26 12:41:50 -04:00
parent 1105506395
commit e6c842e983
5 changed files with 168 additions and 166 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

17
app/components/d3-alarm.js vendored
View file

@ -45,9 +45,8 @@ export default Ember.Component.extend({
// start blinking
this._blinkState = true;
this._blinking = true;
} else if (litAlarm && this._blinking === true) {
// switch blink state
this._blinkState = !this._blinkState;
Ember.run.later(this, this._updateBlinkState, 1000);
} else if (litAlarm === false && this._blinking === true) {
// stop blinking
this._blinking = false;
@ -70,10 +69,6 @@ export default Ember.Component.extend({
.style("stroke", "#000")
.style("stroke-width", "0.5px");
}
if (this._blinking === true) {
Ember.run.later(this, this._redraw, 500);
}
}.observes('value'),
_shouldLitAlarm: function() {
@ -88,5 +83,13 @@ export default Ember.Component.extend({
}
return false;
},
_updateBlinkState: function() {
if (this._blinking === true) {
this._blinkState = !this._blinkState;
Ember.run.later(this, this._updateBlinkState, 1000);
}
}
});

175
app/components/line-chart.js
View file

@ -3,18 +3,18 @@ import Ember from 'ember';
export default Ember.Component.extend({
tagName: 'div',
classNames: ['line-chart'],
attributeBindings: ['style'],
attributeBindings: ['style'],
xaxisLength: 300,
minValue: '',
maxValue: '',
label: '',
updateTime: 100,
height: '100%',
useLabel: true,
height: '100%',
useLabel: true,
init: function() {
this._super();
this.addObserver('data', this.dataDidChange);
},
didInsertElement: function() {
@ -25,100 +25,91 @@ export default Ember.Component.extend({
}, this.updateTime);
},
dataDidChange: function() {
this._drawPlot();
},
style: function() {
return "height: " + this.get('height') + ";";
}.property('height'),
style: function() {
return "height: " + this.get('height') + ";";
}.property('height'),
_drawPlot: function() {
_drawPlot: function() {
var element = this.get('element');
if (element && element.id) {
if (this.data) {
var values = this.data[0].data;
if (values.length > 0) {
// get first and last time stamp for plot
var firstTimestamp = values[0][0];
var lastTimestamp = values[values.length - 1][0];
var diff = lastTimestamp - firstTimestamp;
var diffValue = this.xaxisLength * 1000;
if (diff > diffValue) {
firstTimestamp = lastTimestamp - diffValue;
} else {
lastTimestamp = +firstTimestamp + +diffValue;
}
// generate plot options
var options = {
series: {
lines: {
show: true,
lineWidth: 2
},
shadowSize: 0
},
xaxis: {
mode: 'time',
timeformat: '%M:%S',
min: firstTimestamp,
max: lastTimestamp
},
yaxis: {
tickDecimals: 2
}
}
// set y axis scale
if (this.data.get('minValue')) {
options.yaxis.min = this.data.get('minValue');
} else if (this.get('minValue') !== '') {
options.yaxis.min = this.get('minValue');
}
if (this.data.get('maxValue')) {
options.yaxis.max = this.data.get('maxValue');
} else if (this.get('maxValue') !== '') {
options.yaxis.max = this.get('maxValue');
}
var values = this.data[0].data;
// setup plot data
var plotData = {
data: values,
color: "rgb(51, 153, 255)"
}
if (this.get('useLabel')) {
if (this.get('label') !== '') {
plotData.label = this.get('label');
} else {
plotData.label = this.data.get('name') + " [" + this.data.get('type') + "]";
}
}
if (values.length > 0) {
// get first and last time stamp for plot
var firstTimestamp = values[0][0];
var lastTimestamp = values[values.length - 1][0];
var diff = lastTimestamp - firstTimestamp;
var diffValue = this.xaxisLength * 1000;
if (diff > diffValue) {
firstTimestamp = lastTimestamp - diffValue;
} else {
lastTimestamp = +firstTimestamp + +diffValue;
}
// generate plot options
var options = {
series: {
lines: {
show: true,
lineWidth: 2
},
shadowSize: 0
},
xaxis: {
mode: 'time',
timeformat: '%M:%S',
min: firstTimestamp,
max: lastTimestamp
},
yaxis: {
tickDecimals: 2
}
};
// set y axis scale
if (this.data.get('minValue')) {
options.yaxis.min = this.data.get('minValue');
} else if (this.get('minValue') !== '') {
options.yaxis.min = this.get('minValue');
}
if (this.data.get('maxValue')) {
options.yaxis.max = this.data.get('maxValue');
} else if (this.get('maxValue') !== '') {
options.yaxis.max = this.get('maxValue');
}
// draw plot
$.plot('#' + element.id, this.data, options);
} else {
// display empty chart
$.plot('#' + element.id, [[]], {
xaxis: {
show: false
},
yaxis: {
show: false
}
});
}
// setup plot data
var plotData = {
data: values,
color: "rgb(51, 153, 255)"
};
if (this.get('useLabel')) {
if (this.get('label') !== '') {
plotData.label = this.get('label');
} else {
plotData.label = this.data.get('name') + " [" + this.data.get('type') + "]";
}
}
// draw plot
$.plot('#' + element.id, this.data, options);
} else {
// display empty chart
$.plot('#' + element.id, [[]], {
xaxis: {
show: false
},
yaxis: {
show: false
}
});
}
}
}
// try again
Ember.run.later(this, function() {
this._drawPlot();
}, this.updateTime);
}
}.observes('data')
});

130
app/controllers/lab-mashup.js
View file

@ -6,68 +6,11 @@ export default Ember.Controller.extend({
freq575AlarmZones: [{from: 49, to: 49.5}, {from: 50.5, to: 51}],
freq575Value: 0,
voltage203937: [],
loadGenProfiles: [],
_waitForStateUpdate: false,
init: function() {
this.set('state', 1);
Ember.run.later(this, this._updateState, 100);
},
S1Entity: function() {
return this.model.findBy('id', 'S1_ElectricalGrid');
}.property('model.[]'),
Voltage203937: function() {
var entity = this.model.findBy('id', 'S1_ElectricalGrid');
if (entity) {
return [
{
label: 'RMS voltage [pu]',
data: entity.get('properties').findBy('name', 'Voltage203937').get('values'),
color: "rgb(51, 153, 255)"
}
];
} else {
return {};
}
}.property('model.[]'),
Freq575Observer: function() {
Ember.run.later(this, this.Freq575Observer, 100);
if (this.model) {
var entity = this.model.findBy('id', 'S1_ElectricalGrid');
if (entity) {
var attribute = entity.get('properties').findBy('name', 'Freq_575');
this.set('freq575Value', attribute.get('currentValue'));
}
}
}.on('init'),
LoadGenProfiles: function() {
var entity = this.model.findBy('id', 'S1_ElectricalGrid');
if (entity) {
return [
{
label: 'Total consumption [MW]',
data: entity.get('properties').findBy('name', 'LoadProfile').get('values'),
color: "rgb(51, 153, 255)"
},
{
label: 'Total PV generation [MW]',
data: entity.get('properties').findBy('name', 'GenProfile').get('values'),
color: "rgb(255, 91, 51)"
}
];
} else {
return [];
}
}.property('model.[]'),
initState: function() {
return this.get('state') === 1;
}.property('state'),
@ -76,7 +19,11 @@ export default Ember.Controller.extend({
return this.get('state') === 2;
}.property('state'),
_updateState: function() {
_updateController: function() {
// update attribute values
this._updateAttributes();
// get new data file control state from store
var control = this.store.peekRecord('data-file-control', 'DataFileControl');
var updated = false;
@ -104,7 +51,68 @@ export default Ember.Controller.extend({
control.save();
}
Ember.run.later(this, this._updateState, 100);
Ember.run.later(this, this._updateController, 100);
}.on('init'),
_updateAttributes: function() {
// check for model and properties
if (!this.model) {
Ember.debug('controller model not found');
return false;
}
var entity = this.model.findBy('id', 'S3_ElectricalGrid');
if (!entity) {
Ember.debug('controller entity S3 not found');
return false;
}
var properties = entity.get('properties');
if (!properties) {
return false;
}
// update attributes
var attr_freq575 = properties.findBy('name', 'Freq_575');
if (attr_freq575) {
Ember.debug('controller freq575 not found');
this.set('freq575Value', attr_freq575.get('currentValue'));
}
var attr_voltage203937 = properties.findBy('name', 'Voltage203937');
if (attr_voltage203937) {
this.set('voltage203937', [
{
label: 'RMS voltage [pu]',
data: attr_voltage203937.get('values'),
color: 'rgb(51, 153, 255)'
}
]);
} else {
Ember.debug('controller voltage203937 not found');
}
var attr_loadProfile = properties.findBy('name', 'LoadProfile');
var attr_genProfile = properties.findBy('name', 'GenProfile');
if (attr_loadProfile && attr_genProfile) {
this.set('loadGenProfile', [
{
label: 'Total consumption [MW]',
data: attr_loadProfile.get('values'),
color: "rgb(51, 153, 255)"
},
{
label: 'Total PV generation [MW]',
data: attr_genProfile.get('values'),
color: "rgb(255, 91, 51)"
}
]);
} else {
Ember.debug('controller loadGenProfile not found');
}
return true;
},
_updateDataFileControl: function(state) {

8
app/routes/lab-mashup.js
View file

@ -4,9 +4,9 @@ export default Ember.Route.extend({
model() {
return this.store.query('entity', { entities: [
{
id: 'S1_ElectricalGrid',
id: 'S3_ElectricalGrid',
isPattern: false,
type: ''
type: 'ElectricalGridMonitoring'
},
{
id: 'DataFileControl',
@ -28,9 +28,9 @@ export default Ember.Route.extend({
// fetch new data from server
this.store.query('entity', { entities: [
{
id: 'S1_ElectricalGrid',
id: 'S3_ElectricalGrid',
isPattern: false,
type: ''
type: 'ElectricalGridMonitoring'
},
{
id: 'DataFileControl',

4
app/templates/lab-mashup.hbs
View file

@ -72,7 +72,7 @@
Distribution grid monitoring voltage measurement
</h3>
{{line-chart data=Voltage203937 height="90%" xaxisLength=120 minValue=0.90 maxValue=1.05 label="RMS voltage [pu]"}}
{{line-chart data=voltage203937 height="90%" xaxisLength=120 minValue=0.90 maxValue=1.05 label="RMS voltage [pu]"}}
</td>
<td style="width: 50%" colspan="2">
<div style="position: relative; top: 15%; left: 30%">
@ -146,7 +146,7 @@
Prosumer: Consumption and generation profiles
</h3>
{{line-chart data=LoadGenProfiles height="90%" minValue=0 maxValue=25 xaxisLength=120}}
{{line-chart data=loadGenProfiles height="90%" minValue=0 maxValue=25 xaxisLength=120}}
</td>
<td style="width: 50%;" colspan="2">
{{#if initState}}