Merge pull request #880 from gavin-ts/adjust-dagre-edge-for-container-label

dagre: stop container edges at container label
This commit is contained in:
gavin-ts 2023-02-23 14:48:53 -08:00 committed by GitHub
commit 1a27dee9c8
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
17 changed files with 1686 additions and 13 deletions

View file

@ -17,6 +17,7 @@ Sketch mode's subtle hand-drawn texture adapts to background colors.
- CLI reports when a feature is incompatible with layout engine, instead of silently ignoring. [#845](https://github.com/terrastruct/d2/pull/845)
- `near` key set to direct parent or ancestor throws an appropriate error message. [#851](https://github.com/terrastruct/d2/pull/851)
- Dimensions and positions are able to be set from API. [#853](https://github.com/terrastruct/d2/pull/853)
- Improves label legibility for dagre containers by stopping container edges early if they would run into the label. [#880](https://github.com/terrastruct/d2/pull/880)
#### Bugfixes ⛑️

View file

@ -425,7 +425,36 @@ func Layout(ctx context.Context, g *d2graph.Graph, opts *ConfigurableOpts) (err
// trace the edge to the specific shape's border
points[startIndex] = shape.TraceToShapeBorder(srcShape, start, points[startIndex+1])
points[endIndex] = shape.TraceToShapeBorder(dstShape, end, points[endIndex-1])
// if an edge to a container runs into its label, stop the edge at the label instead
overlapsContainerLabel := false
if edge.Dst.IsContainer() && edge.Dst.Attributes.Label.Value != "" {
// assumes LabelPosition, LabelWidth, LabelHeight are all set if there is a label
labelWidth := float64(*edge.Dst.LabelWidth)
labelHeight := float64(*edge.Dst.LabelHeight)
labelTL := label.Position(*edge.Dst.LabelPosition).
GetPointOnBox(edge.Dst.Box, label.PADDING, labelWidth, labelHeight)
endingSegment := geo.Segment{Start: points[endIndex-1], End: points[endIndex]}
labelBox := geo.NewBox(labelTL, labelWidth, labelHeight)
// add left/right padding to box
labelBox.TopLeft.X -= label.PADDING
labelBox.Width += 2 * label.PADDING
if intersections := labelBox.Intersections(endingSegment); len(intersections) > 0 {
overlapsContainerLabel = true
// move ending segment to label intersection point
points[endIndex] = intersections[0]
endingSegment.End = intersections[0]
// if the segment becomes too short, just merge it with the previous segment
if endIndex-1 > 0 && endingSegment.Length() < MIN_SEGMENT_LEN {
points[endIndex-1] = points[endIndex]
endIndex--
}
}
}
if !overlapsContainerLabel {
points[endIndex] = shape.TraceToShapeBorder(dstShape, end, points[endIndex-1])
}
points = points[startIndex : endIndex+1]
// build a curved path from the dagre route

View file

@ -333,11 +333,11 @@
},
{
"x": 179,
"y": 326.4
"y": 248
},
{
"x": 179,
"y": 356
"y": 320
}
],
"isCurve": true,

View file

@ -51,7 +51,7 @@
svgEl.setAttribute("height", height * ratio - 16);
}
});
]]></script><g id="a"><g class="shape" ><rect x="0.000000" y="41.000000" width="358.000000" height="487.000000" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="179.000000" y="28.000000" class="text fill-N1" style="text-anchor:middle;font-size:28px">a</text></g><g id="a.b"><g class="shape" ><rect x="40.000000" y="75.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="66.500000" y="113.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">b</text></g><g id="a.c"><g class="shape" ><rect x="23.000000" y="355.000000" width="298.000000" height="139.000000" stroke="white" class=" fill-B5" style="stroke-width:2;" /></g><text x="172.000000" y="343.000000" class="text fill-N1" style="text-anchor:middle;font-size:24px">c</text></g><g id="a.1"><g class="shape" ><rect x="153.000000" y="75.000000" width="52.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="179.000000" y="113.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">1</text></g><g id="a.2"><g class="shape" ><rect x="265.000000" y="75.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="291.500000" y="113.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">2</text></g><g id="a.c.d"><g class="shape" ><rect x="152.000000" y="391.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="179.000000" y="429.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">d</text></g><g id="a.(b -&gt; c)[0]"><marker id="mk-1065319532" markerWidth="24.200000" markerHeight="18.000000" refX="20.800000" refY="9.000000" viewBox="0.000000 0.000000 24.200000 18.000000" orient="auto" markerUnits="userSpaceOnUse"> <polygon points="0.000000,9.000000 11.000000,2.250000 22.000000,9.000000 11.000000,16.200000" stroke="red" class="connection fill-N7" stroke-width="2" /> </marker><path d="M 66.500000 144.000000 C 66.500000 212.400000 66.700000 326.400000 67.391931 352.001460" stroke="red" fill="none" class="connection" style="stroke-width:2;" marker-end="url(#mk-1065319532)" mask="url(#1797289791)" /><text x="67.000000" y="231.000000" fill="red" class="text-italic" style="text-anchor:middle;font-size:16px"><tspan x="67.000000" dy="0.000000">line 1</tspan><tspan x="67.000000" dy="17.250000">line 2</tspan><tspan x="67.000000" dy="17.250000">line 3</tspan><tspan x="67.000000" dy="17.250000">line 4</tspan></text></g><g id="a.(1 -&gt; c)[0]"><marker id="mk-3488378134" markerWidth="10.000000" markerHeight="12.000000" refX="7.000000" refY="6.000000" viewBox="0.000000 0.000000 10.000000 12.000000" orient="auto" markerUnits="userSpaceOnUse"> <polygon points="0.000000,0.000000 10.000000,6.000000 0.000000,12.000000" class="connection fill-B1" stroke-width="2" /> </marker><path d="M 179.000000 144.000000 C 179.000000 212.400000 179.000000 326.400000 179.000000 352.000000" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-3488378134)" mask="url(#1797289791)" /></g><g id="a.(2 &lt;-&gt; c)[0]"><marker id="mk-2451250203" markerWidth="10.000000" markerHeight="12.000000" refX="3.000000" refY="6.000000" viewBox="0.000000 0.000000 10.000000 12.000000" orient="auto" markerUnits="userSpaceOnUse"> <polygon points="10.000000,0.000000 0.000000,6.000000 10.000000,12.000000" class="connection fill-B1" stroke-width="2" /> </marker><path d="M 291.500000 146.000000 C 291.500000 212.400000 291.300000 326.400000 290.608069 352.001460" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-start="url(#mk-2451250203)" marker-end="url(#mk-3488378134)" mask="url(#1797289791)" /></g><mask id="1797289791" maskUnits="userSpaceOnUse" x="-2" y="0" width="362" height="530">
]]></script><g id="a"><g class="shape" ><rect x="0.000000" y="41.000000" width="358.000000" height="487.000000" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="179.000000" y="28.000000" class="text fill-N1" style="text-anchor:middle;font-size:28px">a</text></g><g id="a.b"><g class="shape" ><rect x="40.000000" y="75.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="66.500000" y="113.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">b</text></g><g id="a.c"><g class="shape" ><rect x="23.000000" y="355.000000" width="298.000000" height="139.000000" stroke="white" class=" fill-B5" style="stroke-width:2;" /></g><text x="172.000000" y="343.000000" class="text fill-N1" style="text-anchor:middle;font-size:24px">c</text></g><g id="a.1"><g class="shape" ><rect x="153.000000" y="75.000000" width="52.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="179.000000" y="113.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">1</text></g><g id="a.2"><g class="shape" ><rect x="265.000000" y="75.000000" width="53.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="291.500000" y="113.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">2</text></g><g id="a.c.d"><g class="shape" ><rect x="152.000000" y="391.000000" width="54.000000" height="66.000000" class=" stroke-B1 fill-B6" style="stroke-width:2;" /></g><text x="179.000000" y="429.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">d</text></g><g id="a.(b -&gt; c)[0]"><marker id="mk-1065319532" markerWidth="24.200000" markerHeight="18.000000" refX="20.800000" refY="9.000000" viewBox="0.000000 0.000000 24.200000 18.000000" orient="auto" markerUnits="userSpaceOnUse"> <polygon points="0.000000,9.000000 11.000000,2.250000 22.000000,9.000000 11.000000,16.200000" stroke="red" class="connection fill-N7" stroke-width="2" /> </marker><path d="M 66.500000 144.000000 C 66.500000 212.400000 66.700000 326.400000 67.391931 352.001460" stroke="red" fill="none" class="connection" style="stroke-width:2;" marker-end="url(#mk-1065319532)" mask="url(#3264091923)" /><text x="67.000000" y="231.000000" fill="red" class="text-italic" style="text-anchor:middle;font-size:16px"><tspan x="67.000000" dy="0.000000">line 1</tspan><tspan x="67.000000" dy="17.250000">line 2</tspan><tspan x="67.000000" dy="17.250000">line 3</tspan><tspan x="67.000000" dy="17.250000">line 4</tspan></text></g><g id="a.(1 -&gt; c)[0]"><marker id="mk-3488378134" markerWidth="10.000000" markerHeight="12.000000" refX="7.000000" refY="6.000000" viewBox="0.000000 0.000000 10.000000 12.000000" orient="auto" markerUnits="userSpaceOnUse"> <polygon points="0.000000,0.000000 10.000000,6.000000 0.000000,12.000000" class="connection fill-B1" stroke-width="2" /> </marker><path d="M 179.000000 144.000000 C 179.000000 212.400000 179.000000 248.000000 179.000000 316.000000" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-3488378134)" mask="url(#3264091923)" /></g><g id="a.(2 &lt;-&gt; c)[0]"><marker id="mk-2451250203" markerWidth="10.000000" markerHeight="12.000000" refX="3.000000" refY="6.000000" viewBox="0.000000 0.000000 10.000000 12.000000" orient="auto" markerUnits="userSpaceOnUse"> <polygon points="10.000000,0.000000 0.000000,6.000000 10.000000,12.000000" class="connection fill-B1" stroke-width="2" /> </marker><path d="M 291.500000 146.000000 C 291.500000 212.400000 291.300000 326.400000 290.608069 352.001460" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-start="url(#mk-2451250203)" marker-end="url(#mk-3488378134)" mask="url(#3264091923)" /></g><mask id="3264091923" maskUnits="userSpaceOnUse" x="-2" y="0" width="362" height="530">
<rect x="-2" y="0" width="362" height="530" fill="white"></rect>
<rect x="49.000000" y="215.000000" width="36" height="69" fill="black"></rect>
</mask></svg>

Before

Width:  |  Height:  |  Size: 798 KiB

After

Width:  |  Height:  |  Size: 798 KiB

View file

@ -545,11 +545,11 @@
},
{
"x": 217,
"y": 246.9
"y": 238.7
},
{
"x": 217,
"y": 328.5
"y": 287.5
}
],
"isCurve": true,

