In diesem Artikel wird beschrieben, wie du Visualiserungs-Widgets wie dynamischen Tarif oder die Verbrauchsvisualisierung im Portal einrichtest. Das Beispiel basiert auf einer vereinfachten Integration mit dynamischen Verbrauchsquellen und kommt ohne Marketplace-Partner aus.

1. Einrichtung eines dynamischen Tarifs

Bevor du startest, stelle sicher, dass folgende Voraussetzungen erfüllt sind:

• Es existiert ein Vertrag im System
• Der Vertrag ist mit einem Zähler verknüpft
• Der Zähler ist als Smart Meter konfiguriert
• Du hast Zugriff auf den Portal Builder

Nur Verträge mit einem Smart Meter können dynamische Tarifinformationen anzeigen.

Schritt 1: Dynamic-Consumption-App installieren

Eine App für dynamischen Verbrauch, die nicht im Marketplace verfügbar ist, kann direkt über eine URL installiert werden.

1. Öffne die bereitgestellte App-URL in deinem Browser.
2. Installiere die App.

Es ist keine weitere Konfiguration erforderlich. Nach der Installation ist die App sofort einsatzbereit.

Schritt 2: Installation der Erweiterung prüfen

• Öffne im Portal unter Einstellungen/Erweiterungen (oben rechts) die Übersicht der Erweiterungen.
• Prüfe, ob die von dir installierte Anwendung als aktive Erweiterung angezeigt wird.

Damit stellst du sicher, dass die benötigte Datenquelle für dynamische Tarife verfügbar ist.
 

Schritt 3: Portalseite vorbereiten

• Öffne den Portal Builder.
• Wähle eine bestehende Seite aus oder erstelle eine neue Seite.
• Füge den Block „Entity Selector“ (Vertragsauswahl) hinzu.

Der Vertragsselektor ist notwendig, damit Portalnutzer einen Vertrag auswählen können.
 

Schritt 4: Geeigneten Vertrag verwenden

Achte bei der Auswahl des Vertrags darauf, dass folgende Bedingungen erfüllt sind:

• Der Vertrag ist mit einem Zähler verknüpft
• Der Zähler ist als Smart Meter gekennzeichnet

Nur wenn diese Voraussetzungen erfüllt sind, kann der dynamische Tarif im Portal angezeigt werden.
 

Schritt 5: Block „Dynamischer Tarif“ hinzufügen

1. Füge auf derselben Seite den Block „Dynamischer Tarif“ hinzu.
2. Wähle in der Blockkonfiguration den dynamischen Tarif aus.
3. Optional kannst du einen Titel und Untertitel für den Block vergeben.

Der Block nutzt automatisch den ausgewählten Vertrag und den zugehörigen Smart Meter.

Schritt 6: Anzeige im Portal prüfen

• Öffne das Portal in der Nutzeransicht.
• Wähle über den Vertragsselektor einen Vertrag mit Smart Meter aus.
• Prüfe, ob die dynamischen Tarifinformationen angezeigt werden.

Nach Abschluss dieser Schritte können dynamischer Verbrauch, Preise und Kosten im Portal angezeigt werden ohne zusätzliche Konfiguration. 
Wird ein Vertrag ohne Smart Meter ausgewählt, erscheint der Block nicht im Portal.

 

2. Einrichtung einer Verbrauchsvisualisierung

 Im Unterschied zum dynamischen Tarif, der nur auf Basis eines Smart Meters funktioniert, kann das Widget “Verbrauchsvisualisierung” für jegliche Art von Zähler bzw Verträgen genutzt werden. Stelle jedoch auch hier sicher, dass 

• ein Vertrag im System existiert und
• der Vertrag mit einem Zähler verknüpft ist

Folge sodann zur Einrichtung einer Verbrauchsvisualisierung zunächst den exakt gleichen, oben beschriebenen Schritten von 1 bis 4.

Schritt 5: Block „Verbrauchsvisualisierung“ hinzufügen

1. Füge auf der gewünschten Seite den Block „Verbrauchsvisualisierung“ hinzu.
2. Wähle in der Blockkonfiguration einen beliebigen Tarif aus.
3. Optional kannst du einen Titel und Untertitel für den Block vergeben.

Der Block nutzt automatisch den ausgewählten Vertrag und den zugehörigen Zähler.
 

Schritt 6: Anzeige im Portal prüfen

• Öffne das Portal in der Nutzeransicht.
• Wähle über den Vertragsselektor einen Vertrag beliebigen aus.
• Prüfe, ob die dynamischen Tarifinformationen angezeigt werden.

Nach Abschluss dieser Schritte können Verbrauchsvisualisierungen per Uhrzeit angezeigt und über das Kalender-Icon weiteren Zeiträumen wie Wochen, Monaten und Jahren angepasst werden.  
 

3. Einrichtung einer Verbrauchsvisualisierung

Falls du einen Marketplace Partner hast und eine Integration bauen möchtest, haben wir das umfangreich dokumentiert. Schaue dir dazu bitte folgende Dokumentation an: Portal Extension