I'd like to view a graphviz file in wiki. I can process it on the server but it seems difficult to get any rich format to display on the screen. Of course I want links so this makes image formats a non-starter.
What's with svg anyway? It's not an SVG issue. SVG's work fine. They embed and display fine. We have built in interactivity. We can author and enhance them with powerful manual and scripting tools. They are great.
The issue is with how the wiki-client is trapping events and not allowing the browser to handle the url linkes.
Scalable Vector Graphics (SVG) is an XML-based vector image format for two-dimensional graphics with support for interactivity and animation - wikipedia ![]()
Client Side Solution
A client side solution has some advantages. you can tweak the code in the browser. You can quickly role simple diagrams.
Client side solutions suffers from the lack of ability to bring the image into a nice drawing package and edit it to make it clean and simple before returning it to the wiki. That is what SVG's are good for.
However the best current javascript client side implementation is:
Dagre is a JavaScript library that makes it easy to lay out directed graphs on the client-side.
Experimental Solutions
Viz.js ports graphviz to js with emscripten. This sounds like the wrong way to go but they do have nice examples. github ![]()
Older Solutions
Canviz is a JavaScript library for drawing Graphviz graphs to a web browser canvas. More technically, Canviz is a JavaScript xdot renderer. It works in most modern browsers. google code ![]()
Canvg is a SVG parser and renderer. It takes a URL to a SVG file or the text of an SVG file, parses it in JavaScript, and renders the result on a Canvas element. The rendering speed of the examples is about as fast as native SVG. github ![]()
Dagre (Directed graph renderer for Javascript) - github.com ![]()