View file

@ -51,10 +51,10 @@
svgEl.setAttribute("height", height * ratio - 16);
}
});
]]></script><g id="k8s"><g class="shape" ><rect x="0.000000" y="41.000000" width="1221.000000" height="125.000000" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="610.500000" y="28.000000" class="text fill-N1" style="text-anchor:middle;font-size:28px">Kubernetes</text></g><g id="osvc"><g class="shape" ><rect x="0.000000" y="328.000000" width="395.000000" height="125.000000" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="197.500000" y="315.000000" class="text fill-N1" style="text-anchor:middle;font-size:28px">opensvc</text></g><g id="k8s.m1"><g class="shape" ><rect x="86.000000" y="70.000000" width="132.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="152.000000" y="108.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">k8s-master1</text></g><g id="k8s.m2"><g class="shape" ><rect x="278.000000" y="70.000000" width="132.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="344.000000" y="108.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">k8s-master2</text></g><g id="k8s.m3"><g class="shape" ><rect x="470.000000" y="70.000000" width="132.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="536.000000" y="108.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">k8s-master3</text></g><g id="k8s.w1"><g class="shape" ><rect x="662.000000" y="70.000000" width="133.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="728.500000" y="108.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">k8s-worker1</text></g><g id="k8s.w2"><g class="shape" ><rect x="855.000000" y="70.000000" width="133.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="921.500000" y="108.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">k8s-worker2</text></g><g id="k8s.w3"><g class="shape" ><rect x="1048.000000" y="70.000000" width="133.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="1114.500000" y="108.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">k8s-worker3</text></g><g id="osvc.vm1"><g class="shape" ><rect x="131.000000" y="357.000000" width="76.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="169.000000" y="395.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">VM1</text></g><g id="osvc.vm2"><g class="shape" ><rect x="279.000000" y="357.000000" width="76.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="317.000000" y="395.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">VM2</text></g><g id="(k8s -&gt; osvc)[0]"><marker id="mk-3488378134" markerWidth="10.000000" markerHeight="12.000000" refX="7.000000" refY="6.000000" viewBox="0.000000 0.000000 10.000000 12.000000" orient="auto" markerUnits="userSpaceOnUse"> <polygon points="0.000000,0.000000 10.000000,6.000000 0.000000,12.000000" class="connection fill-B1" stroke-width="2" /> </marker><path d="M 59.000000 168.000000 C 59.000000 214.400000 59.000000 246.900000 59.000000 324.500000" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-3488378134)" mask="url(#3019279932)" /><text x="59.500000" y="253.000000" class="text-italic fill-N2" style="text-anchor:middle;font-size:16px">keycloak</text></g><g id="(k8s -&gt; osvc)[1]"><path d="M 141.000000 168.000000 C 141.000000 214.400000 141.000000 246.900000 141.000000 324.500000" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-3488378134)" mask="url(#3019279932)" /><text x="141.500000" y="253.000000" class="text-italic fill-N2" style="text-anchor:middle;font-size:16px">heptapod</text></g><g id="(k8s -&gt; osvc)[2]"><path d="M 217.000000 168.000000 C 217.000000 214.400000 217.000000 246.900000 217.000000 324.500000" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-3488378134)" mask="url(#3019279932)" /><text x="217.500000" y="253.000000" class="text-italic fill-N2" style="text-anchor:middle;font-size:16px">harbor</text></g><g id="(k8s -&gt; osvc)[3]"><path d="M 278.000000 168.000000 C 278.000000 214.400000 278.000000 246.900000 278.000000 324.500000" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-3488378134)" mask="url(#3019279932)" /><text x="278.500000" y="253.000000" class="text-italic fill-N2" style="text-anchor:middle;font-size:16px">vault</text></g><mask id="3019279932" maskUnits="userSpaceOnUse" x="-2" y="0" width="1225" height="455">
]]></script><g id="k8s"><g class="shape" ><rect x="0.000000" y="41.000000" width="1221.000000" height="125.000000" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="610.500000" y="28.000000" class="text fill-N1" style="text-anchor:middle;font-size:28px">Kubernetes</text></g><g id="osvc"><g class="shape" ><rect x="0.000000" y="328.000000" width="395.000000" height="125.000000" class=" stroke-B1 fill-B4" style="stroke-width:2;" /></g><text x="197.500000" y="315.000000" class="text fill-N1" style="text-anchor:middle;font-size:28px">opensvc</text></g><g id="k8s.m1"><g class="shape" ><rect x="86.000000" y="70.000000" width="132.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="152.000000" y="108.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">k8s-master1</text></g><g id="k8s.m2"><g class="shape" ><rect x="278.000000" y="70.000000" width="132.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="344.000000" y="108.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">k8s-master2</text></g><g id="k8s.m3"><g class="shape" ><rect x="470.000000" y="70.000000" width="132.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="536.000000" y="108.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">k8s-master3</text></g><g id="k8s.w1"><g class="shape" ><rect x="662.000000" y="70.000000" width="133.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="728.500000" y="108.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">k8s-worker1</text></g><g id="k8s.w2"><g class="shape" ><rect x="855.000000" y="70.000000" width="133.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="921.500000" y="108.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">k8s-worker2</text></g><g id="k8s.w3"><g class="shape" ><rect x="1048.000000" y="70.000000" width="133.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="1114.500000" y="108.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">k8s-worker3</text></g><g id="osvc.vm1"><g class="shape" ><rect x="131.000000" y="357.000000" width="76.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="169.000000" y="395.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">VM1</text></g><g id="osvc.vm2"><g class="shape" ><rect x="279.000000" y="357.000000" width="76.000000" height="66.000000" class=" stroke-B1 fill-B5" style="stroke-width:2;" /></g><text x="317.000000" y="395.500000" class="text-bold fill-N1" style="text-anchor:middle;font-size:16px">VM2</text></g><g id="(k8s -&gt; osvc)[0]"><marker id="mk-3488378134" markerWidth="10.000000" markerHeight="12.000000" refX="7.000000" refY="6.000000" viewBox="0.000000 0.000000 10.000000 12.000000" orient="auto" markerUnits="userSpaceOnUse"> <polygon points="0.000000,0.000000 10.000000,6.000000 0.000000,12.000000" class="connection fill-B1" stroke-width="2" /> </marker><path d="M 59.000000 168.000000 C 59.000000 214.400000 59.000000 246.900000 59.000000 324.500000" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-3488378134)" mask="url(#2370069283)" /><text x="59.500000" y="253.000000" class="text-italic fill-N2" style="text-anchor:middle;font-size:16px">keycloak</text></g><g id="(k8s -&gt; osvc)[1]"><path d="M 141.000000 168.000000 C 141.000000 214.400000 141.000000 246.900000 141.000000 324.500000" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-3488378134)" mask="url(#2370069283)" /><text x="141.500000" y="253.000000" class="text-italic fill-N2" style="text-anchor:middle;font-size:16px">heptapod</text></g><g id="(k8s -&gt; osvc)[2]"><path d="M 217.000000 168.000000 C 217.000000 214.400000 217.000000 238.700000 217.000000 283.500000" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-3488378134)" mask="url(#2370069283)" /><text x="217.500000" y="232.000000" class="text-italic fill-N2" style="text-anchor:middle;font-size:16px">harbor</text></g><g id="(k8s -&gt; osvc)[3]"><path d="M 278.000000 168.000000 C 278.000000 214.400000 278.000000 246.900000 278.000000 324.500000" fill="none" class="connection stroke-B1" style="stroke-width:2;" marker-end="url(#mk-3488378134)" mask="url(#2370069283)" /><text x="278.500000" y="253.000000" class="text-italic fill-N2" style="text-anchor:middle;font-size:16px">vault</text></g><mask id="2370069283" maskUnits="userSpaceOnUse" x="-2" y="0" width="1225" height="455">
<rect x="-2" y="0" width="1225" height="455" fill="white"></rect>
<rect x="30.000000" y="237.000000" width="59" height="21" fill="black"></rect>
<rect x="109.000000" y="237.000000" width="65" height="21" fill="black"></rect>
<rect x="194.000000" y="237.000000" width="47" height="21" fill="black"></rect>
<rect x="194.000000" y="216.000000" width="47" height="21" fill="black"></rect>
<rect x="261.000000" y="237.000000" width="35" height="21" fill="black"></rect>
</mask></svg>

Before

Width:  |  Height:  |  Size: 799 KiB

After

Width:  |  Height:  |  Size: 799 KiB

View file

@ -654,11 +654,11 @@
},
{
"x": 140.25,
"y": 134.2
"y": 126
},
{
"x": 140.25,
"y": 207
"y": 166
}
],
"isCurve": true,
@ -837,11 +837,11 @@
},
{
"x": 97,
"y": 369.7
"y": 362.5
},
{
"x": 97,
"y": 438.5
"y": 402.5
}
],
"isCurve": true,

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 659 KiB

