Fix double circle shape neo look for flowchart

This commit is contained in:
Ashish Jain
2024-06-18 14:31:17 +02:00
parent 2007cab5ee
commit 92e6f52168
2 changed files with 27 additions and 8 deletions

View File

@@ -79,18 +79,35 @@
flowchart
node
id1([This is the text in the box])
id2((circle))
id1(((double circle)))
</pre
>
<pre id="diagram" class="mermaid">
---
config:
theme: default
look: classic
---
flowchart
node
id1([This is the text in the box])
id2((circle))
id1(((double circle)))
</pre
>
<pre id="diagram" class="mermaid">
stateDiagram
node
[*] --> Active
Active --> Inactive
Inactive --> Active
Active --> [*]
</pre>
</pre
>
<pre id="diagram" class="mermaid2">
flowchart
a_a(Aftonbladet) --> b_b[gorilla]:::apa --> c_c{chimp}:::apa -->a_a

View File

@@ -9,8 +9,9 @@ import rough from 'roughjs';
export const doublecircle = async (parent: SVGAElement, node: Node): Promise<SVGAElement> => {
const { shapeSvg, bbox, halfPadding } = await labelHelper(parent, node, getNodeClasses(node));
const gap = 5;
const outerRadius = bbox.width / 2 + halfPadding + gap;
const innerRadius = bbox.width / 2 + halfPadding;
const labelPadding = node.look === 'neo' ? halfPadding * 2 : halfPadding;
const outerRadius = bbox.width / 2 + labelPadding + gap;
const innerRadius = bbox.width / 2 + labelPadding;
let circleGroup;
const { cssStyles } = node;
@@ -32,8 +33,9 @@ export const doublecircle = async (parent: SVGAElement, node: Node): Promise<SVG
circleGroup.node()?.appendChild(innerRoughNode);
} else {
circleGroup = shapeSvg.insert('g', ':first-child');
const outerCircle = circleGroup.insert('circle', ':first-child');
const innerCircle = circleGroup.insert('circle', ':first-child');
const outerCircle = circleGroup.insert('circle', ':first-child');
circleGroup.attr('class', 'basic label-container').attr('style', cssStyles);