diff options
| author | Sébastien Dailly <sebastien@chimrod.com> | 2020-12-06 15:34:55 +0100 |
|---|---|---|
| committer | Sébastien Dailly <sebastien@chimrod.com> | 2020-12-06 15:34:55 +0100 |
| commit | 536bb26052fa4ada16d9d09a6cc140a4d3293af8 (patch) | |
| tree | bfbe7029b4c4c2878704e2d15a379c38c574012e /content/pages/graph-editor.html | |
| parent | 33f81148be6699fe05760793784b5bab36245481 (diff) | |
New article on graphviz in the browser
Diffstat (limited to 'content/pages/graph-editor.html')
| -rwxr-xr-x | content/pages/graph-editor.html | 74 |
1 files changed, 74 insertions, 0 deletions
diff --git a/content/pages/graph-editor.html b/content/pages/graph-editor.html new file mode 100755 index 0000000..b9d1731 --- /dev/null +++ b/content/pages/graph-editor.html @@ -0,0 +1,74 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8"> + <meta name="status" content="hidden" /> + <title>Graph editor</title> + </head> + <body> + <style> + + #app { + width: 100%; + height: 100%; + overflow: hidden; + } + + #panes { + display: flex; + width: 100%; + } + + #graph { + flex: 1; + width: 50%; + } + + + #editor { + border-right: 1px solid #ccc; + flex: 1; + } + + #output svg { top: 0; left: 0; width: 100%; height: 100%; } + + </style> + + <div id="app"> + <button id="dot_output">Export DOT</button> + <button id="png_output">Export PNG</button> + <button id="btn_window">Isoler</button> + <div id="panes" class="split split-horizontal"> + <textarea id="editor">g1 + Nom + - + propriété 1 <-> g2:2 + propriété 2 + +g2 + Autre + - + propriété 1 + encore une autre <i>entrée</i> + autre champ -> g1:3 retour + +g3 + Dernier élément + - + ligne 2 + ligne 3</textarea> + <div id="graph" class="split"> + <div id="output"> + <div id="svg"></div> + </div> + </div> + </div> + </div> + + <script src="{static}/resources/viz.js/viz.js"></script> + <script src="{static}/resources/viz.js/full.render.js"></script> + <script src="{static}/resources/viz.js/download.js"></script> + <script src="{static}/resources/viz.js/convert.js"></script> + </body> +</html> + |