mirror of
https://github.com/mermaid-js/mermaid.git
synced 2025-01-28 07:03:17 +08:00
c7b44679c1
Added UTF-8 tag to test webpage Added tests for shapes on test webpage Added odd shape Added circle shape Modified diamond shape to always use right angles
58 lines
1.4 KiB
HTML
58 lines
1.4 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
|
|
<script src="../dist/mermaid.full.js"></script>
|
|
<script>
|
|
var mermaid_config = {
|
|
startOnLoad:true
|
|
}
|
|
</script>
|
|
<script>
|
|
function apa(){
|
|
console.log('CLICKED');
|
|
}
|
|
</script>
|
|
</head>
|
|
<body>
|
|
<div class="mermaid">
|
|
sequence TB
|
|
apa:Apanhoppar
|
|
bapa:Server
|
|
chimp:Chimpansenhoppar
|
|
</div>
|
|
<div class="mermaid">
|
|
graph TB;A(Astrid <br> b)-->B[Irene];
|
|
A-->C[Christer];
|
|
B-->D[Micke];
|
|
B-->E[Maria];
|
|
E-->F[Hjalte];
|
|
E-->G[Embla];
|
|
E-->J[Vidar];
|
|
E-->H[Bjarke];
|
|
E-->I[Ingvild];
|
|
click A apa;
|
|
</div>
|
|
<div class="mermaid">
|
|
graph TD;
|
|
eag[Läsa bok 2]-->b;
|
|
b{Fundera}---|Klocka|c(Vidar);
|
|
b-->|Lego text|d(Bjarke går);
|
|
e(orphan);
|
|
style eag red;
|
|
</div>
|
|
<h1>Shapes</h1>
|
|
<div class="mermaid">
|
|
graph TD;
|
|
sq[Square shape]-->ci(Circle shape);
|
|
od>Odd shape]---|Two line<br>edge comment|ro;
|
|
od2>Really long text in an Odd shape]-->od3>Really long text with linebreak<br>in an Odd shape];
|
|
di[Diamond is broken]-->ro{Rounded<br>square<br>shape};
|
|
di[Diamond is broken]-->ro2{Rounded square shape};
|
|
e(Inner circle);
|
|
style e red;
|
|
</div>
|
|
|
|
</body>
|
|
</html> |