Графический встроенный url

Я пытаюсь выяснить, как создать граф с гиперссылками, которые вы можете щелкнуть, чтобы получить более подробную информацию о каждом node/edge в графе. Я обнаружил, что у Graphviz есть эта способность, используя свойство URL node. Использование моего тестового файла...

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"];
}

... Мне удалось создать файл cmapx, который, как представляется, содержит полезную информацию:

<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>

Вот команда, которую я использовал для создания этого:

dot -Tcmapx example1_graph.dot -o test.cmapx

Однако я не уверен, как использовать этот файл? В документации для Graphviz также упоминается, что формат ps2 должен работать для ссылок URL, но мне не повезло.

Ответы

Ответ 1

Карта, созданная graphviz, обычно может использоваться на странице HTML.

Идея состоит в том, чтобы запустить Graphviz дважды: один раз для создания карты и один раз для создания изображения.

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

Затем изображение подается на странице HTML вместе с картой. Синтаксис будет примерно таким:

<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>

Важной частью является usemap="#G", которая связывает изображение с картой.

См. также эту страницу для примера страницы с изображением html и отображения вместе.


Другой формат, использующий Url, SVG:

dot -Tsvg example1_graph.dot -o test.svg

Если вы открываете test.svg в браузере, узлы, содержащие URL-адреса, можно щелкнуть.

(Btw, в зависимости от вашего использования, вы можете использовать префикс URL с http://)