2013-04-05 19 views
15

Próbuję dowiedzieć się, jak wygenerować wykres za pomocą hiperłączy, które można kliknąć, aby uzyskać dostęp do bardziej szczegółowych informacji na temat każdego węzła/krawędzi na wykresie. Odkryłem, że graphviz ma tę zdolność, używając właściwości węzła URL. Korzystanie mój plik testowy ...Adres wbudowany graphviz

graph G { 
    node [label="\N"]; 
    graph [bb="0,0,218,108"]; 
    king [pos="31,90", width="0.86", height="0.50"]; 
    lord [pos="31,18", width="0.81", height="0.50"]; 
    "boot-master" [URL="google.com"]; 
    king -- lord [pos="31,72 31,61 31,47 31,36"]; 
} 

... udało mi się wygenerować plik cmapx który wydaje się zawierać kilka przydatnych informacji:

<map id="G" name="G"> 
<area shape="poly" href="google.com" title="boot&#45;master" alt="" coords="297,29 292,22 279,15 258,10 233,7 204,5 175,7 150,10 129,15 116,22 111,29 116,37 129,43 150,49 175,52 204,53 233,52 258,49 279,43 292,37"/> 
</map> 

tutaj było polecenie użyłem do wygenerowania tego:

dot -Tcmapx example1_graph.dot -o test.cmapx 

Jednak nie jestem pewien, jak korzystać z tego pliku? Dokumentacja dla graphviz również wspomina, że ​​format ps2 powinien działać dla linków URL, ale nie miałem szczęścia.

Odpowiedz

18

Mapa stworzona przez firmę graphviz może być zwykle używana na stronie HTML strona.

Chodzi o to, aby dwukrotnie uruchomić graphviz: raz, aby utworzyć mapę, i raz, aby utworzyć obraz.

dot -Tcmapx example1_graph.dot -o test.cmapx 
dot -Tpng example1_graph.dot -o test.png 

Następnie obraz jest wyświetlany na stronie HTML razem z mapą. Składnia byłoby coś takiego:

<img src="/test.png" usemap="#G" alt="graphviz graph" /> 
<!-- graphviz generated map --> 
<map id="G" name="G"> 
    <area shape="poly" href="google.com" title="boot&#45;master" alt="" coords="297,29 292,22 279,15 258,10 233,7 204,5 175,7 150,10 129,15 116,22 111,29 116,37 129,43 150,49 175,52 204,53 233,52 258,49 279,43 292,37"/> 
</map> 

Ważną częścią bycia usemap="#G" która łączy obraz na mapie.

Zobacz także przykład strony html obsługującej obraz i mapę razem.


Innym Format wykorzystujące adres URL jest SVG:

dot -Tsvg example1_graph.dot -o test.svg 

Jeśli otworzysz test.svg w przeglądarce, węzły zawierające adresy URL są klikalne.

(Btw, w zależności od zastosowania, może warto poprzedzić adres URL http://)

+3

Dzięki, wielkie objaśnienia! Porada dotycząca przeglądania plików .svg w przeglądarce była dokładnie tym, czego potrzebowałem. –