In order to support client-side maps, WebDot can filter an
html page and replace all occurrences of <webdot...> tags
with a client-side map and an image reference.
For example, clientmap.dot contains:
after serving this page through /cgi-bin/webdot, this <webdot...>
tag is replaced by:
The advantages of this mode of WebDot are the much simpler authoring and
the responsiveness of client-side mapping. Notice that the URL that
would be reached by clicking on a node is flashed into the
status bar at the bottom of the browser.
The disadvantages are that the html source now contains non-standard markup and
the page has to be served through the /cgi-bin/webdot program.
Care must be taken that relative URLs in the html don't also get served
through the WebDot cgi program so it is important to use "rooted" hrefs
in documents and graphs served this way.
Embedded SVG is probably a better choice assuming SVG clients are available.
and the source of this page contains (for the graph on the right):
graph G {
node [URL="\N.html" label="" tooltip="\N" width=0.3 height=0.3 style=filled fillcolor=lightblue pencolor=black]
a -- b -- c; b -- d;
}
<webdot src="/cgi-bin/webdot/webdot/clientmap.dot" engine="neato" type="png" target="new">
<map name="webdot0">
<area shape="rect" href="/cgi-bin/webdot/http://localhost/cgi-bin/webdot/webdot/clientmap.dot.neato.png.help" title="Graph by WebDot" alt="Graph by WebDot" coords="147,240,235,228">
<area shape="rect" href="http://localhost/webdot/a.html" title="a" alt="" coords="8,132,37,161" target="new">
<area shape="rect" href="http://localhost/webdot/b.html" title="b" alt="" coords="108,105,137,135" target="new">
<area shape="rect" href="http://localhost/webdot/c.html" title="c" alt="" coords="180,179,209,208" target="new">
<area shape="rect" href="http://localhost/webdot/d.html" title="d" alt="" coords="135,7,164,36" target="new">
</map>
<img src="/cgi-bin/webdot/http://localhost/cgi-bin/webdot/webdot/clientmap.dot.neato.png"
width="235" height="240" border="0"
usemap="#webdot0"
alt="Graph by WebDot">