<!-- /docs/components/main/analogInputs/AnalogInputsChart.md -->

# 📈 AnalogInputsChart

Die Komponente `AnalogInputsChart` zeigt den Verlauf der Messwerte für einen ausgewählten analogen Eingang an. Sie nutzt `react-chartjs-2` mit `chart.js` (inkl. TimeScale).

---

## ⚙️ Funktion

- Ruft über `Redux Thunk` die Historie der analogen Eingänge ab
- Zeigt eine Liniendiagramm-Kurve mit Zeit auf der X-Achse und Messwerten auf der Y-Achse
- Berücksichtigt die Auswahl des Messwerteingangs (`selectedId`)

---

### Verhalten:

- Wenn `true`: Nutzer kann in das Zeitfenster hineinzoomen und sich bewegen (pan).
- Wenn `false`: Chart ist statisch und nur lesbar.

### Technisch:

- `chartjs-plugin-zoom` wird **dynamisch nur im Browser** geladen
- Die Optionen für `zoom` und `pan` werden nur gesetzt, wenn das Flag aktiv ist

---

## 📦 Technologien

- `react-chartjs-2`
- `chart.js` mit `TimeScale`
- `chartjs-plugin-zoom` (lazy import)
- `redux` & `thunks` für Daten
- `date-fns` mit deutscher Lokalisierung

---

## 🔍 Hinweise

- Der Messwert-Key wird berechnet als `selectedId + 99`, da Backend-Daten mit Key `99`, `100`, usw. zurückkommen.
- Wenn keine Daten vorhanden sind, wird ein entsprechender Hinweis angezeigt.
- Farbschema nutzt `getColor("littwin-blue")` aus den Projektfarben.
