Gegenstand der vorliegenden Arbeit ist die Entwicklung und Präsentation einer grafischen Navigationskomponente, die miteinander vernetzte Begriffe aus der Umweltterminologie in Form einer interaktiven Grafik anzeigt und eine Navigation innerhalb dieser Begriffe ermöglicht. Die Webapplikation nutzt hierfür den semantischen Netzwerkdienst (SNS) des Umweltbundesamtes.
Die im XML Topic Map-Format vorliegenden Datenbestände des Umweltbundesamtes werden auf Basis von Javascript (Ajax), SVG, XSLT und PHP ausgewertet und visualisiert. Es erfolgt zunächst eine kurze Einführung in die Themenkomplexe Web Services und Semantic Web, gefolgt von einer Beschreibung, wie sich Web Services in eine Webanwendung einbinden lassen und wie das bei der hier vorgestellten Webapplikation gelöst worden ist.
Im nächsten Schritt wird auf die genormte Struktur und Elemente von Topic Maps eingegangen.
Die Kapitel Konzeption und Realisierung beschreiben detailliert die funktionalen und gestalterischen Aspekte der vorliegenden Arbeit.
Im Schlusskapitel wird anhand von verschie-denen Szenarien der Einsatz der Webapplikation dargestellt.
Schlagwörter: Semantic Web, Web Service, Topic Map, semantisches Netz, Umwelt-informationen, Suchmethoden, Thesaurus, Internet, Navigationskomponente, Umwelt-bundesamt, Javascript, XML, XSLT, Ajax, SVG, PHP
Inhaltsverzeichnis
1 Überblick
2 Ausgangspunkt
3 Ziele
4 Technologien
4.1 Web Services
4.2 Semantische Netze und Semantic Web
4.3 Topic Maps
4.3.1 Der ISO-Standard 13250
4.3.2 Die Basiskonzepte von Topic Maps
4.3.3 Elemente einer XML Topic Map
4.4 Kommunikation mit dem Web Service
4.4.1 Funktionen des SNS Web Service
4.4.2 Web Services und Protokolle
4.4.3 SOAP vs. REST
4.5 Struktur der XML-Definitionen von SNS
4.6 Scalable Vector Graphics (SVG)
4.7 Javascript und Ajax
4.8 PHP
5 Anforderungen und technische Lösungsansätze
5.1 Use Cases
5.2 Empfehlungen des Umweltbundesamtes für die Einbindung des Services beim Nutzer
5.2.1 Axis
5.2.2 .NET Framework
5.3 Gewählter Lösungsansatz
6 Konzeption
6.1 Funktionaler Aufbau und Struktur der Webapplikation
6.1.1 Three-Tier-Architektur
6.1.2 Anwendungsarchitektur des SNS-Navigators
6.1.3 Einsatzbereiche der verschiedenen Webtechnologien
6.1.4 Proxy
6.1.5 Struktur der Ein- und Ausgabeseiten
6.1.6 Darstellung aller Komponenten der Anwendung
6.1.7 Die „Zufallssuche“
6.1.8 Model-View-Controller-Konzept
6.1.9 Aktivitätsdiagramme
6.2 Gestaltung der Webapplikation
6.2.1 Aufteilung der Benutzungsoberfläche in verschiedene Bereiche
6.2.2 Farblegenden der Topic- und Assoziationstypen
6.2.3 Anzeige aller gefundenen Topics als Liste
6.2.4 Grafische Anzeige der Topic Map
6.3 Technische Voraussetzungen
7 Realisierung
7.1 Web Service Anfrage mittels GET / POST Binding durch einen Proxy
7.2 XML-Transformation der zurückgelieferten Topic Map
7.3 Darstellung der SVG-Anzeige in einem I Frame
7.4 Realisierung der Statusanzeige mit Ajax
7.5 Entwurf der Icons (Topic types der SNS-Topic Map)
7.6 Struktur der XML-Stylesheets
7.6.1 Listenanzeige aller gefundenen Topics (HTML-Ausgabe)
7.6.2 Grafikanzeige der XML Topic Map mit SVG
7.7 Interaktivität der SVG Grafik mit Javascript
8 Ergebnis
9 Zusammenfassung
Zielsetzung & Themen
Das Hauptziel dieser Diplomarbeit besteht in der Konzeption und Entwicklung einer interaktiven, grafischen Navigationskomponente, welche die auf dem „Semantic Network Service“ (SNS) des Umweltbundesamtes basierenden Datenbestände visualisiert. Die Forschungsfrage fokussiert sich darauf, wie mithilfe von Web-Technologien (wie PHP, SVG, Ajax und XML) eine intuitiv bedienbare Oberfläche geschaffen werden kann, die es sowohl Fachanwendern als auch Laien ermöglicht, komplexe, vernetzte Umweltdaten explorativ zu navigieren.
- Konzeption und Realisierung einer Webapplikation zur Visualisierung von Topic Maps.
- Einsatz von Web Services zur maschinellen Datenabfrage in einer Service-orientierten Architektur (SOA).
- Grafische Aufbereitung semantischer Netze durch Skalierbare Vektorgrafiken (SVG).
- Anwendung des Model-View-Controller-Konzepts (MVC) zur Trennung von Daten, Präsentation und Steuerung.
- Verbesserung der Usability durch interaktive Elemente und dynamische Statusanzeigen mittels Ajax.
Auszug aus dem Buch
4.6 Scalable Vector Graphics (SVG)
SVG ist ein XML-Standard zur Beschreibung zweidimensionaler Vektorgrafiken und neben den statischen Merkmalen, die auch schon von anderen Vektorgrafiken bekannt sind, sind es vor allem die dynamischen und im Web anwendbaren Eigenschaften von SVG, die es sehr interessant machen. Für die in dieser Arbeit vorgestellte Visualisierung der Topic Map von SNS ist SVG hervorragend geeignet, da es ebenso wie der Topic Map-Standard auf XML basiert. Somit ist es mit einer XSL-Transformation möglich, die Topic Map in ein SVG Format umzuwandeln.
Wie das Beispiel aufzeigt, werden bei SVG alle Bildeigenschaften als geometrische Formen (z.B. Linien, Rechtecke, Kreise, Ellipsen) in einem Koordinatensystem eingezeichnet. Diese Art der Bildbeschreibung führt zu einer großen Datenreduktion im Gegensatz zu Pixelformaten (z.B. JPEG, GIF, BMP) und hat außerdem den Vorteil einer beliebig skalierbaren Darstellung der Grafik („Zoomen“ ohne Qualitätsverlust).
Zur großen Freude des Autors werden die Grundfunktionen von SVG von den aktuellsten Webbrowsern unterstützt, wie z.B. von dem momentan sehr populären Webbrowser Firefox von Mozilla. Dies erleichtert die Anzeige im Webbrowser, da kein zusätzliches Plug-In mehr benötigt wird. Das trifft aber noch nicht auf den Internet Explorer zu, der erst ab der bald erscheinenden Version 7 eine native Unterstützung von SVG bieten soll.
Zusammenfassung der Kapitel
1 Überblick: Diese Einleitung beschreibt die Problematik der Informationssuche im Web und führt in die Standards Web Services und Semantic Web als technologische Lösungsansätze ein.
2 Ausgangspunkt: Dieses Kapitel erläutert die Entstehung des semantischen Netzwerkservices (SNS) durch das Umweltbundesamt und dessen Ziel, Umweltdaten als vernetzte Topic Map bereitzustellen.
3 Ziele: Hier werden die Anforderungen an den SNS-Navigator definiert, insbesondere die grafische Visualisierung und die intuitive Navigation für einen breiten Nutzerkreis.
4 Technologien: Es erfolgt eine detaillierte Beschreibung der eingesetzten Webtechnologien, darunter Web Services (SOAP/REST), Topic Maps, SVG, Ajax und PHP.
5 Anforderungen und technische Lösungsansätze: Das Kapitel analysiert den Nutzungskontext mittels Use Cases und bewertet verschiedene technische Implementierungsplattformen wie Axis und .NET für die Webapplikation.
6 Konzeption: Hier wird der funktionale und gestalterische Aufbau des SNS-Navigators, inklusive der Three-Tier-Architektur und des MVC-Konzepts, umfassend konzipiert.
7 Realisierung: Dieses Kapitel beschreibt die technische Umsetzung der Webapplikation, insbesondere die Proxy-Programmierung, XML-Transformationen und die SVG-Interaktivität.
8 Ergebnis: Anhand von drei praxisnahen Anwendungsszenarien wird die Funktionsweise der fertigen Webapplikation demonstriert.
9 Zusammenfassung: Die Arbeit schließt mit einer Reflexion der Ergebnisse und der Bedeutung von SVG für interaktive grafische Webanwendungen.
Schlüsselwörter
Semantic Web, Web Service, Topic Map, semantisches Netz, Umweltinformationen, Suchmethoden, Thesaurus, Internet, Navigationskomponente, Umweltbundesamt, Javascript, XML, XSLT, Ajax, SVG, PHP
Häufig gestellte Fragen
Worum geht es in dieser Arbeit grundsätzlich?
Die Diplomarbeit behandelt die Entwicklung einer Webapplikation namens "SNS-Navigator", die es Nutzern ermöglicht, komplexe, semantisch vernetzte Umweltdaten des Umweltbundesamtes grafisch zu explorieren.
Was sind die zentralen Themenfelder der Arbeit?
Die zentralen Themen sind semantische Technologien (Topic Maps, Semantic Web), Service-orientierte Architekturen (Web Services), Vektorgrafik im Web (SVG) sowie moderne Web-Entwicklungstechniken wie Ajax und PHP.
Was ist das primäre Ziel oder die Forschungsfrage?
Das Ziel ist die Schaffung einer interaktiven, intuitiven grafischen Schnittstelle, die komplexe Datenstrukturen in Form einer Topic Map visualisiert und für den Nutzer explorierbar macht.
Welche wissenschaftlichen Methoden werden verwendet?
Die Arbeit nutzt UML-Modellierung für Anwendungsfälle (Use Cases), Architekturdiagramme für Systemkomponenten und eine strukturierte Softwareentwicklung, basierend auf dem Model-View-Controller-Ansatz.
Was wird im Hauptteil der Arbeit behandelt?
Der Hauptteil gliedert sich in eine umfassende Analyse der benötigten Web-Technologien, die Konzeption der Applikationslogik sowie die konkrete Realisierung durch XML-Stylesheets und Javascript-Funktionen.
Welche Schlüsselwörter charakterisieren die Arbeit am besten?
Wichtige Begriffe sind Semantic Web, Web Services, Topic Maps, SVG, Ajax, PHP sowie das Konzept des semantischen Netzwerkes zur Erschließung von Umweltinformationen.
Warum wurde SVG für die Visualisierung gewählt?
SVG bietet als XML-basiertes Format für Vektorgrafiken den Vorteil, dass es direkt aus XML-Daten transformiert werden kann und eine skalierbare, qualitativ hochwertige Darstellung ohne Datenverlust ermöglicht.
Welche Rolle spielt der SNS-Web Service für die Applikation?
Der SNS-Web Service fungiert als externe Datenquelle des Umweltbundesamtes, die mittels GET/POST-Bindings in die Webapplikation eingebunden wird, um auf die Wissensbasis des Umweltthesaurus zuzugreifen.
Wie realisiert die Applikation die Interaktivität?
Die Interaktivität wird durch eine Kombination aus SVG zur Darstellung der Grafik und Javascript (unter Verwendung von DOM-Manipulationen) erreicht, um Mausklicks oder Bewegungen in Echtzeit zu verarbeiten.
- Quote paper
- Jörg Jochims (Author), 2006, SNS - Navigator: Entwicklung einer grafischen Navigationskomponente für ein semantisches Netzwerk auf der Basis eines Web Services des Umweltbundesamtes, Munich, GRIN Verlag, https://www.grin.com/document/61636
