Graph Visualisierung und Navigation PG478 Open Graph Drawing Framework Martin Gronemann
Übersicht 1. Anwendungsgebiete 2. Layouttechniken 3. Klassische Werkzeuge der Navigation Zoom & Pan Joint pan-zoom Problem 4. Kontext-erhaltende Werkzeuge Fisheye Distortion Layout basierende Techniken
Anwendungsgebiete Beispiele Bioinformatik Soziale Netzwerke Wirtschaft Computernetzwerke
Bioinformatik Visualisierung in der Genforschung Knoten: Gruppen von Genen Kanten: Proteine der Genegruppen : hängen funktional zusammen
Soziale Netzwerke Freundschaften an einer High School in den USA nach Hautfarbe Weiß Schwarz Andere
Wirtschaft Director Interlocks Kreise: Unternehmen Größe: Anzahl der Angestellten Kante: Manager die in anderen Firmen tätig sind.
Netzwerk Visualisierung OPTE Projekt Visualisierung des Internets Kanten nach Kontinenten eingefärbt
Verschiedene Layouttechniken 1. Ballon Layout 2. Radial Layout 3. Cone Tree 4. Hyperbolische Darstellung
Ballon Layout Knoten liegen auf dem Kreis ihres Elter. Elter ist Kreismittelpunkt Muss nicht symmetrisch sein.
Radial Layout Knoten mit Tiefe k liegen auf dem selben Kreis Kreise sind konzentrisch (gleicher Mittelpunkt) 3D Version: Kreise als Kugeln
3D Layouts Raumnutzung + Mehr Platz - Navigation komplizierter 2D Algorithmen meist auch in 3D verwendbar (Force-Directed, Radial,...) Nutzung von Virtual Reality
Cone Tree Hier: Zusätzlich eine Ebene mit Schatten und Steuerelementen 3D Baumdarstellung: Elter ist Spitze des Kegels Kinder liegen am Rand der Grundfläche Jeder Pfad kann durch Rotierung der Kegel in den Vordergrund gebracht werden
Hyperbolisch 3D Mathematischer Hintergrund kompliziert. Algorithmus arbeitet im hyperbolischen Raum Darstellung erfolgt im euklidischen Raum Gibt es auch in 2D
Navigation Große Datenmengen: Ein gutes Layout reicht nicht aus Es können nicht alle Details erkannt/dargestellt werden Ansichtsfläche ist begrenzt (Fenster)
Klassische Werkzeuge Zoom (Vergrößerung) Es wird ein Ausschnitt des Graphen vergrößert dargestellt. Pan (Verschiebung) Der (vergrößerte) Ausschnitt wird verschoben.
Zoom Geometrischer Zoom Ausschnitt des Graphen wird mit einer gegebenen Skalierung nur vergrößert. Semantischer Zoom Die Detailtiefe d.h. der Informationsgehalt der einzelnen Objekte wird zusätzlich erhöht.
Beispiel: Webseite Knoten: Webseiten Kanten: verlinkte Seiten
Dateinamen nur in der Vergrößerung Bei noch stärkerer Vergrößerung Vorschau möglich Vergrößerung
Beispiel: UML Diagramm
Space-Scale Ansichtsfenster Jede mögliche Ansicht darstellbar als Punkt Raum kontinuierlich Punkt im Bild = Strahl im Raum Pan: Verschiebung auf der XY Ebene Zoom: Verschiebung entlang der Z-Achse
Joint pan-zoom Problem System/Interface muss von Punkt (x 1,y 1,z 1 ) zu Punkt (x 2,y 2,z 1 ) navigieren. Beispiel: Anzeigen eines Suchergebnisses Weg soll möglichst gut (= kurz) sein. Keine triviale Aufgabe!
Joint pan-zoom Problem: Kurzer Weg P 1 P 2 Pan Operation Zoom Operation Ansicht
Joint pan-zoom Problem: Noch Kürzer P 1 P 2 In Worten: Zoom verringern bis beide Punkte in der Ansicht Zoom erhöhen
Fokus+Kontext Ziel: Benutzer ist in der Lage eine Fokussierung vorzunehmen (wie bei Zoom&Pan) Bezug zur Umgebung bleibt aber erhalten ( Preserving the mental map ). Als Beispielmethode: Fisheye Distortion
Fisheye Distortion Krümmung der normalen Ansicht durch eine Störungsfunktion Störungsfaktor d interaktiv (Bild d=4)
Fisheye Distortion Beispiel Radial Layout Kantenschnittpunkt! Fokus Beachte: Alle Kanten nicht gekrümmt! Fisheye View
Fisheye View in aisee Software
Layoutbasierte Methoden Fisheye Distortion: Graphische Lösung Mit jedem Layout verwendbar Kann zu unerwünschten Effekten führen (Beispiel von vorhin) Alternative: Distortion (Störung) direkt in den Layout Algorithmus einbauen.
Beispiel: Ballon Layout Idee: fokussierten Ballon mehr Platz zuteilen. Die anderen Ballons schrumpfen lassen. Fokus
Beispiel Hyperbolisches Layout Kein Einbauen nötig Wurde mit dem Fokus+Kontext- Gedanken entwickelt.
Walrus Graph Visualization Tool Navigation erfolgt durch Drehung des Balls Ermöglicht auch große Datenmengen darzustellen Mittlerweile Open Source
Ende Mein Paper: I. Herman, G. Melancon und M. S. Marshall, Graph Visualization and Navigation in Information Visualization: A Survey