After

Width:  |  Height:  |  Size: 659 KiB

View file

@ -0,0 +1,535 @@
{
"name": "",
"fontFamily": "SourceSansPro",
"shapes": [
{
"id": "a",
"type": "rectangle",
"pos": {
"x": 14,
"y": 0
},
"width": 53,
"height": 66,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
"borderRadius": 0,
"fill": "B6",
"stroke": "B1",
"shadow": false,
"3d": false,
"multiple": false,
"double-border": false,
"tooltip": "",
"link": "",
"icon": null,
"iconPosition": "",
"blend": false,
"fields": null,
"methods": null,
"columns": null,
"label": "a",
"fontSize": 16,
"fontFamily": "DEFAULT",
"language": "",
"color": "N1",
"italic": false,
"bold": true,
"underline": false,
"labelWidth": 8,
"labelHeight": 21,
"labelPosition": "INSIDE_MIDDLE_CENTER",
"zIndex": 0,
"level": 1
},
{
"id": "b",
"type": "cloud",
"pos": {
"x": 0,
"y": 207
},
"width": 397,
"height": 125,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
"borderRadius": 0,
"fill": "N7",
"stroke": "B1",
"shadow": false,
"3d": false,
"multiple": false,
"double-border": false,
"tooltip": "",
"link": "",
"icon": null,
"iconPosition": "",
"blend": false,
"fields": null,
"methods": null,
"columns": null,
"label": "a container label",
"fontSize": 28,
"fontFamily": "DEFAULT",
"language": "",
"color": "N1",
"italic": false,
"bold": false,
"underline": false,
"labelWidth": 195,
"labelHeight": 36,
"labelPosition": "OUTSIDE_TOP_CENTER",
"zIndex": 0,
"level": 1
},
{
"id": "b.c",
"type": "rectangle",
"pos": {
"x": 183,
"y": 236
},
"width": 53,
"height": 66,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
"borderRadius": 0,
"fill": "B5",
"stroke": "B1",
"shadow": false,
"3d": false,
"multiple": false,
"double-border": false,
"tooltip": "",
"link": "",
"icon": null,
"iconPosition": "",
"blend": false,
"fields": null,
"methods": null,
"columns": null,
"label": "c",
"fontSize": 16,
"fontFamily": "DEFAULT",
"language": "",
"color": "N1",
"italic": false,
"bold": true,
"underline": false,
"labelWidth": 8,
"labelHeight": 21,
"labelPosition": "INSIDE_MIDDLE_CENTER",
"zIndex": 0,
"level": 2
},
{
"id": "d",
"type": "rectangle",
"pos": {
"x": 182,
"y": 432
},
"width": 54,
"height": 66,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
"borderRadius": 0,
"fill": "B6",
"stroke": "B1",
"shadow": false,
"3d": false,
"multiple": false,
"double-border": false,
"tooltip": "",
"link": "",
"icon": null,
"iconPosition": "",
"blend": false,
"fields": null,
"methods": null,
"columns": null,
"label": "d",
"fontSize": 16,
"fontFamily": "DEFAULT",
"language": "",
"color": "N1",
"italic": false,
"bold": true,
"underline": false,
"labelWidth": 9,
"labelHeight": 21,
"labelPosition": "INSIDE_MIDDLE_CENTER",
"zIndex": 0,
"level": 1
},
{
"id": "e",
"type": "rectangle",
"pos": {
"x": 127,
"y": 0
},
"width": 53,
"height": 66,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
"borderRadius": 0,
"fill": "B6",
"stroke": "B1",
"shadow": false,
"3d": false,
"multiple": false,
"double-border": false,
"tooltip": "",
"link": "",
"icon": null,
"iconPosition": "",
"blend": false,
"fields": null,
"methods": null,
"columns": null,
"label": "e",
"fontSize": 16,
"fontFamily": "DEFAULT",
"language": "",
"color": "N1",
"italic": false,
"bold": true,
"underline": false,
"labelWidth": 8,
"labelHeight": 21,
"labelPosition": "INSIDE_MIDDLE_CENTER",
"zIndex": 0,
"level": 1
},
{
"id": "f",
"type": "rectangle",
"pos": {
"x": 240,
"y": 0
},
"width": 51,
"height": 66,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
"borderRadius": 0,
"fill": "B6",
"stroke": "B1",
"shadow": false,
"3d": false,
"multiple": false,
"double-border": false,
"tooltip": "",
"link": "",
"icon": null,
"iconPosition": "",
"blend": false,
"fields": null,
"methods": null,
"columns": null,
"label": "f",
"fontSize": 16,
"fontFamily": "DEFAULT",
"language": "",
"color": "N1",
"italic": false,
"bold": true,
"underline": false,
"labelWidth": 6,
"labelHeight": 21,
"labelPosition": "INSIDE_MIDDLE_CENTER",
"zIndex": 0,
"level": 1
},
{
"id": "g",
"type": "rectangle",
"pos": {
"x": 351,
"y": 0
},
"width": 54,
"height": 66,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
"borderRadius": 0,
"fill": "B6",
"stroke": "B1",
"shadow": false,
"3d": false,
"multiple": false,
"double-border": false,
"tooltip": "",
"link": "",
"icon": null,
"iconPosition": "",
"blend": false,
"fields": null,
"methods": null,
"columns": null,
"label": "g",
"fontSize": 16,
"fontFamily": "DEFAULT",
"language": "",
"color": "N1",
"italic": false,
"bold": true,
"underline": false,
"labelWidth": 9,
"labelHeight": 21,
"labelPosition": "INSIDE_MIDDLE_CENTER",
"zIndex": 0,
"level": 1
}
],
"connections": [
{
"id": "(a -> b.c)[0]",
"src": "a",
"srcArrow": "none",
"srcLabel": "",
"dst": "b.c",
"dstArrow": "filled-diamond",
"dstLabel": "",
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 8,
"stroke": "B1",
"label": "",
"fontSize": 16,
"fontFamily": "DEFAULT",
"language": "",
"color": "N2",
"italic": true,
"bold": false,
"underline": false,
"labelWidth": 0,
"labelHeight": 0,
"labelPosition": "",
"labelPercentage": 0,
"route": [
{
"x": 40,
"y": 66
},
{
"x": 40,
"y": 106
},
{
"x": 68.5,
"y": 184.09704142011833
},
{
"x": 182.5,
"y": 256.4852071005917
}
],
"isCurve": true,
"animated": false,
"tooltip": "",
"icon": null,
"zIndex": 0
},
{
"id": "(b.c -> d)[0]",
"src": "b.c",
"srcArrow": "none",
"srcLabel": "",
"dst": "d",
"dstArrow": "filled-diamond",
"dstLabel": "",
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 8,
"stroke": "B1",
"label": "",
"fontSize": 16,
"fontFamily": "DEFAULT",
"language": "",
"color": "N2",
"italic": true,
"bold": false,
"underline": false,
"labelWidth": 0,
"labelHeight": 0,
"labelPosition": "",
"labelPercentage": 0,
"route": [
{
"x": 209,
"y": 302.5
},
{
"x": 209,
"y": 326.1
},
{
"x": 209,
"y": 392
},
{
"x": 209,
"y": 432
}
],
"isCurve": true,
"animated": false,
"tooltip": "",
"icon": null,
"zIndex": 0
},
{
"id": "(e -> b.c)[0]",
"src": "e",
"srcArrow": "none",
"srcLabel": "",
"dst": "b.c",
"dstArrow": "filled-diamond",
"dstLabel": "",
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 8,
"stroke": "B1",
"label": "",
"fontSize": 16,
"fontFamily": "DEFAULT",
"language": "",
"color": "N2",
"italic": true,
"bold": false,
"underline": false,
"labelWidth": 0,
"labelHeight": 0,
"labelPosition": "",
"labelPercentage": 0,
"route": [
{
"x": 153,
"y": 66
},
{
"x": 153,
"y": 106
},
{
"x": 159.8,
"y": 180.1
},
{
"x": 187,
"y": 236.5
}
],
"isCurve": true,
"animated": false,
"tooltip": "",
"icon": null,
"zIndex": 0
},
{
"id": "(f -> b)[0]",
"src": "f",
"srcArrow": "none",
"srcLabel": "",
"dst": "b",
"dstArrow": "filled-diamond",
"dstLabel": "",
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 8,
"stroke": "red",
"label": "",
"fontSize": 16,
"fontFamily": "DEFAULT",
"language": "",
"color": "N2",
"italic": true,
"bold": false,
"underline": false,
"labelWidth": 0,
"labelHeight": 0,
"labelPosition": "",
"labelPercentage": 0,
"route": [
{
"x": 265,
"y": 66
},
{
"x": 265,
"y": 106
},
{
"x": 265,
"y": 126
},
{
"x": 265,
"y": 166
}
],
"isCurve": true,
"animated": false,
"tooltip": "",
"icon": null,
"zIndex": 0
},
{
"id": "(g -> b)[0]",
"src": "g",
"srcArrow": "none",
"srcLabel": "",
"dst": "b",
"dstArrow": "filled-diamond",
"dstLabel": "",
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 8,
"stroke": "B1",
"label": "",
"fontSize": 16,
"fontFamily": "DEFAULT",
"language": "",
"color": "N2",
"italic": true,
"bold": false,
"underline": false,
"labelWidth": 0,
"labelHeight": 0,
"labelPosition": "",
"labelPercentage": 0,
"route": [
{
"x": 377.5,
"y": 66
},
{
"x": 377.5,
"y": 106
},
{
"x": 377.6,
"y": 145.2
},
{
"x": 378,
"y": 262
}
],
"isCurve": true,
"animated": false,
"tooltip": "",
"icon": null,
"zIndex": 0
}
]
}

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 656 KiB

