percentages

This commit is contained in:
Patrick Haßel 2025-11-11 10:44:00 +01:00
parent 810dc77b24
commit 4feb38c14c
7 changed files with 134 additions and 8 deletions

View File

@ -4,6 +4,20 @@ import {Value} from '../series/Value';
export class Location {
powerSelf: Value = Value.NULL;
powerPurchasePercentConsume: Value = Value.NULL;
powerProducePercentConsume: Value = Value.NULL;
powerDeliveryPercentConsume: Value = Value.NULL;
powerDeliveryPercentProduce: Value = Value.NULL;
powerSelfPercentConsume: Value = Value.NULL;
powerSelfPercentProduce: Value = Value.NULL;
constructor(
readonly id: number,
readonly name: string,
@ -46,6 +60,13 @@ export class Location {
private updateConsume() {
this._powerConsume = Value.ZERO.plus(this._powerPurchase?.value, true).plus(this._powerProduce?.value, true).minus(this._powerDeliver?.value, true);
this.powerSelf = Value.ZERO.plus(this.powerProduce?.value.minus(this.powerDeliver?.value, true), true);
this.powerPurchasePercentConsume = Value.ZERO.plus(this.powerPurchase?.value.percent(this.powerConsume, "%", 0), true);
this.powerProducePercentConsume = Value.ZERO.plus(this.powerProduce?.value.percent(this.powerConsume, "%", 0), true);
this.powerDeliveryPercentConsume = Value.ZERO.plus(this.powerDeliver?.value.percent(this.powerConsume, "%", 0), true);
this.powerDeliveryPercentProduce = Value.ZERO.plus(this.powerDeliver?.value.percent(this.powerProduce?.value, "%", 0), true);
this.powerSelfPercentConsume = Value.ZERO.plus(this.powerSelf.percent(this.powerConsume, "%", 0), true);
this.powerSelfPercentProduce = Value.ZERO.plus(this.powerSelf.percent(this.powerProduce?.value, "%", 0), true);
}
static fromJson(json: any): Location {

View File

@ -14,6 +14,10 @@
<div class="SectionBody COLOR_FONT_PURCHASE">
{{ purchase.toValueString(null) }}
</div>
<div class="SectionBody COLOR_FONT_PURCHASE percent">
{{ purchasePercentConsume.toValueString(null) }}
<sub class="subscript">Verbrauch</sub>
</div>
</div>
<div class="Section4">
@ -23,6 +27,27 @@
<div class="SectionBody COLOR_FONT_PRODUCE">
{{ produce.toValueString(null) }}
</div>
<div class="SectionBody COLOR_FONT_PRODUCE percent">
{{ producePercentConsume.toValueString(null) }}
<sub class="subscript">Verbrauch</sub>
</div>
</div>
<div class="Section4">
<div class="SectionHeadingText">
Selbst
</div>
<div class="SectionBody COLOR_FONT_SELF">
{{ self.toValueString(null) }}
</div>
<div class="SectionBody COLOR_FONT_SELF percent">
{{ selfPercentConsume.toValueString(null) }}
<sub class="subscript">Verbrauch</sub>
</div>
<div class="SectionBody COLOR_FONT_SELF percent">
{{ selfPercentProduce.toValueString(null) }}
<sub class="subscript">Produktion</sub>
</div>
</div>
<div class="Section4">
@ -41,6 +66,14 @@
<div class="SectionBody COLOR_FONT_DELIVER">
{{ deliver.toValueString(null) }}
</div>
<div class="SectionBody COLOR_FONT_DELIVER percent">
{{ deliveryPercentConsume.toValueString(null) }}
<sub class="subscript">Verbrauch</sub>
</div>
<div class="SectionBody COLOR_FONT_DELIVER percent">
{{ deliveryPercentProduce.toValueString(null) }}
<sub class="subscript">Produktion</sub>
</div>
</div>
</div>

View File

@ -31,6 +31,20 @@ export class LocationEnergy implements OnInit, AfterViewInit, OnDestroy {
protected consume: Value = Value.NULL;
protected self: Value = Value.NULL;
protected purchasePercentConsume: Value = Value.NULL;
protected producePercentConsume: Value = Value.NULL;
protected deliveryPercentConsume: Value = Value.NULL;
protected deliveryPercentProduce: Value = Value.NULL;
protected selfPercentConsume: Value = Value.NULL;
protected selfPercentProduce: Value = Value.NULL;
@Input()
heading!: string;
@ -89,6 +103,13 @@ export class LocationEnergy implements OnInit, AfterViewInit, OnDestroy {
const callNextAndUpdateConsume = (value: Value) => {
next(value);
this.consume = this.purchase.plus(this.produce, true).minus(this.deliver, true);
this.self = this.produce.minus(this.deliver, true);
this.purchasePercentConsume = this.purchase.percent(this.consume, "%", 0);
this.producePercentConsume = this.produce.percent(this.consume, "%", 0);
this.deliveryPercentConsume = this.deliver.percent(this.consume, "%", 0);
this.deliveryPercentProduce = this.deliver.percent(this.produce, "%", 0);
this.selfPercentConsume = this.self.percent(this.consume, "%", 0);
this.selfPercentProduce = this.self.percent(this.produce, "%", 0);
};
if (fresh !== null && fresh !== undefined) {
if (fresh.id !== series?.id) {

View File

@ -13,6 +13,10 @@
<div class="SectionBody COLOR_FONT_PURCHASE">
{{ location.powerPurchase?.value?.toValueString(dateService.now) }}
</div>
<div class="SectionBody COLOR_FONT_PURCHASE percent">
{{ location.powerPurchasePercentConsume.toValueString(dateService.now) }}
<sub class="subscript">Verbrauch</sub>
</div>
</div>
<div class="Section4">
@ -22,6 +26,27 @@
<div class="SectionBody COLOR_FONT_PRODUCE">
{{ location.powerProduce?.value?.toValueString(dateService.now) }}
</div>
<div class="SectionBody COLOR_FONT_PRODUCE percent">
{{ location.powerProducePercentConsume.toValueString(dateService.now) }}
<sub class="subscript">Verbrauch</sub>
</div>
</div>
<div class="Section4">
<div class="SectionHeadingText">
Selbst
</div>
<div class="SectionBody COLOR_FONT_SELF">
{{ location.powerSelf?.toValueString(dateService.now) }}
</div>
<div class="SectionBody COLOR_FONT_SELF percent">
{{ location.powerSelfPercentConsume.toValueString(dateService.now) }}
<sub class="subscript">Verbrauch</sub>
</div>
<div class="SectionBody COLOR_FONT_SELF percent">
{{ location.powerSelfPercentProduce.toValueString(dateService.now) }}
<sub class="subscript">Produktion</sub>
</div>
</div>
<div class="Section4">
@ -40,6 +65,14 @@
<div class="SectionBody COLOR_FONT_DELIVER">
{{ location.powerDeliver?.value?.toValueString(dateService.now) }}
</div>
<div class="SectionBody COLOR_FONT_DELIVER percent">
{{ location.powerDeliveryPercentConsume.toValueString(dateService.now) }}
<sub class="subscript">Verbrauch</sub>
</div>
<div class="SectionBody COLOR_FONT_DELIVER percent">
{{ location.powerDeliveryPercentProduce.toValueString(dateService.now) }}
<sub class="subscript">Produktion</sub>
</div>
</div>
</div>

View File

@ -83,11 +83,11 @@ export class Value {
return ageSeconds > this.seconds * 2.1;
}
onlyPositive(): Value {
if (this.value < 0) {
return Value.ZERO;
percent(other: Value | null | undefined, unit: string | null = null, precision: number | null = null): Value {
if (other === null || other === undefined) {
return Value.NULL;
}
return this;
return new BiValue(this, other, (a, b) => a / b * 100, unit, precision);
}
}
@ -98,12 +98,18 @@ export class BiValue extends Value {
readonly a: Value,
readonly b: Value,
readonly operation: (a: number, b: number) => number,
unit: string | null = null,
precision: number | null = null,
) {
if (a.unit !== "" && b.unit !== "" && a.unit !== b.unit) {
throw new Error(`Operation needs units to be equal or empty: this=${a}, other=${b}`);
}
const precision = Math.max(a.precision, b.precision);
const unit = a.unit || b.unit;
if (precision === null) {
precision = Math.max(a.precision, b.precision);
}
if (unit === null) {
unit = a.unit || b.unit;
}
const date = a.date.getTime() < b.date.getTime() ? a.date : b.date;
super(operation(a.value, b.value), precision, 0, unit, date);
}

View File

@ -3,7 +3,7 @@
@COLOR_FONT_PURCHASE: red;
@COLOR_FONT_DELIVER: magenta;
@COLOR_FONT_PRODUCE: #0095ff;
@COLOR_FONT_SELF: #0095ff;
@COLOR_FONT_SELF: #00b34a;
@COLOR_FONT_CONSUME: #ff8800;
@COLOR_BACK_PURCHASE: #ffa7a7;
@ -28,6 +28,10 @@
color: @COLOR_FONT_SELF;
}
.COLOR_FONT_SELF {
color: @COLOR_FONT_SELF;
}
.COLOR_FONT_CONSUME {
color: @COLOR_FONT_CONSUME;
}

View File

@ -3,7 +3,7 @@ body {
height: 100%;
margin: 0;
font-family: sans-serif;
font-size: 4vw;
font-size: 3.5vw;
user-select: none;
}
@ -99,3 +99,11 @@ div {
}
}
.percent {
font-size: 70%;
.subscript {
font-size: 60%;
}
}