mermaid
Version:
Markdownish syntax for generating flowcharts, sequence diagrams and gantt charts.
48 lines (43 loc) • 1.17 kB
HTML
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="../../dist/mermaid.css"/>
<script src="../../dist/mermaid.js"></script>
<style>
body{
background-color: #89896f;
}
</style>
<script>
function callback(id){
alert(id);
}
function callback2(id){
alert('x'+id);
}
</script>
</head>
<body>
<h1>Links to callbacks</h1>
A has a tooltip and a callback <br/>
B has a link and a tooltip <br/>
C has a long tooltip <br/>
<div class="mermaid" id="i211">
graph LR;
A-->B;
B-->C;
click A callback "Tooltip"
click B "http://www.github.com" "This is a link"
click C callback "Tooltip quite long tooltip. So long that several rows are required... Not just two rows..."
</div>
<h1>Links to urls</h1>
A second diagram that should have its own callback on A even though the node has the same id.
<div class="mermaid" id="i213">
graph LR;
A-->B
B-->C
click A callback2 "Tooltip3"
</div>
</body>
</html>