html - graphviz embedded url -
i'm trying figure out how generate graph hyperlinks can click access more detailed information on each node / edge in graph. found graphviz has ability using url node property. using test file...
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"]; }
... able generate cmapx file seems contain useful info:
<map id="g" name="g"> <area shape="poly" href="google.com" title="boot-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>
here command used generate this:
dot -tcmapx example1_graph.dot -o test.cmapx
however i'm not sure how use file? documentation graphviz mentions ps2 format should work url links didn't have luck.
the map created graphviz can typically used in html page.
the idea run graphviz twice: once create map, , once create image.
dot -tcmapx example1_graph.dot -o test.cmapx dot -tpng example1_graph.dot -o test.png
then image served in html page map. syntax this:
<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-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>
the important part being usemap="#g"
links image map.
see this page example of html page serving image , map together.
an other format making use of url svg:
dot -tsvg example1_graph.dot -o test.svg
if open test.svg
in browser, nodes containing urls clickable.
(btw, depending on use, may want prefix urls http://
)
Comments
Post a Comment