Graphviz Plugin


(Maja) #1

The Graphviz plugin allows you to add graphs to your post using the DOT language.

Repository: GitHub - discourse/discourse-graphviz



This plugin uses the Viz.js library to render graphs.
To embed a graph use [graphviz] [/graphviz] bbcode. Optionally you can define layout engine attributes: [graphviz engine=neato]. If engine is not defined, it defaults to the dot engine.
See the Graphviz site for documentation and more examples.


[graphviz engine=circo]
graph {
    a -- b;
    b -- c;
    c -- d;
    d -- e;
    e -- g;
    a -- g;
    a -- c;
    a -- d;
    a -- e;
    b -- d;
    b -- e;
    b -- g;
    c -- e;
    c -- g;
    d -- g;


SVG from the preview will get converted to png when post is cooked:


:warning: This plugin is disabled by default, after installing be sure to enable it via site settings.

Mermaid JS Plugin
Discourse 2.2.0.beta3 Release Notes
Is there an online mindmap that can be integrated in discourse?

Works great!

One thing I’d love to see is error messages in the preview window, especially when you have a complicated graph and made a syntax error somewhere it can get confusing why nothing shows up.

Is there any reasonable way to accomplish that? For mermaid.js I know you can sometimes see what’s wrong in the javascript error console, but it would be much more user friendly if it was made visible without having to use the debug tools in the browser :slight_smile:

(Joffrey Jaffeux) #3

Yes we can do this, @maja disabled it for now because it was generating a lot of errors as you were typing.
We will try to have a good solution here at some point. Might take a little bit of time.

(Joffrey Jaffeux) #5

I just pushed a commit:

This will make sure we are not rendering at each keystroke and will display an error when necessary.

Note that graphviz error are sadly very useless and I decided to just go for an alert ATM as it was not bringing anything.

(Mostapha Sadeghipour Roudsari) #6

This is a very useful plugin! How hard it would be to adopt this plugin to work with Vega-Lite?

I know no Ruby but after checking the repository it seems if I change the references to Viz.js and modify the initiator it should work with Vega-Lite. Do you see any major issues/differences that I will be facing if I want to give it a try?

(Sam Saffron) #7

Vega lite looks pretty amazing I see no particular technical challenges adapting the same pattern, give it a shot and let us know how you go

(Mark McClure) #8

Thanks - this is a useful plugin! If you’d like to see it in action, you can do so at this question in my math discussion forum.

Briefly, the forum is set up for students at my university to discuss mathematics and statistics. The particular question is directed at sophomore level students in an introductory, calculus based statistics class. The students have to enter a directed graph that is randomly generated via another resource. (The graphs are actually all the same but labeled differently.) They then need to do a little analysis on the graph and answer some questions. It was certainly super convenient to have a consistent way to enter graph.

Thanks again!

(Joffrey Jaffeux) #9

Awesome! Thanks for sharing it! ping @maja :heart: