more realistic organigram
This commit is contained in:
@@ -113,6 +113,7 @@
|
|||||||
left: 0;
|
left: 0;
|
||||||
width: 99%;
|
width: 99%;
|
||||||
background: black;
|
background: black;
|
||||||
|
clip-path: polygon( 0% 100%, 100% 100%, 100% 50%, 0% 50%);
|
||||||
}
|
}
|
||||||
.bzgf-node[data-nodetype="database"] [data-direction="n"]{ top: -17px; }
|
.bzgf-node[data-nodetype="database"] [data-direction="n"]{ top: -17px; }
|
||||||
.bzgf-node[data-nodetype="database"] [data-direction="s"]{ bottom: -17px; }
|
.bzgf-node[data-nodetype="database"] [data-direction="s"]{ bottom: -17px; }
|
||||||
@@ -175,14 +176,14 @@
|
|||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div class="bzgf-node" data-nodetype="start">
|
<div class="bzgf-node" data-nodetype="start">
|
||||||
<div class="text"></div>
|
<div class="text">{text}</div>
|
||||||
<div class="port" data-id="out1" data-direction="s"></div>
|
<div class="port" data-id="out1" data-direction="s"></div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div class="bzgf-node" data-nodetype="end">
|
<div class="bzgf-node" data-nodetype="end">
|
||||||
<div class="text"></div>
|
<div class="text">{text}</div>
|
||||||
<div class="port" data-id="inp1" data-direction="n"></div>
|
<div class="port" data-id="inp1" data-direction="n"></div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
@@ -190,7 +191,7 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="bzgf-node" data-nodetype="condition">
|
<div class="bzgf-node" data-nodetype="condition">
|
||||||
<div class="frame"></div>
|
<div class="frame"></div>
|
||||||
<div class="text"></div>
|
<div class="text">{text}</div>
|
||||||
<div class="port" data-id="inp1" data-direction="n"></div>
|
<div class="port" data-id="inp1" data-direction="n"></div>
|
||||||
<div class="port" data-id="out1" data-direction="w"></div>
|
<div class="port" data-id="out1" data-direction="w"></div>
|
||||||
<div class="port" data-id="out2" data-direction="s"></div>
|
<div class="port" data-id="out2" data-direction="s"></div>
|
||||||
@@ -201,7 +202,7 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="bzgf-node" data-nodetype="process">
|
<div class="bzgf-node" data-nodetype="process">
|
||||||
<div class="dbline"></div>
|
<div class="dbline"></div>
|
||||||
<div class="text"></div>
|
<div class="text">{text}</div>
|
||||||
<div class="port" data-id="inout1" data-direction="n"></div>
|
<div class="port" data-id="inout1" data-direction="n"></div>
|
||||||
<div class="port" data-id="inout2" data-direction="s"></div>
|
<div class="port" data-id="inout2" data-direction="s"></div>
|
||||||
<div class="port" data-id="inout3" data-direction="w"></div>
|
<div class="port" data-id="inout3" data-direction="w"></div>
|
||||||
@@ -213,7 +214,7 @@
|
|||||||
<div class="bzgf-node" data-nodetype="database">
|
<div class="bzgf-node" data-nodetype="database">
|
||||||
<div class="top"></div>
|
<div class="top"></div>
|
||||||
<div class="bottom"></div>
|
<div class="bottom"></div>
|
||||||
<div class="text"></div>
|
<div class="text">{text}</div>
|
||||||
<div class="port" data-id="inout1" data-direction="n"></div>
|
<div class="port" data-id="inout1" data-direction="n"></div>
|
||||||
<div class="port" data-id="inout2" data-direction="s"></div>
|
<div class="port" data-id="inout2" data-direction="s"></div>
|
||||||
<div class="port" data-id="inout3" data-direction="w"></div>
|
<div class="port" data-id="inout3" data-direction="w"></div>
|
||||||
@@ -225,7 +226,7 @@
|
|||||||
<div class="bzgf-node" data-nodetype="preparation">
|
<div class="bzgf-node" data-nodetype="preparation">
|
||||||
<div class="outerframe">
|
<div class="outerframe">
|
||||||
<div class="innerframe">
|
<div class="innerframe">
|
||||||
<div class="text"></div>
|
<div class="text">{text}</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="port" data-id="inp1" data-direction="n"></div>
|
<div class="port" data-id="inp1" data-direction="n"></div>
|
||||||
|
|||||||
@@ -4,27 +4,33 @@
|
|||||||
"nodes":[
|
"nodes":[
|
||||||
{ "nodeType": "start",
|
{ "nodeType": "start",
|
||||||
"id": "aze",
|
"id": "aze",
|
||||||
"coords": { "x": 220, "y": 20}
|
"coords": { "x": 220, "y": 20},
|
||||||
|
"markup": { "text": "Start" }
|
||||||
},
|
},
|
||||||
{ "nodeType": "process",
|
{ "nodeType": "process",
|
||||||
"id": "aze2",
|
"id": "aze2",
|
||||||
"coords": { "x": 220, "y": 120}
|
"coords": { "x": 220, "y": 120},
|
||||||
|
"markup": { "text": "x = alph - 1" }
|
||||||
},
|
},
|
||||||
{ "nodeType": "condition",
|
{ "nodeType": "condition",
|
||||||
"id": "qsd",
|
"id": "qsd",
|
||||||
"coords": { "x": 250, "y": 270}
|
"coords": { "x": 250, "y": 270},
|
||||||
|
"markup": { "text": "x > 0" }
|
||||||
},
|
},
|
||||||
{ "nodeType": "preparation",
|
{ "nodeType": "preparation",
|
||||||
"id": "qsd2",
|
"id": "qsd2",
|
||||||
"coords": { "x": 250, "y": 470}
|
"coords": { "x": 250, "y": 470},
|
||||||
|
"markup": { "text": "prepare SQL" }
|
||||||
},
|
},
|
||||||
{ "nodeType": "database",
|
{ "nodeType": "database",
|
||||||
"id": "wcx",
|
"id": "wcx",
|
||||||
"coords": { "x": 500, "y": 450}
|
"coords": { "x": 500, "y": 450},
|
||||||
|
"markup": { "text": "MySQL<br>Store" }
|
||||||
},
|
},
|
||||||
{ "nodeType": "end",
|
{ "nodeType": "end",
|
||||||
"id": "ert",
|
"id": "ert",
|
||||||
"coords": { "x": 250, "y": 650}
|
"coords": { "x": 250, "y": 650},
|
||||||
|
"markup": { "text": "End" }
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
"links": [
|
"links": [
|
||||||
|
|||||||
Reference in New Issue
Block a user