View file

@ -0,0 +1,514 @@
{
"name": "",
"fontFamily": "SourceSansPro",
"shapes": [
{
"id": "a",
"type": "rectangle",
"pos": {
"x": 12,
"y": 12
},
"width": 53,
"height": 66,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
"borderRadius": 0,
"fill": "B6",
"stroke": "B1",
"shadow": false,
"3d": false,
"multiple": false,
"double-border": false,
"tooltip": "",
"link": "",
"icon": null,
"iconPosition": "",
"blend": false,
"fields": null,
"methods": null,
"columns": null,
"label": "a",
"fontSize": 16,
"fontFamily": "DEFAULT",
"language": "",
"color": "N1",
"italic": false,
"bold": true,
"underline": false,
"labelWidth": 8,
"labelHeight": 21,
"labelPosition": "INSIDE_MIDDLE_CENTER",
"zIndex": 0,
"level": 1
},
{
"id": "b",
"type": "cloud",
"pos": {
"x": 26,
"y": 213
},
"width": 155,
"height": 166,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
"borderRadius": 0,
"fill": "N7",
"stroke": "B1",
"shadow": false,
"3d": false,
"multiple": false,
"double-border": false,
"tooltip": "",
"link": "",
"icon": null,
"iconPosition": "",
"blend": false,
"fields": null,
"methods": null,
"columns": null,
"label": "a container label",
"fontSize": 28,
"fontFamily": "DEFAULT",
"language": "",
"color": "N1",
"italic": false,
"bold": false,
"underline": false,
"labelWidth": 195,
"labelHeight": 36,
"labelPosition": "INSIDE_TOP_CENTER",
"zIndex": 0,
"level": 1
},
{
"id": "b.c",
"type": "rectangle",
"pos": {
"x": 76,
"y": 263
},
"width": 53,
"height": 66,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
"borderRadius": 0,
"fill": "B5",
"stroke": "B1",
"shadow": false,
"3d": false,
"multiple": false,
"double-border": false,
"tooltip": "",
"link": "",
"icon": null,
"iconPosition": "",
"blend": false,
"fields": null,
"methods": null,
"columns": null,
"label": "c",
"fontSize": 16,
"fontFamily": "DEFAULT",
"language": "",
"color": "N1",
"italic": false,
"bold": true,
"underline": false,
"labelWidth": 8,
"labelHeight": 21,
"labelPosition": "INSIDE_MIDDLE_CENTER",
"zIndex": 0,
"level": 2
},
{
"id": "d",
"type": "rectangle",
"pos": {
"x": 75,
"y": 454
},
"width": 54,
"height": 66,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
"borderRadius": 0,
"fill": "B6",
"stroke": "B1",
"shadow": false,
"3d": false,
"multiple": false,
"double-border": false,
"tooltip": "",
"link": "",
"icon": null,
"iconPosition": "",
"blend": false,
"fields": null,
"methods": null,
"columns": null,
"label": "d",
"fontSize": 16,
"fontFamily": "DEFAULT",
"language": "",
"color": "N1",
"italic": false,
"bold": true,
"underline": false,
"labelWidth": 9,
"labelHeight": 21,
"labelPosition": "INSIDE_MIDDLE_CENTER",
"zIndex": 0,
"level": 1
},
{
"id": "e",
"type": "rectangle",
"pos": {
"x": 85,
"y": 12
},
"width": 53,
"height": 66,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
"borderRadius": 0,
"fill": "B6",
"stroke": "B1",
"shadow": false,
"3d": false,
"multiple": false,
"double-border": false,
"tooltip": "",
"link": "",
"icon": null,
"iconPosition": "",
"blend": false,
"fields": null,
"methods": null,
"columns": null,
"label": "e",
"fontSize": 16,
"fontFamily": "DEFAULT",
"language": "",
"color": "N1",
"italic": false,
"bold": true,
"underline": false,
"labelWidth": 8,
"labelHeight": 21,
"labelPosition": "INSIDE_MIDDLE_CENTER",
"zIndex": 0,
"level": 1
},
{
"id": "f",
"type": "rectangle",
"pos": {
"x": 158,
"y": 12
},
"width": 51,
"height": 66,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
"borderRadius": 0,
"fill": "B6",
"stroke": "B1",
"shadow": false,
"3d": false,
"multiple": false,
"double-border": false,
"tooltip": "",
"link": "",
"icon": null,
"iconPosition": "",
"blend": false,
"fields": null,
"methods": null,
"columns": null,
"label": "f",
"fontSize": 16,
"fontFamily": "DEFAULT",
"language": "",
"color": "N1",
"italic": false,
"bold": true,
"underline": false,
"labelWidth": 6,
"labelHeight": 21,
"labelPosition": "INSIDE_MIDDLE_CENTER",
"zIndex": 0,
"level": 1
},
{
"id": "g",
"type": "rectangle",
"pos": {
"x": 229,
"y": 12
},
"width": 54,
"height": 66,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
"borderRadius": 0,
"fill": "B6",
"stroke": "B1",
"shadow": false,
"3d": false,
"multiple": false,
"double-border": false,
"tooltip": "",
"link": "",
"icon": null,
"iconPosition": "",
"blend": false,
"fields": null,
"methods": null,
"columns": null,
"label": "g",
"fontSize": 16,
"fontFamily": "DEFAULT",
"language": "",
"color": "N1",
"italic": false,
"bold": true,
"underline": false,
"labelWidth": 9,
"labelHeight": 21,
"labelPosition": "INSIDE_MIDDLE_CENTER",
"zIndex": 0,
"level": 1
}
],
"connections": [
{
"id": "(a -> b.c)[0]",
"src": "a",
"srcArrow": "none",
"srcLabel": "",
"dst": "b.c",
"dstArrow": "filled-diamond",
"dstLabel": "",
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 8,
"stroke": "B1",
"label": "",
"fontSize": 16,
"fontFamily": "DEFAULT",
"language": "",
"color": "N2",
"italic": true,
"bold": false,
"underline": false,
"labelWidth": 0,
"labelHeight": 0,
"labelPosition": "",
"labelPercentage": 0,
"route": [
{
"x": 38.5,
"y": 78
},
{
"x": 38.5,
"y": 118
},
{
"x": 93.83333333333333,
"y": 118
},
{
"x": 93.83333333333333,
"y": 263
}
],
"animated": false,
"tooltip": "",
"icon": null,
"zIndex": 0
},
{
"id": "(b.c -> d)[0]",
"src": "b.c",
"srcArrow": "none",
"srcLabel": "",
"dst": "d",
"dstArrow": "filled-diamond",
"dstLabel": "",
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 8,
"stroke": "B1",
"label": "",
"fontSize": 16,
"fontFamily": "DEFAULT",
"language": "",
"color": "N2",
"italic": true,
"bold": false,
"underline": false,
"labelWidth": 0,
"labelHeight": 0,
"labelPosition": "",
"labelPercentage": 0,
"route": [
{
"x": 102.66666666666666,
"y": 329
},
{
"x": 102.66666666666666,
"y": 454
}
],
"animated": false,
"tooltip": "",
"icon": null,
"zIndex": 0
},
{
"id": "(e -> b.c)[0]",
"src": "e",
"srcArrow": "none",
"srcLabel": "",
"dst": "b.c",
"dstArrow": "filled-diamond",
"dstLabel": "",
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 8,
"stroke": "B1",
"label": "",
"fontSize": 16,
"fontFamily": "DEFAULT",
"language": "",
"color": "N2",
"italic": true,
"bold": false,
"underline": false,
"labelWidth": 0,
"labelHeight": 0,
"labelPosition": "",
"labelPercentage": 0,
"route": [
{
"x": 111.5,
"y": 78
},
{
"x": 111.5,
"y": 263
}
],
"animated": false,
"tooltip": "",
"icon": null,
"zIndex": 0
},
{
"id": "(f -> b)[0]",
"src": "f",
"srcArrow": "none",
"srcLabel": "",
"dst": "b",
"dstArrow": "filled-diamond",
"dstLabel": "",
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 8,
"stroke": "red",
"label": "",
"fontSize": 16,
"fontFamily": "DEFAULT",
"language": "",
"color": "N2",
"italic": true,
"bold": false,
"underline": false,
"labelWidth": 0,
"labelHeight": 0,
"labelPosition": "",
"labelPercentage": 0,
"route": [
{
"x": 183.5,
"y": 78
},
{
"x": 183.5,
"y": 118
},
{
"x": 121.5,
"y": 118
},
{
"x": 122,
"y": 213
}
],
"animated": false,
"tooltip": "",
"icon": null,
"zIndex": 0
},
{
"id": "(g -> b)[0]",
"src": "g",
"srcArrow": "none",
"srcLabel": "",
"dst": "b",
"dstArrow": "filled-diamond",
"dstLabel": "",
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 8,
"stroke": "B1",
"label": "",
"fontSize": 16,
"fontFamily": "DEFAULT",
"language": "",
"color": "N2",
"italic": true,
"bold": false,
"underline": false,
"labelWidth": 0,
"labelHeight": 0,
"labelPosition": "",
"labelPercentage": 0,
"route": [
{
"x": 256,
"y": 78
},
{
"x": 256,
"y": 168
},
{
"x": 131.5,
"y": 168
},
{
"x": 131,
"y": 218
}
],
"animated": false,
"tooltip": "",
"icon": null,
"zIndex": 0
}
]
}

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 656 KiB

