Skip to content
Snippets Groups Projects
Commit e450e18d authored by gastentwickler's avatar gastentwickler
Browse files

Update VisB Visualization for Jars (by Jonas Erdmann)

parent 99b0b1d4
No related branches found
No related tags found
No related merge requests found
Show whitespace changes
Inline Side-by-side
Jars/Jars.json
+ 52
− 2
View file @ e450e18d
......@@ -2,16 +2,66 @@
"svg":"Jars.svg",
"items": [
{
"id": "rect_3",
"id": "jar_3_full",
"attr": "height",
"value": "level(j3) * 20"
},
{
"id": "rect_5",
"id": "jar_3_svg",
"attr": "height",
"value": "maxf(j3) * 20"
},
{
"id": "jar_3_svg",
"attr": "y",
"value": "0 -(max({maxf(j3), maxf(j5)}) * 20 - 100)"
},
{
"id": "jar_3_empty",
"attr": "height",
"value": "maxf(j3) * 20"
},
{
"id": "left_3",
"attr": "y2",
"value": "maxf(j3) * 20"
},
{
"id": "right_3",
"attr": "y2",
"value": "maxf(j3) * 20"
},
{
"id": "jar_5_full",
"attr": "height",
"value": "level(j5) * 20"
},
{
"id": "jar_5_svg",
"attr": "height",
"value": "maxf(j5) * 20"
},
{
"id": "jar_5_svg",
"attr": "y",
"value": "0 -(max({maxf(j3), maxf(j5)}) * 20 - 100)"
},
{
"id": "jar_5_empty",
"attr": "height",
"value": "maxf(j5) * 20"
},
{
"id": "left_5",
"attr": "y2",
"value": "maxf(j5) * 20"
},
{
"id": "right_5",
"attr": "y2",
"value": "maxf(j5) * 20"
}
],
"events": [
......
Jars/Jars.mch
+ 1
− 2
View file @ e450e18d
......@@ -45,4 +45,3 @@ OPERATIONS
level := level <+ { j1|-> level(j1)-amount, j2 |-> level(j2)+amount }
END
END
\ No newline at end of file
Jars/Jars.svg
+ 28
− 19
View file @ e450e18d
<svg width="360" height="360"
xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="jar_3" transform="rotate(180 25 100)">
<svg width="50" height="60" X="0" y="100">
<svg id ="jar_3_svg" width="50" height="60" X="0" y="00">
<g id="leer_3" opacity="1">
<rect x="0" y="0" width="50" height="60" style="fill:#DDEEFF"/>
<rect id="rect_3" x="0" y="0" width="50" height="60" style="fill:#0000FF"/>
<rect id="jar_3_empty" x="0" y="0" width="50" height="60" style="fill:#DDEEFF"/>
<rect id="jar_3_full" x="0" y="0" width="50" height="60" style="fill:#267CEB"/>
<line id="left_3" x1="50" y1="0" x2="50" y2="60" style="stroke:#000000;stroke-width:4"/>
<line id="right_3" x1="0" y1="0" x2="0" y2="60" style="stroke:#000000;stroke-width:4"/>
<line x1="50" y1="0" x2="0" y2="0" style="stroke:#000000;stroke-width:4"/>
</svg>
</g>
<g id="jar_5" transform="rotate(180 130 100)">
<svg width="50" height="100" X="105" y="100">
<svg id="jar_5_svg" width="50" height="100" x="105" y="0">
<g id="leer_5" opacity="1" >
<rect x="0" y="0" width="50" height="100" style="fill:#DDEEFF"/>
<rect id ="rect_5" x="0" y="0" width="50" height="100" style="fill:#0000FF"/>
<rect id="jar_5_empty"x="0" y="0" width="50" height="100" style="fill:#DDEEFF"/>
<rect id ="jar_5_full" x="0" y="0" width="50" height="100" style="fill:#267CEB"/>
<line id="left_5" x1="50" y1="0" x2="50" y2="100" style="stroke:#000000;stroke-width:4"/>
<line id="right_5" x1="0" y1="0" x2="0" y2="100" style="stroke:#000000;stroke-width:4"/>
<line x1="50" y1="0" x2="0" y2="0" style="stroke:#000000;stroke-width:4"/>
</svg>
</g>
<circle id="fill_3" cx="25" cy="125" r="15" fill="#7799FF"/>
<rect id="fill_3_sym" x="20" y="120" width="10" height="12" style="fill:#0000FF"/>
<circle id="fill_5" cx="130" cy="125" r="15" fill="#7799FF"/>
<rect id="fill_5_sym"x="125" y="120" width="10" height="12" style="fill:#0000FF"/>
<circle id="empty_3" cx="25" cy="165" r="15" fill="#7799FF"/>
<rect id="empty_3_sym" x="20" y="160" width="10" height="12" style="fill:#DDDDFF"/>
<circle id="empty_5" cx="130" cy="165" r="15" fill="#7799FF"/>
<rect id="empty_5_sym" x="125" y="160" width="10" height="12" style="fill:#DDDDFF"/>
<circle id="transfer" cx="77.5" cy="145" r="15" fill="#7799FF"/>
<polyline id="transfer_sym1" points="70,145 76,141 76,149" fill="#00000"/>
<polyline id="transfer_sym2" points="85,145 79,141 79,149" fill="#00000"/>
<rect id="transfer_sym3" x="76" y="143.5" height="3" width="3"/>
<circle id="fill_3" cx="25" cy="25" r="15" fill="#BBBBBB"/>
<rect id="fill_3_sym" x="20" y="20" width="10" height="12" style="fill:#267CEB"/>
<circle id="fill_5" cx="130" cy="25" r="15" fill="#BBBBBB"/>
<rect id="fill_5_sym"x="125" y="20" width="10" height="12" style="fill:#267CEB"/>
<circle id="empty_3" cx="25" cy="65" r="15" fill="#BBBBBB"/>
<rect id="empty_3_sym" x="20" y="60" width="10" height="12" style="fill:#DDEEFF"/>
<circle id="empty_5" cx="130" cy="65" r="15" fill="#BBBBBB"/>
<rect id="empty_5_sym" x="125" y="60" width="10" height="12" style="fill:#DDEEFF"/>
<circle id="transfer" cx="77.5" cy="45" r="15" fill="#BBBBBB"/>
<polyline id="transfer_sym1" points="70,45 76,41 76,49" fill="#00000"/>
<polyline id="transfer_sym2" points="85,45 79,41 79,49" fill="#00000"/>
<rect id="transfer_sym3" x="76" y="43.5" height="3" width="3"/>
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment