It has two mersmaid.
The below must be included somewhere, but the end is fine!
%%html
<script src="//cdn.rawgit.com/bollwyvl/53e64cdafba38461943b/raw/0815758d591dfaf0f4918b388aed1bf11d82160d/mermaid.full.js"></script>
<style>
.mermaid *{font-family: sans-serif; }
.mermaid .node, .mermaid .cluster{
fill: white !important;
stroke: black !important;
stroke-width: 1px !important;
}
.mermaid div{
text-align: center;
}
.mermaid .label{
color: black;
}
</style>
<script>$(function(){
// mermaid load a touch weirdly: try immediately, but try again later if it's not available
var initMermaid = function(){
return (window.mermaid && mermaid.init()) || setTimeout(initMermaid, 50);
}
initMermaid();
// for live editing, re-render only the text of the current cell
window.IPython && $(IPython.events).on("rendered.MarkdownCell", function(evt, data){
// this is using a hacked mermaid that accepts some nodes!
mermaid.init(undefined, data.cell.element.find(".mermaid"));
});
});</script>