Embedding mit disy Cadenza:
Webseiten und Fachanwendungen um Analysen, Berichte und Funktionalitäten erweitern
Sehen Sie in diesem Beitrag, wie Embedding mit disy Cadenza in der Praxis aussehen kann. Es erwarten Sie interessante Anwendungsfälle sowie Informationen zur einfachen Konfiguration.
Unter Embedding verstehen wir die Integration von Filter-, Berichts-, Analyse- und GIS-Funktionen von disy Cadenza im Ganzen oder in Teilen in andere Anwendungen oder umgekehrt die direkte Einbindung externer Fachanwendungsfunktionalität in disy Cadenza.
In unserem Beitrag „Embedding: Drei Möglichkeiten Inhalte einzubetten und zu nutzen“ beleuchten wir die drei generellen Embedding-Möglichkeiten sowie ihre individuellen Vorteile grundlegend.
Darauf aufbauend werden in den folgenden Abschnitten die Embedding-Optionen genauer betrachtet. Dabei liegt der Fokus auf Praxisbeispielen aus dem Kontext Windkraftanlagenbau.
Inhalte aus disy Cadenza in Portale einbetten
Ein interaktives Dashboard mit allen relevanten Kennzahlen im Überblick auf einer Website und ein paar Mouse-Scrolls später eine dazu passende interaktive Karte. So kann die Einbettung in Portale in der Praxis aussehen. Bei dieser Variante werden Karten, Tabellen, Diagramme oder ganze Dashboards in der Arbeitsmappe von disy Cadenza zur Einbettung konfiguriert. Die Einbindung findet über die Cadenza Embedding API in einer externen Webseite statt.
Inhalte aus disy Cadenza in Portale einbetten
Auf der externen Website werden so die Daten immer aktuell gehalten. Zusätzlich können Nutzer:innen mit den eingebundenen Inhalten interagieren, beispielsweise über das Setzen von Filtern oder das Einsehen der Objektinformation in Karten. Solche Interaktionsmöglichkeiten können aber explizit eingeschränkt werden – je nachdem, welche Rolle die eingebetteten Inhalte auf der Website einnehmen sollen. Außerdem sind auch direkte Downloads möglich, z. B. von CSV- oder PDF-Dateien.
Die Technologie zur Erstellung der Rahmenseite, bzw. -anwendung kann frei gewählt werden. Typo3, Wordpress und Joomla! sind nur einige davon.
Fiktives Beispiel | Inhalte aus disy Cadenza in Portale einbetten: Ich als Bürger:in möchte mich auf der Webseite der Umweltagentur über Windkraftanlagen in meiner Nähe informieren.
Auf der Webseite der Umweltagentur ist ein Dashboard von disy Cadenza eingebunden. In diesem kann ich explizit auf Bundesländer filtern, diese vergleichen oder auch in der Karte in die Stellen hinein-zoomen, die mich interessieren.
Wenn ich in der Karte weit hinein-zoome, sehe ich alle Potenzialflächen für Windkraftanlagen. Bei Klick auf eine solche Potenzialfläche werden mir in der Objektinformation weitere Details dazu angezeigt.
Genau dieses Dashboard wurde in einer disy Cadenza-Installation vorbereitet. Nachträgliche Anpassungen können dort vorgenommen werden. Die Konfiguration und das Einbinden in die Website sind dabei ein Kinderspiel. Dazu später mehr im Abschnitt „Wie bette ich Inhalte mithilfe von disy Cadenza ein?“.
disy Cadenza-Funktionalitäten aus einer Fachanwendung aufrufen
Wie bei der Einbettung von Inhalten in Portale werden auch in diesem Fall Karten, Tabellen, Diagramme oder auch ganze Dashboards in einer Arbeitsmappe zur Einbettung konfiguriert. Das Spannende ist, dass die Fachanwendung dedizierte disy Cadenza-Funktionen aufrufen kann, wie bspw. die Geometrieerfassung oder -bearbeitung. Außerdem stehen zusätzliche programmatische Konfigurationsmöglichkeiten zur Verfügung, wie Zoom auf einen Kartenausschnitt, die Übergabe eines Location-Finder-Suchbegriffs oder die Modifikation der Sichtoptionen.
disy Cadenza-Funktionalitäten aus Fachanwendung aufrufen
Die Einbettung dieser Inhalte in die Fachanwendung findet über die cadenza.js – eine JavaScript-Bibliothek – statt. Mithilfe der Programmierbibliothek ist die Interaktion mit der sogenannten „Embedding-API“ möglich. Die Kommunikation zwischen disy Cadenza und der Fachanwendung läuft über postMessage-Events. Dank der dadurch entstehenden Kapselung müssen sich Entwickler:innen mit der Programmierung für die Einbettung nicht weiter beschäftigen.
Fiktives Beispiel | disy Cadenza-Funktionalitäten aus Fachanwendung aufrufen: Ich als Privatperson habe eine Windkraftanlage in Auftrag gegeben und möchte über die Seite der Umweltagentur Anpassungen meiner Angaben vornehmen.
Daten selbst in einer Fachanwendung über disy Cadenza erfassen
Da ich eine falsche Angabe zu meiner Windkraftanlage gemacht habe, möchte ich diese gerne selbst auf der Seite der Umweltagentur anpassen. Dazu melde ich mich auf der Webseite der Umweltagentur an. Meine gewünschten Anpassungen erledige ich über die bereitgestellte Editiermaske. Zusätzlich ist es mein Ziel, noch eine genaue Angabe zu meinem Grundstück zu hinterlegen, indem ich die entsprechende Fläche selbst editiere und speichere.
Zusammengefasst ist nun folgendes passiert:
Ich war eingeloggt auf einer Webseite. Dort habe ich meine Angaben korrigiert bzw. teilweise neu gemacht. Danach habe ich selbst den voraussichtlichen Platzierungsort meiner potenziellen Windkraftanlage per Punkterfassung erfasst sowie mein Grundstück editiert – und das über disy Cadenza, das in die Fachanwendung eingebettet ist.
Externe Inhalte aus disy Cadenza heraus aufrufen
Externe Inhalte aus disy Cadenza aufrufen
Dieser Teil der Embedding-Funktionalität unterscheidet sich stark von den anderen beiden, denn hier wird disy Cadenza durch eine externe Webseite oder Fachanwendung erweitert. Beispiele dafür sind
- das Aufrufen von Dritt-Webseiten, also weiterführender Informationen, wie beispielsweise Wikipedia,
- die Übergabe an bestehende Webanwendungen und/oder Webdienste, wie es z. B. mit dem Vorgangsverfolgungstool JIRA erfolgen kann oder
- das Aufrufen von individualentwickelten Fachanwendungen, z. B. einer Eingabemaske.
Die Kommunikation findet dabei auf Link-Ebene oder über postMessage statt. Cadenza kann dabei die externen Inhalte über statische oder dynamisch auf der Basis von Dateninhalten generierten Links oder Events aufrufen. So steht dann beispielsweise in jeder Zeile einer Tabellenspalte ein anderer, inhaltssensitiver Link per Drill-Through zur Verfügung. Die aufgerufene Fachanwendung bekommt die entsprechenden Inhalte bzw. Referenzen aus disy Cadenza, schreibt aber selbst in die in der Regel gleiche Datenbank.
Fiktives Beispiel | Externe Inhalte aus disy Cadenza heraus aufrufen: Ich, als operativ mitarbeitende Person der Umweltagentur, arbeite täglich mit einer Arbeitsmappe in disy Cadenza und führe über eine eingebettete Fachanwendung die Prüfung der Potenzialflächen von beauftragten Windkraftanlagen durch.
Ich prüfe in meiner Arbeitsmappe in disy Cadenza die Potenzialflächen von Windkraftanlagen. Die Farbe im Dashboard verrät mir dabei direkt den jeweiligen Bearbeitungsstatus. Per Klick auf ein Element in der Tabelle kann ich die Daten zur Fläche über ein Popup bearbeiten.
Für mich sieht es so aus, als bewege ich mich direkt in disy Cadenza. Das Ganze erfolgt allerdings in einer Fachanwendung, die aus disy Cadenza heraus geöffnet wird (Drill-through). Der Drill-through enthält dabei dynamisch die ID der jeweiligen Fläche. Über die Fachanwendung habe ich die Möglichkeit, die Potenzialflächen zu genehmigen oder abzulehnen. Danach werden alle Änderungen durch die Fachanwendung in die Datenbank geschrieben, wodurch sie direkt in disy Cadenza sichtbar werden. Nachdem ich die Potenzialfläche also als „genehmigt“ abgespeichert habe, ist diese auch in disy Cadenza als „genehmigt“ verbucht und wechselt damit ihre Farbe von gelb („in Prüfung“) auf blau („genehmigt“).
Wie bette ich Inhalte mithilfe von disy Cadenza ein?
Beim Embedding gibt es natürlich verschiedene Bedarfe – je nachdem welche Aufgaben bzw. Rolle man in der Organisation einnimmt. Deshalb wurde eine klare Trennung zwischen Fachlichkeit und Technischem vorgenommen: Bspw. gibt es für Content-Manager:innen eine umfassende Unterstützung über die Benutzeroberfläche, Fachanwendungsentwickelnden wird eine Programmierbibliothek zur Verfügung gestellt.
Die Kommunikation mit disy Cadenza läuft über die sogenannte „Embedding-API“. Sie ist Teil der „Cadenza-API“. Die zugrunde liegenden Basistechnologien (Web-Technologien) sind:
- Der Austausch bzw. die Kommunikation findet über HTTP(S) statt.
- Zur Einbettung der Inhalte werden iFrames genutzt.
- Die Kommunikation zwischen disy Cadenza und einer Fachanwendung findet über JavaScript postMessage statt.
Jetzt kommen wir aber zu den alles entscheidenden Fragen: „Wie bette ich denn überhaupt die Inhalte von disy Cadenza ein? Und wie kompliziert ist das Ganze?“. Die Antwort auf die zweite Frage ist schnell gegeben: „Gar nicht.“. Für die Antwort auf die erste Frage müssen Sie noch ein paar Zeilen weiterlesen:
A) Inhalte aus disy Cadenza in Portale einbetten und disy Cadenza-Funktionalitäten aus einer Fachanwendung heraus aufrufen
Einstellungen in disy Cadenza
Bei diesen beiden Varianten hat man die Wahl, ob eine Arbeitsmappe, ein Arbeitsblatt oder doch eine einzelne Sicht (wie eine Karte, ein Diagramm, eine Tabelle, ein Indikator oder Ähnliches) eingebettet werden soll. Diese Inhalte werden in disy Cadenza vorbereitet und können dann im Anschluss in eine Webseite oder Fachanwendung eingebunden werden. Die Konfiguration ist ganz einfach. Sie erfolgt über eine intuitive Benutzeroberfläche direkt in disy Cadenza. Im „Arbeitsmappen verwalten“-Dialog sind im Reiter „Einbettung“ die eingebetteten Inhalte zu finden. Ausgehend von dieser Stelle gelangt man auch zur Konfiguration.
Erstellung des eingebetteten Inhalts
Die Konfiguration erfolgt über einen separaten Dialog. Dort können alle Einstellungen vorgenommen werden. Besonders nutzerfreundlich ist dabei die Vorschau zum eingebetteten Inhalt. Sie wird kontinuierlich angezeigt, sodass man direkt weiß, welches Ergebnis am Ende zu erwarten ist. Dadurch kann auch besser eingeschätzt werden, ob noch gewisse Komponenten, wie bspw. das Anzeigen des Analysekontexts, nötig sind.
Es ist wichtig, dass dem eingebetteten Inhalt ein systemweit einzigartiger Name gegeben wird; er wird im Nachgang auch in der Einbettungs-URL vorkommen. Über diese URL sind die einbettbaren Inhalte dann erreichbar. Die URL kann nach dem Speichern verwendet werden.
Erzeugte URL für die Einbettung
Der Inhalt kann über copy-and-paste der URL oder über die Cadenza.js in einer Webseite oder Fachanwendung eingebettet werden. Dort wird dann der vorbereitete disy Cadenza-Inhalt wie in der Vorschau angezeigt. Optional können auch Filtervariablen definiert werden. Die Filterbelegung wird dann über die URL mitgeliefert. Dabei empfehlen wir generell den Einsatz der Cadenza.js.
Und das Beste: Der eingebettete Inhalt ist interaktiv. Das heißt, jegliche Interaktionen, die auch in disy Cadenza möglich sind, wie bspw. das Zoomen in der Karte, sind auch beim eingebetteten Inhalt möglich. Dabei können sogar Export-Funktionalitäten genutzt werden.
B) Externe Inhalte aus disy Cadenza heraus aufrufen
Um externe Inhalte in disy Cadenza einzubetten, muss der Weg über das Management Center genommen werden. Dort nimmt eine berechtigte Person unter „Externe Inhalte“ entsprechende Einstellungen vor. Zu jedem Link, zu dem hin verweisen werden soll, muss zuerst die Basis-URL angegeben werden. Danach können Erweiterungen konfiguriert werden. Speichern, fertig.
Ein Vorteil: Beispielsweise beim Wechsel von einer Test- auf eine Produktivumgebung kann einfach nur der Basislink ausgetauscht werden. Die Änderungen werden dann automatisch nachgezogen. Die optionale Verwendung von Link-Templates mit Umgebungsvariablen macht dies in automatischen Deployment-Prozessen sogar noch einfacher.
Einstellungen im Management Center
Last, but not least: Zugriffsberechtigungen
Wahrscheinlich stellt sich bei Einigen nach all diesen Informationen auch die Frage nach den potenziellen Zugriffsberechtigungen.
Webseiten und Fachanwendungen können disy Cadenza-Inhalte ohne Zugangsschutz einbetten. In diesem Fall müssen dann der Anonyme Zugang konfiguriert und die entsprechenden Inhalte für die Gastnutzer:innen freigegeben werden. Für Anwendungen mit Zugriffschutz können Fachanwendungen ein von disy Cadenza unterstütztes Single-Sign-On (SSO) Verfahren verwenden.
Kurz und knackig: Ihre Key-Takeaways
Die drei Embedding-Möglichkeiten mit disy Cadenza
- Inhalte aus disy Cadenza in Portale einbetten
- Aufrufen von disy Cadenza-Funktionalitäten aus einer Fachanwendung
- Aufrufen externer Inhalte aus disy Cadenza heraus
finden in unterschiedlichsten Bereichen und Use-Cases Verwendung. Eines haben Sie dabei aber gemeinsam: Die Konfiguration ist für alle Beteiligten im Einbettungsprozess unkompliziert. Angefangen bei der zur Verfügung gestellten Programmierbibliothek bis hin zur intuitiven Benutzeroberfläche – wir setzen alles daran, Ihnen den Weg zu ebnen.
Wenn Sie mehr dazu erfahren wollen oder Interesse an konkret auf Ihren Anwendungsfall zugeschnittene Lösungen haben, kommen Sie gerne auf uns zu.
