Javascript library in a notebook: mermaid

Links: notebook, html, PDF, python, slides, GitHub

Tries mermaid in a notebook. Example from demo.

from jyquickhelper import RenderJS
css = ["http://www.xavierdupre.fr/js/mermaid/mermaid.forest.css"]
libs = ['http://www.xavierdupre.fr/js/mermaid/mermaidAPI.min.js']
script = """
var graphDefinition = 'graph TB\\na-->b';
var cb = function(svgGraph) {
    document.getElementById('__ID__').innerHTML = svgGraph;
}
mermaidAPI.render('__ID__svg', graphDefinition, cb);
"""
jr = RenderJS(script, css=css, libs=libs)
jr

print(jr._repr_html_())

<div id="M7a059e1abe334bd3a7b6cac96353f507-css"><link rel="stylesheet" href="http://www.xavierdupre.fr/js/mermaid/mermaid.forest.css" type="text/css" /><div id="M7a059e1abe334bd3a7b6cac96353f507" style="width:100%;height:100%;"></div></div>
<script>
require(['http://www.xavierdupre.fr/js/mermaid/mermaidAPI.min.js'], function() {
var graphDefinition = 'graph TBna-->b';
var cb = function(svgGraph) {
    document.getElementById('M7a059e1abe334bd3a7b6cac96353f507').innerHTML = svgGraph;
}
mermaidAPI.render('M7a059e1abe334bd3a7b6cac96353f507svg', graphDefinition, cb);
 });
</script>