Graphen interaktiv und Browser? I'm lost...
Verfasst: Freitag 11. Oktober 2019, 20:52
Hallo Leute,
heute wende ich mich an Euch, weil ich absolut den roten Faden verloren habe. Könnte jetzt echt ne Menge Text werden.
Darum geht's konkret:
In einem Dokument, sagen wir mal Doc1, wird auf andere Dokumente verwiesen. Auf Doc1 wird allerdings auch von
anderen Dokumenten aus verwiesen. Das bedeutet, wenn ich Änderungen in Doc1 vornehme, muss ich wissen welche
anderen Dokumente auf Doc1 verweisen.
Denn es könnte ja sein, dass ich im Zuge einer Überarbeitung von Doc1 beispielsweise das Kapitel 3 komplett
streiche. Wäre dann natürlich doof, wenn irgendein anderes Dokument auf Kapitel 3 von Doc1 verweisen würde.
Somit müsste ich alle anderen Dokumente kontrollieren (nur die, die auf Doc1 verweisen), damit keine Verweise
entstehen, die ins Leere verlaufen.
Zu Testzwecken habe ich eine Excel-Tabelle erstellt, in der ich sehen kann auf welche Dokumente mein Doc1 verweist.
Anhand der Tabelle kann ich natürlich auch sehen, welche Dokumente auf Doc1 verweisen.
Hier mal der Aufbau der Excel-Datei (das PDF heisst hier noch sop1):

Die erste Spalte listet alle Dokumente untereinander auf (Spalte: Hauptdokument) und die Spalten l1 bis l3 enthalten
die Verweise auf andere Dokumente.
Doc1 verweist beispielsweise auf Doc2, Doc3 und Doc4.
Doc5 verweist auf kein anderes Dokument, allerdings verweisen Doc3 und Doc4 auf Doc5.
Zu guter Letzt habe ich Doc6 als "Satelliten" definiert.
Doc6 zeigt auf kein Dokument und kein anderes Dokument verweist auf Doc6.
...und hier mein Code (einige Zeilen auskommentiert...Testzwecke):
Da so eine Tabelle nicht wirklich "schön" ist, habe ich ein kleines Tool geschrieben,
dass die Excel-Tabelle einliest und mir einen gerichteten Graphen baut.
Hier zwei Bilder der "Auswertung":



Ihr seht schon am Code, dass ich immer einen Block auskommentiere. Je nach dem, ob ich den gesamten Graph sehen will,
oder nur einen bestimmten Knoten. Ferner ist zu sehen, dass ich einen gerichteten Graphen mittels networkx und
matplotlib erzeuge. Die Daten für den Graphen kommen aus einer Excel-Datei, was hier aber erstmal völlig unwichtig ist.
Ich würde zum Testen auch im Code hinterlegte Daten nehmen.
Nun ist es ja so, dass der Graph total unübersichtlich wird, je mehr Dokumente und Verweise ich habe.
Bei 50 Dokumenten hätte ich ja schon 50 Knoten im Graphen. Wenn dann noch bis zu 10 Verweise pro Dokument möglich wären,
dann gute Nacht bzgl. Übersichtlichkeit.
Ich benötige eine Möglichkeit, dass der User entweder
1.) per Pull Down-Menü seinen Knoten auswählt (Doc5) und dann die Kanten hervorgehben werden, die auf diesen Knoten zeigen.
2.) oder die ganze Sache interaktiv ist. Entweder MouseOver oder Klick und die Kanten werden hervorgehoben.
Noch geiler wäre eine zusätzliche dynamische Tabelle, die alle Dokumente auflistet, die auf z.B. Doc5 verweisen, sobald
der Anwender auf Doc5 klickt.
Ich habe den Überblick bzgl. tkinter, bokeh, D3, NodeJS usw... völlig verloren.
Was genau kann ich nun eigentlich sinnvoll einsetzen?
Eine webbasierte Lösung fände ich gut, muss es aber nicht zwingend sein.
Bin echt n bisse lost und würde gerne wissen, ob Ihr ähnliche/vergleichbare Projekte habt und wie Ihr das gelöst habt.
Aktuell handelt es sich hier bei mir um ein rein privates Projekt, um mich dem Thema Visualisierung zu nähern.
Ich könnte ja schließlich auch einfach die Excel-Tabelle entsprechend auswerten und gut...aber Graphen sind ja so cool.
Vielen Dank schonmal für Eure Geduld
CfS
heute wende ich mich an Euch, weil ich absolut den roten Faden verloren habe. Könnte jetzt echt ne Menge Text werden.

Darum geht's konkret:
In einem Dokument, sagen wir mal Doc1, wird auf andere Dokumente verwiesen. Auf Doc1 wird allerdings auch von
anderen Dokumenten aus verwiesen. Das bedeutet, wenn ich Änderungen in Doc1 vornehme, muss ich wissen welche
anderen Dokumente auf Doc1 verweisen.
Denn es könnte ja sein, dass ich im Zuge einer Überarbeitung von Doc1 beispielsweise das Kapitel 3 komplett
streiche. Wäre dann natürlich doof, wenn irgendein anderes Dokument auf Kapitel 3 von Doc1 verweisen würde.
Somit müsste ich alle anderen Dokumente kontrollieren (nur die, die auf Doc1 verweisen), damit keine Verweise
entstehen, die ins Leere verlaufen.
Zu Testzwecken habe ich eine Excel-Tabelle erstellt, in der ich sehen kann auf welche Dokumente mein Doc1 verweist.
Anhand der Tabelle kann ich natürlich auch sehen, welche Dokumente auf Doc1 verweisen.
Hier mal der Aufbau der Excel-Datei (das PDF heisst hier noch sop1):

Die erste Spalte listet alle Dokumente untereinander auf (Spalte: Hauptdokument) und die Spalten l1 bis l3 enthalten
die Verweise auf andere Dokumente.
Doc1 verweist beispielsweise auf Doc2, Doc3 und Doc4.
Doc5 verweist auf kein anderes Dokument, allerdings verweisen Doc3 und Doc4 auf Doc5.
Zu guter Letzt habe ich Doc6 als "Satelliten" definiert.
Doc6 zeigt auf kein Dokument und kein anderes Dokument verweist auf Doc6.
...und hier mein Code (einige Zeilen auskommentiert...Testzwecke):
Code: Alles auswählen
#!/usr/bin/env python
# -*- utf-8 -*-
import networkx as nx
import numpy as np
import matplotlib.pyplot as plt
import pandas as pd
import os
os.system('clear')
columns=0;
df = pd.read_excel("docs1.xlsx", sheet_name=0)
for zaehler in df: columns=columns+1
rows = df.size/columns
G = nx.DiGraph()
myLists = [[] for i in range(columns)]
for z1 in range(columns):
for z2 in range(rows):
ausgabe = df.loc[z2].values[z1]
myLists[(z1)].append(ausgabe)
'''
# ----------------------------------
# --- Nur einen Knoten einlesen ---
# ----------------------------------
suchstring='Doc5'
G.add_node(suchstring)
for z in range(columns):
for j in [j for j,y in enumerate(myLists[(z)]) if y == suchstring]:
if z != 0:
#print("j="+str(j)+", zugehoeriges Dokument: "+str(myLists[(0)][j]))
G.add_edge(myLists[(0)][j], suchstring, weight=0)
'''
# ----------------------------------
# --- Alle Knoten einlesen ---
# ----------------------------------
for suchstring in myLists[(0)]:
#print("Suchstrings: "+str(suchstring))
G.add_node(suchstring)
for z in range(columns):
for j in [j for j,y in enumerate(myLists[(z)]) if y == suchstring]:
if z != 0:
#print("j="+str(j)+", zugehoeriges Dokument: "+str(myLists[(0)][j]))
G.add_edge(myLists[(0)][j], suchstring, weight=0)
# -----------------------------------------------------------------------------------------------
#Graph in entsprechender Form zeichen
plt.figure(1, figsize=(9,9))
plt.title("====================\nBeziehungen zwischen den Docs\n====================\n")
#nx.draw_graphviz(gr, prog='fdp', node_size = sizes)
#nx.draw_networkx(G, with_labels=True)
#nx.draw_shell(G, with_labels=True, node_size=groesse)
nx.draw_shell(G, with_labels=True, node_size=2000, node_color='#9999FF', edge_color='#FF0000', arrowsize=30)
#nx.draw_spring(G, with_labels=True)
#nx.draw_random(G, with_labels=True)
#nx.draw_circular(G, with_labels=True)
#nx.draw_spectral(G, with_labels=True)
#plt.tick_params(axis='x', which='both', bottom=False, top=False, labelbottom=False)
#plt.tick_params(axis='y', which='both', right=False, left=False, labelleft=False)
for posi in ['right','top','bottom','left']:
plt.gca().spines[posi].set_visible(False)
#plt.figure(1,figsize=(2000,2000))
#plt.savefig("graph.png", dpi = 1000)
plt.show()
dass die Excel-Tabelle einliest und mir einen gerichteten Graphen baut.
Hier zwei Bilder der "Auswertung":



Ihr seht schon am Code, dass ich immer einen Block auskommentiere. Je nach dem, ob ich den gesamten Graph sehen will,
oder nur einen bestimmten Knoten. Ferner ist zu sehen, dass ich einen gerichteten Graphen mittels networkx und
matplotlib erzeuge. Die Daten für den Graphen kommen aus einer Excel-Datei, was hier aber erstmal völlig unwichtig ist.
Ich würde zum Testen auch im Code hinterlegte Daten nehmen.

Nun ist es ja so, dass der Graph total unübersichtlich wird, je mehr Dokumente und Verweise ich habe.
Bei 50 Dokumenten hätte ich ja schon 50 Knoten im Graphen. Wenn dann noch bis zu 10 Verweise pro Dokument möglich wären,
dann gute Nacht bzgl. Übersichtlichkeit.
Ich benötige eine Möglichkeit, dass der User entweder
1.) per Pull Down-Menü seinen Knoten auswählt (Doc5) und dann die Kanten hervorgehben werden, die auf diesen Knoten zeigen.
2.) oder die ganze Sache interaktiv ist. Entweder MouseOver oder Klick und die Kanten werden hervorgehoben.
Noch geiler wäre eine zusätzliche dynamische Tabelle, die alle Dokumente auflistet, die auf z.B. Doc5 verweisen, sobald
der Anwender auf Doc5 klickt.
Ich habe den Überblick bzgl. tkinter, bokeh, D3, NodeJS usw... völlig verloren.
Was genau kann ich nun eigentlich sinnvoll einsetzen?
Eine webbasierte Lösung fände ich gut, muss es aber nicht zwingend sein.
Bin echt n bisse lost und würde gerne wissen, ob Ihr ähnliche/vergleichbare Projekte habt und wie Ihr das gelöst habt.
Aktuell handelt es sich hier bei mir um ein rein privates Projekt, um mich dem Thema Visualisierung zu nähern.
Ich könnte ja schließlich auch einfach die Excel-Tabelle entsprechend auswerten und gut...aber Graphen sind ja so cool.

Vielen Dank schonmal für Eure Geduld
CfS