marcel/mermaid
1
0
Fork 0
mirror of https://github.com/mermaid-js/mermaid.git synced 2025-11-02 03:44:16 +01:00
Code Issues Packages Projects Releases Wiki Activity

Prettify

Browse Source
This commit is contained in:
Nikolay Rozhkov
2023-06-19 04:34:41 +03:00
parent 1009bb8fb7
commit fd3ffdc22a
2 changed files with 38 additions and 37 deletions
Download Patch File Download Diff File Expand all files Collapse all files

72
demos/sankey.html
View File

@@ -1,23 +1,22 @@
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/html">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<title>States Mermaid Quick Test Page</title>
<link rel="icon" type="image/png" href="data:image/png;base64,iVBORw0KGgo=" />
<style>
div.mermaid {
/* font-family: 'trebuchet ms', verdana, arial; */
font-family: 'Courier New', Courier, monospace !important;
}
</style>
</head>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<title>States Mermaid Quick Test Page</title>
<link rel="icon" type="image/png" href="data:image/png;base64,iVBORw0KGgo=" />
<style>
div.mermaid {
/* font-family: 'trebuchet ms', verdana, arial; */
font-family: 'Courier New', Courier, monospace !important;
}
</style>
</head>
<body>
<h1>Sankey diagram demos</h1>
<h2>Simple example</h2>
<pre class="mermaid">
<body>
<h1>Sankey diagram demos</h1>
<h2>Simple example</h2>
<pre class="mermaid">
sankey
node[title="hello, how are you?"]
@@ -26,11 +25,12 @@
First -> 30 -> Second
First -> 10 -> Third
Second -> 20 -> Third
</pre>
<!-- node[title="hello, mister "sankey", backslash for you "] -->
</pre
>
<!-- node[title="hello, mister "sankey", backslash for you "] -->
<h2>Energy flow</h2>
<pre class="mermaid">
<h2>Energy flow</h2>
<pre class="mermaid">
sankey
"Agricultural 'waste'" -> 124.729 -> "Bio-conversion"
@@ -101,19 +101,19 @@
"UK land based bioenergy" -> 182.01 -> "Bio-conversion"
"Wave" -> 19.013 -> "Electricity grid"
"Wind" -> 289.366 -> "Electricity grid"
</pre>
</pre
>
<script type="module">
import mermaid from './mermaid.esm.mjs';
mermaid.initialize({
theme: 'default',
logLevel: 3,
securityLevel: 'loose',
flowchart: { curve: 'basis' },
gantt: { axisFormat: '%m/%d/%Y' },
sequence: { actorMargin: 50 },
});
</script>
</body>
</html>
<script type="module">
import mermaid from './mermaid.esm.mjs';
mermaid.initialize({
theme: 'default',
logLevel: 3,
securityLevel: 'loose',
flowchart: { curve: 'basis' },
gantt: { axisFormat: '%m/%d/%Y' },
sequence: { actorMargin: 50 },
});
</script>
</body>
</html>