viz-js
viz-js copied to clipboard
Get image and image map
I'd like to have both, an image (e.g. svg
) and image map (e.g. cmapx
) -- so that the resulting image can have clickable areas.
Graphviz's image map is useful because it's about 5 pixels in width along/around each edge -- i.e. much wider than the 1-pixel edge itself, and therefore easier to hit/click with the mouse.
My problem is that the API lets me specify one format at a time, not two:
- So to get both outputs I must call the API twice -- so that's slower than it might be.
- So I'd like it if the format parameter would accept an array of strings as well as accepting a string.
- I'm not sure how you'd also change the API to return two strings instead of one -- do it any way you like afaic.
When I do the same by invoking dot.exe from the command-line, I can tell it to output both at once:
const args = [dotFilename, "-Tpng", `-o${pngFilename}`, "-Tcmapx", `-o${mapFilename}`];
By the way, thank you for doing this project. Even without the optimization I'm asking for, it's faster (and so more interactive) than the command-line -- taking an unreasonably complicated graph of 50+ nodes, for example:
- 300 msec for the SVG, plus 200 msec for the MAP (500 msec total)
- 1500 msec to get both by spawning dot.exe
Given that I currently need to do it in two operations, I could reduce the apparent delay by making it progressive: display the SVG a.s.a.p., and then the image map a bit later when it's ready.