Oder Text markieren und Enter drücken…

Inhaltliche Nähe

Beschreibung der "Inhaltliche Nähe" Visualisierung des Wikis. Sourcecode und API Dokumentation.

Die » Inhaltliche Nähe stellt den Versuch dar, dem User eine alternative Navigationsmöglichkeit in unserem Wiki zu geben. Im Gegensatz zur konventionellen hierarchischen Navigation die unter » Menü abgebildet ist, wird hier der Fokus auf den inhaltlichen Kontext gelegt.

Legende

 Naehe Legenede

Interaktionen

  • Drag'n'Drop: Knoten Bewegen und fixieren.
  • Klick: Öffnet den Hyperlink
  • Alt-Klick: Fixierung des Knotens lösen
  • Cmd/Strg-Klick: Öffnet den Hyperlink in einem neuen Fenster/Tab

Unsere Berechnung der "inhaltlichen" Nähe

Für die Berechnung der "inhaltlichen" Nähe müssen wir uns zunächst die nötigen Daten aus dem Wiki beschaffen, dies geschieht vereinfacht durch eine Datenbankabfrage folgender Art, "Hallo liebe Datenbank bitte suche mir alle Seiten im Wiki, die diese Bedingungen erfüllen":

  • mindestens einen gemeinsamen Tag mit der aktuelle Seite haben
  • die Links haben, die auf die aktuelle Seite zeigen
  • die durch "ausgehende" Links auf der aktuelle Seiten verknüpft sind
  • die in der Breadcrumb-Navigation (Brotkrümelnavigation) übergeordnet sind

Für alle "gefundenen" Wikiseiten wird nun der Tanimoto-Koeffizient zur aktuellen Seite berechnet. Der Tanimoto-Koeffizient gibt die Übereinstimmung zweier Sets an Kategorien wieder, beispielsweise haben die beiden Sets A (Hund, Katze, Baum) und B (Hund, Katze, Haus) einen Tanimoto-Koeffizient von 0,666. Anhand der berechneten Werte können wir nun alle gefundenen Wikiseite gewichten, sortieren und filtern:

  • Wenn es zwischen den Knoten Links oder Backlinks gibt, dann werden diese höher gewichtet. 
  • Erstelle anhand des Tanimoto-Koeffizienten für alle Knoten ein Ranking.
  • Nur Knoten, die mehr als 5% Übereinstimmung mit dem Zentralen Knoten haben sollen angezeigt werden

Alles was nun übrig bleibt, ist Datengrundlage für die Visualisierung.

Natürlich kann das System nur so gut sein, wie die Autoren Ihre Inhalte kategorisieren, denn ohne Tags können keine Aussagen über inhaltliche Bezüge gemacht werden.

Visualisierung

Rot umrandet ist die aktuelle Seite (Zentraler Knoten). Die farbliche Codierung (3 Grautöne) gibt das Zeitintervall seit der letzten Änderung wieder (siehe Legende). Prinzipiell gibt der Abstand der Knoten die inhaltliche Distanz wieder, benachbarte Knoten haben somit die höchste Übereinstimmung.

Der verzweigte Aufbau der Visualisierung erfolgt dadurch, dass wir der Reihe nach durch das Ranking der Knoten laufen (Sortiert nach Ähnlichkeit zur aktuellen Seite). In jedem Schritt wird nun durch erneute Berechnung des Tanimoto-Koeffizienten versucht, aus allen auf der Bühne bereits erstellten Knoten den best passenden Knoten zu finden und mit dem aus der aktuellen Rangfolge zu verbinden. Dieser Vorgang wird wiederholt bis das komplette Ranking durchlaufen ist und alle Knoten auf der Bühne erstellt sind.

Die eigentliche Positionierung der Knoten und Kanten übernimmt ein"force directed layout" Algorithmus. Die Grundidee dabei ist, jeder Knoten stößt alle anderen Knoten ab und jede Kante verhält sich wie eine virtuelle Feder. Da das System selbständig versucht in den "entspanntesten" Zustand zu kommen, ist es ein verbreiteter Ansatz in der Graphentheorie Netze darzustellen. "Auf diese Weise ergeben sich natürlicher anmutendende und oft intuitiver interpretierbare Zeichnungen des Graphen", wikipedia Graphzeichnen.

XML Schnittstelle

Die Daten über die inhaltlichen Nähe einer Seite werden über einen einfachen Webservice zur Verfügung gestellt, können also über eine Standard HTTP Abfrage sehr einfach ausgelesen werden. Damit können die Daten auch von jeder anderen Applikation genutzt werden. Die Daten werden mittels einer XML Datei übermittelt.

HTTP Abfrage

Die HTTP Abfrage erfolgt immer durch hinzufügen von "/naehe.xml" hinter der URL einer Wikiseite. Beispielsweise müsste für die aktuelle Seite "/medienlabor/inhaltliche-nahe" die URL folgendermassen aufgebaut sein:

Struktur XML

Für die derzeitige Visualisierung wird nur ein Teil der zur Verfügung stehenden Daten benutzt. Wir haben versucht, die Schnittstelle möglichst allgemein zu definieren, um ganz unterschiedliche Visualisierungen zu ermöglichen.    

Die Struktur der XML Datei gliedert sich immer in folgende Ober- und Unterpunkte:

  • <naehe> Wurzelknoten dem alle Daten untergeordnet sind
    • <wiki_categories> alle Tags mit Anzahl die im Wiki vorkommen (momentan nicht in der Visualisierung benutzt)
    • <centralnode> die aktuelle Seite
    • <breadcrumbs> alle übergeordneten Wiki Seiten die in der Breadcrumb-Navigation "You are here" angezeigt werden
    • <wiki_link_related> alle anderen Seiten im Wiki die mit der aktuellen Seite verlinkt sind.
    • <category_related> alle anderen Seiten im Wiki die mit der aktuellen Seite eine Schnittmenge in den Tags habe. 

<?xml version="1.0" encoding="UTF-8"?>
<naehe>

<wiki_categories>
<wiki_category>
<category>Abläufe</category>
<category_count>2</category_count>
</wiki_category>
...
</wiki_categories>

<centralnode>
<node>
<title>chemieraum - anfassbare chemie im ausstellungsraum</title>
<url>... die URL absolut zur Wikiseite</url>
<description>... der Beschreibungstext</description>
<plone_content_type>Projekt</plone_content_type>
<date_created>2008/07/23 23:42:44.652 GMT+2</date_created>
<date_last_modified>2008/08/06 23:07:28.048 GMT+2</date_last_modified>
<unmodified_since unit="hour">2125.0</unmodified_since>
<username>thomas_glaeser</username>
<main_text>
... der Haupttext
</main_text>
<categories>
<category>Hardware</category>
<category>medienlabor</category>
<category>tangible</category>
<category>Arduino</category>
<category>Interaktion</category>
<category>vvvv</category>
<category>Ausstellung</category>
<category>Interface</category>
<category>Haptik</category>
</categories>
<wiki_links>
</wiki_links>
</node>
</centralnode>

<breadcrumbs>
<node>
...
</node>
</breadcrumbs>

<wiki_link_related>
<node>
...
</node>
</wiki_link_related>

<category_related>
<node>
...
</node>
</category_related>

</naehe>

Quellcode

Der komplette Quellcode als Flex (AS 3) Projekt (Stand 16/12/2008).
Idee und Realisation: Benedikt Groß und Ronald The

Links und sonstige Quellen