View file

@ -0,0 +1,179 @@
{
"name": "",
"fontFamily": "SourceSansPro",
"shapes": [
{
"id": "x",
"type": "rectangle",
"pos": {
"x": 40,
"y": 0
},
"width": 53,
"height": 66,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
"borderRadius": 0,
"fill": "B6",
"stroke": "B1",
"shadow": false,
"3d": false,
"multiple": false,
"double-border": false,
"tooltip": "",
"link": "",
"icon": null,
"iconPosition": "",
"blend": false,
"fields": null,
"methods": null,
"columns": null,
"label": "x",
"fontSize": 16,
"fontFamily": "DEFAULT",
"language": "",
"color": "N1",
"italic": false,
"bold": true,
"underline": false,
"labelWidth": 8,
"labelHeight": 21,
"labelPosition": "INSIDE_MIDDLE_CENTER",
"zIndex": 0,
"level": 1
},
{
"id": "y",
"type": "rectangle",
"pos": {
"x": 0,
"y": 207
},
"width": 132,
"height": 125,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
"borderRadius": 0,
"fill": "B4",
"stroke": "B1",
"shadow": false,
"3d": false,
"multiple": false,
"double-border": false,
"tooltip": "",
"link": "",
"icon": null,
"iconPosition": "",
"blend": false,
"fields": null,
"methods": null,
"columns": null,
"label": "bar",
"fontSize": 28,
"fontFamily": "DEFAULT",
"language": "",
"color": "N1",
"italic": false,
"bold": false,
"underline": false,
"labelWidth": 38,
"labelHeight": 36,
"labelPosition": "OUTSIDE_TOP_CENTER",
"zIndex": 0,
"level": 1
},
{
"id": "y.z",
"type": "rectangle",
"pos": {
"x": 40,
"y": 236
},
"width": 52,
"height": 66,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
"borderRadius": 0,
"fill": "B5",
"stroke": "B1",
"shadow": false,
"3d": false,
"multiple": false,
"double-border": false,
"tooltip": "",
"link": "",
"icon": null,
"iconPosition": "",
"blend": false,
"fields": null,
"methods": null,
"columns": null,
"label": "z",
"fontSize": 16,
"fontFamily": "DEFAULT",
"language": "",
"color": "N1",
"italic": false,
"bold": true,
"underline": false,
"labelWidth": 7,
"labelHeight": 21,
"labelPosition": "INSIDE_MIDDLE_CENTER",
"zIndex": 0,
"level": 2
}
],
"connections": [
{
"id": "(x -> y)[0]",
"src": "x",
"srcArrow": "none",
"srcLabel": "",
"dst": "y",
"dstArrow": "filled-diamond",
"dstLabel": "foo",
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
"stroke": "B1",
"label": "",
"fontSize": 16,
"fontFamily": "DEFAULT",
"language": "",
"color": "N2",
"italic": true,
"bold": false,
"underline": false,
"labelWidth": 0,
"labelHeight": 0,
"labelPosition": "",
"labelPercentage": 0,
"route": [
{
"x": 66,
"y": 66
},
{
"x": 66,
"y": 106
},
{
"x": 66,
"y": 126
},
{
"x": 66,
"y": 166
}
],
"isCurve": true,
"animated": false,
"tooltip": "",
"icon": null,
"zIndex": 0
}
]
}

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 796 KiB

