diff --git a/Projektarbeit-3/Umsetzung.md b/Projektarbeit-3/Umsetzung.md
index 5867d10..609fc47 100644
--- a/Projektarbeit-3/Umsetzung.md
+++ b/Projektarbeit-3/Umsetzung.md
@@ -64,7 +64,7 @@ graph LR
TYPING --> INSERT[in Datenbank schreiben]
```
-Der Vorgang geschieht komplett im Arbeitsspeicher, was die maximale Lesegeschwindigkeit ermöglicht. Der Import dauert von 0 bis 100 % etwa 60 Minuten und verbraucht 6 Gigabyte Festplattenspeicher, sowie Netzwerktraffic. **Insgesamt werden etwa 60 Millionen Datensätze für über 800 Bikestations geladen!**
+Der Vorgang geschieht komplett im Arbeitsspeicher, was die maximale Lesegeschwindigkeit ermöglicht. Der Import dauert von 0 bis 100 % etwa 60 Minuten und verbraucht 6 Gigabyte Festplattenspeicher, sowie Netzwerktraffic. **Insgesamt werden etwa 60 Millionen Datensätze für über 800 Bikestationen geladen!**
Der wichtigste Teil, der Importer der "usage-stats", ist hier Ausschnittsweise abgebildet.
```python
@@ -222,7 +222,7 @@ Schauen wir uns im Weiteren die Methoden genauer an:
```typscript
this.map = L.map('map').setView([lat, lon], zoom);
```
-Wie bereits in der Vorgehensweise erläutert wird zuerst das Map-Objekt mit `L.map('map)` initialisiert.
+Wie bereits in der Vorgehensweise erläutert wird zuerst das Map-Objekt mit `L.map('map')` initialisiert.
```typescript
this.map.addLayer(new L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
@@ -425,13 +425,40 @@ Wie bereits in Kapitel 2 Vorgehensweise erläutert ist die MapComponent nur die
Wie in der Grafik angedeutet, gibt die MapComponent dem Service lediglich Map-Optionen, wie z.B. Lat und Lon Koordinaten für die Zentrierung oder den initialen Zoom. Der MapService wiederum generiert das Pop-up und gibt der Komponente alle nötigen Layer.
#### Pop-up
-Der Inhalt der PopUpComponent ist durch eine [Material Card](https://material.angular.io/components/card/examples) abgebildet.
+Der Inhalt der PopUpComponent ist durch eine [Material Card](https://material.angular.io/components/card/examples) abgebildet. Als Titel ist der Name der Station zu sehen und als Body haben wir ein Bar Chart gewählt, welches anschaulich die noch verfügbaren Fahrräder in dieser Station visualisieren soll. Alle Charts wurden mit [Apex Charts](https://apexcharts.com/angular-chart-demos/) implementiert.
+
+Um nun ein Chart in einer Angular Komponente zu verwenden werden sogenannte ChartOptions benötigt. Das sind Optionen, die später in den HTML-Direktiven genutzt werden, um das Chart nach unseren Wünschen zu modellieren. In der `ngOnInit()` werden dann die ChartOptions gefüllt.
+
+Wir gehen in der Dokumentation nur auf die Series ein. Also auf die Datensätze, die das Chart füllen. Andere Optionen sind relativ selbsterklärend. Das Chart für die Visualisierung der Verfügbarkeit von Fahrrädern benötigt folgende Datensätze:
+
```typescript
-
- {{station?.commonName}}
-
+this.chartOptions = {
+ series: [
+ {
+ name: 'Bikes',
+ data: [this.station.status.NbBikes]
+ },
+ {
+ name: 'Empty docks',
+ data: [this.station.status.NbEmptyDocks]
+ },
+ {
+ name: 'Blocked docks',
+ data: [NbBlockedDocks]
+ }
+ ],
+...
```
+Die Anzahl der Fahrräder als auch die leeren Docks beziehen wir direkt aus dem Stationsobjekt. Die gesperrten Docks ergeben sich durch Verrechnen der einzelnen Parameter.
+```typescript
+const NbBlockedDocks = this.station.status.NbDocks - this.station.status.NbBikes - this.station.status.NbEmptyDocks;
+```
+
+
+