marcel/mermaid
1
0
Fork 0
mirror of https://github.com/mermaid-js/mermaid.git synced 2025-09-25 10:20:06 +02:00
Code Issues Packages Projects Releases Wiki Activity

Fix problem with circle

Browse Source
This commit is contained in:
Per Brolin
2024-09-30 10:26:00 +02:00
parent 5ad1a6082b
commit 221d59cbfc
2 changed files with 9 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
cypress/platform/size-tester.html
View File

@@ -56,7 +56,7 @@
logLevel: 1, logLevel: 1,
}); });
let shape = 'dbl-circ'; let shape = 'circle';
let code = ` let code = `
flowchart TB flowchart TB

15
packages/mermaid/src/rendering-util/rendering-elements/shapes/circle.ts
View File

@@ -8,24 +8,25 @@ import rough from 'roughjs';
export const circle = async (parent: SVGAElement, node: Node): Promise<SVGAElement> => { export const circle = async (parent: SVGAElement, node: Node): Promise<SVGAElement> => {
const { labelStyles, nodeStyles } = styles2String(node); const { labelStyles, nodeStyles } = styles2String(node);
node.labelStyle = labelStyles; node.labelStyle = labelStyles;
const padding = node.padding ?? 0; // If incoming height & width are present, subtract the padding from them
// as labelHelper does not take padding into account
// also check if the width or height is less than minimum default values (50),
// if so set it to min value
if (node.width || node.height) { if (node.width || node.height) {
const padding = node.padding ?? 0;
node.width = (node?.width ?? 0) - padding * 2; node.width = (node?.width ?? 0) - padding * 2;
if (node.width < 50) { if (node.width < 50) {
node.width = 50; node.width = 50;
} }
node.height = (node?.height ?? 0) - padding * 2; node.height = (node?.height ?? 0) - (node.padding ?? 0) * 2;
if (node.height < 50) { if (node.height < 50) {
node.height = 50; node.height = 50;
} }
} }
const { shapeSvg, bbox } = await labelHelper(parent, node, getNodeClasses(node));
const { shapeSvg, halfPadding } = await labelHelper(parent, node, getNodeClasses(node)); const radius = Math.max(bbox.width / 2, (node?.width ?? 0) / 2) + (node.padding ?? 0);
const labelPadding = node.look === 'neo' ? halfPadding * 2 : halfPadding;
const radius = (node.width ?? 0) / 2 + labelPadding;
let circleElem; let circleElem;
const { cssStyles } = node; const { cssStyles } = node;