View file

@ -0,0 +1,170 @@
{
"name": "",
"fontFamily": "SourceSansPro",
"shapes": [
{
"id": "x",
"type": "rectangle",
"pos": {
"x": 61,
"y": 12
},
"width": 53,
"height": 66,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
"borderRadius": 0,
"fill": "B6",
"stroke": "B1",
"shadow": false,
"3d": false,
"multiple": false,
"double-border": false,
"tooltip": "",
"link": "",
"icon": null,
"iconPosition": "",
"blend": false,
"fields": null,
"methods": null,
"columns": null,
"label": "x",
"fontSize": 16,
"fontFamily": "DEFAULT",
"language": "",
"color": "N1",
"italic": false,
"bold": true,
"underline": false,
"labelWidth": 8,
"labelHeight": 21,
"labelPosition": "INSIDE_MIDDLE_CENTER",
"zIndex": 0,
"level": 1
},
{
"id": "y",
"type": "rectangle",
"pos": {
"x": 12,
"y": 148
},
"width": 152,
"height": 166,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
"borderRadius": 0,
"fill": "B4",
"stroke": "B1",
"shadow": false,
"3d": false,
"multiple": false,
"double-border": false,
"tooltip": "",
"link": "",
"icon": null,
"iconPosition": "",
"blend": false,
"fields": null,
"methods": null,
"columns": null,
"label": "bar",
"fontSize": 28,
"fontFamily": "DEFAULT",
"language": "",
"color": "N1",
"italic": false,
"bold": false,
"underline": false,
"labelWidth": 38,
"labelHeight": 36,
"labelPosition": "INSIDE_TOP_CENTER",
"zIndex": 0,
"level": 1
},
{
"id": "y.z",
"type": "rectangle",
"pos": {
"x": 62,
"y": 198
},
"width": 52,
"height": 66,
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
"borderRadius": 0,
"fill": "B5",
"stroke": "B1",
"shadow": false,
"3d": false,
"multiple": false,
"double-border": false,
"tooltip": "",
"link": "",
"icon": null,
"iconPosition": "",
"blend": false,
"fields": null,
"methods": null,
"columns": null,
"label": "z",
"fontSize": 16,
"fontFamily": "DEFAULT",
"language": "",
"color": "N1",
"italic": false,
"bold": true,
"underline": false,
"labelWidth": 7,
"labelHeight": 21,
"labelPosition": "INSIDE_MIDDLE_CENTER",
"zIndex": 0,
"level": 2
}
],
"connections": [
{
"id": "(x -> y)[0]",
"src": "x",
"srcArrow": "none",
"srcLabel": "",
"dst": "y",
"dstArrow": "filled-diamond",
"dstLabel": "foo",
"opacity": 1,
"strokeDash": 0,
"strokeWidth": 2,
"stroke": "B1",
"label": "",
"fontSize": 16,
"fontFamily": "DEFAULT",
"language": "",
"color": "N2",
"italic": true,
"bold": false,
"underline": false,
"labelWidth": 0,
"labelHeight": 0,
"labelPosition": "",
"labelPercentage": 0,
"route": [
{
"x": 88,
"y": 78
},
{
"x": 88,
"y": 148
}
],
"animated": false,
"tooltip": "",
"icon": null,
"zIndex": 0
}
]
}

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 796 KiB

View file

@ -220,6 +220,37 @@ Office chatter: {
a
}
}
`,
},
{
name: "container_label_edge_adjustment",
script: `
a -> b.c -> d: {style.stroke-width: 8; target-arrowhead.shape: diamond; target-arrowhead.style.filled: true}
b.shape: cloud
e -> b.c: {style.stroke-width: 8; target-arrowhead.shape: diamond; target-arrowhead.style.filled: true}
f -> b: {
style: {
stroke: red
stroke-width: 8
}
target-arrowhead.shape: diamond
target-arrowhead.style.filled: true
}
g -> b: {style.stroke-width: 8; target-arrowhead.shape: diamond; target-arrowhead.style.filled: true}
b: a container label
`,
},
{
name: "container_label_edge_adjustment2",
script: `
x -> y: {
target-arrowhead: foo {
shape: diamond
style.filled: true
}
}
y: bar {z}
`,
},
}