diff --git a/src/main/angular/src/app/api/series/Value.ts b/src/main/angular/src/app/api/series/Value.ts
index 78118f6..8de4e7a 100644
--- a/src/main/angular/src/app/api/series/Value.ts
+++ b/src/main/angular/src/app/api/series/Value.ts
@@ -1,6 +1,6 @@
 import {IValue} from "./IValue";
 
-type GetValue = (v: number) => number;
+type GetValue = (v: number) => number | null;
 
 type CombineValue = (a: number, b: number) => number;
 
diff --git a/src/main/angular/src/app/pages/dashboard/dashboard.component.ts b/src/main/angular/src/app/pages/dashboard/dashboard.component.ts
index 5c7097d..89dbd7f 100644
--- a/src/main/angular/src/app/pages/dashboard/dashboard.component.ts
+++ b/src/main/angular/src/app/pages/dashboard/dashboard.component.ts
@@ -66,21 +66,18 @@ export class DashboardComponent implements OnInit {
   getElectricitySeries(): DisplayOrSeparator[] {
     const consumptionPower = Value.positiveOnly(Value.plus(this.photovoltaicPower, this.gridPower));
     const selfConsumed = Value.map(this.photovoltaicProduced, producedTotal => {
+      if (this.gridDelivered === null || this.gridDelivered.value === null) {
+        return null;
+      }
       const producedAfterChange = producedTotal - PRODUCED_UNTIL_METER_CHANGE;
-      const deliveredAfterChange = this.gridDelivered?.value || 0;
+      const deliveredAfterChange = this.gridDelivered?.value;
       const selfAfterChange = producedAfterChange - deliveredAfterChange;
       const selfRatio = selfAfterChange / producedAfterChange;
       return selfRatio * producedTotal;
     });
 
-    const deliveringAny = (this.gridPower?.value || 0) < 0;
-    const purchasingAny = (this.gridPower?.value || 0) > 0;
-    const purchasingMuch = (this.gridPower?.value || 0) > PURCHASING_MUCH;
-    const producingAny = (this.photovoltaicPower?.value || 0) > 0;
-
-    const gridColor = deliveringAny ? 'magenta' : (purchasingMuch ? 'red' : (purchasingAny ? 'orange' : 'green'));
-    const productionColor = producingAny ? 'green' : 'black';
-
+    const gridColor = this.getGridPowerColor();
+    const productionColor = this.getProductionPowerColor();
     return [
       new Display('Bezug', '', this.gridPurchased),
       new Display('Einspeisung', '', this.gridDelivered),
@@ -94,4 +91,39 @@ export class DashboardComponent implements OnInit {
     ];
   }
 
+  private getGridPowerColor(): string {
+    if (this.gridPower !== null && this.gridPower.value !== null) {
+      const deliveringAny = this.gridPower.value < 0;
+      if (deliveringAny) {
+        return 'magenta';
+      }
+
+      const purchasingMuch = this.gridPower.value > PURCHASING_MUCH;
+      if (purchasingMuch) {
+        return 'red';
+      }
+
+      const purchasingAny = this.gridPower.value > 0;
+      if (purchasingAny) {
+        return 'orange';
+      }
+
+      return 'green';
+    }
+    return '';
+  }
+
+  private getProductionPowerColor() {
+    if (this.photovoltaicPower === null || this.photovoltaicPower.value === null) {
+      return '';
+    }
+
+    const producingAny = this.photovoltaicPower.value > 0;
+    if (producingAny) {
+      return 'green';
+    }
+
+    return 'black';
+  }
+
 }