marcel/mermaid
1
0
Fork 0
mirror of https://github.com/mermaid-js/mermaid.git synced 2025-09-21 08:19:43 +02:00
Code Issues Packages Projects Releases Wiki Activity

fixed resizing issue for iconCircle shape

Browse Source
This commit is contained in:
omkarht
2024-10-10 17:04:37 +05:30
parent 71d6ded224
commit ff9fffef90
1 changed files with 29 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
packages/mermaid/src/rendering-util/rendering-elements/shapes/iconCircle.ts
View File

@@ -14,23 +14,42 @@ export const iconCircle = async (
) => { ) => {
const { labelStyles } = styles2String(node); const { labelStyles } = styles2String(node);
node.labelStyle = labelStyles; node.labelStyle = labelStyles;
const defaultWidth = flowchart?.wrappingWidth;
const padding = node.height ? node.height * 0.05 : 15;
const labelPadding = node.label ? 8 : 0;
const assetHeight = node.assetHeight ?? 48; const assetHeight = node.assetHeight ?? 48;
const assetWidth = node.assetWidth ?? 48; const assetWidth = node.assetWidth ?? 48;
const iconSize = Math.max(assetHeight, assetWidth); let iconSize = Math.max(assetHeight, assetWidth) / Math.SQRT2 - padding;
const defaultWidth = flowchart?.wrappingWidth; let height = Math.max(assetHeight, assetWidth);
node.width = Math.max(iconSize, defaultWidth ?? 0); let width = Math.max(assetHeight, assetWidth);
// node.width = Math.max(iconSize, defaultWidth ?? 0);
let adjustDimensions = false;
if (node.width || node.height) {
adjustDimensions = true;
node.width = ((node?.width ?? 10) - labelPadding * 2) / Math.SQRT2 - padding;
node.height = ((node?.height ?? 10) - labelPadding * 2) / Math.SQRT2 - padding;
width = node.width;
height = node.height;
} else {
node.width = Math.max(width, defaultWidth ?? 0);
}
const { shapeSvg, bbox, label } = await labelHelper(parent, node, 'icon-shape default'); const { shapeSvg, bbox, label } = await labelHelper(parent, node, 'icon-shape default');
const padding = node.look === 'neo' ? 30 : 20;
const labelPadding = node.label ? 8 : 0;
const topLabel = node.pos === 't'; const topLabel = node.pos === 't';
if (adjustDimensions) {
node.width = (node.width + padding) * Math.SQRT2 + labelPadding * 2;
node.height = ((node.height ?? 10) + padding) * Math.SQRT2 + labelPadding * 2;
width = node.width; // / Math.SQRT2 - padding ;
height = node.height; // / Math.SQRT2 - padding;
iconSize = (Math.max(node.width, node.height) - padding) / Math.SQRT2;
}
const { nodeBorder } = themeVariables; const { nodeBorder } = themeVariables;
const { stylesMap } = compileStyles(node); const { stylesMap } = compileStyles(node);
const rc = rough.svg(shapeSvg); const rc = rough.svg(shapeSvg);
const options = userNodeOverrides(node, { stroke: 'transparent' }); const options = userNodeOverrides(node, { stroke: 'transparent' });
// const options = userNodeOverrides(node, { stroke: stylesMap.get('fill') ?? mainBkg });
if (node.look !== 'handDrawn') { if (node.look !== 'handDrawn') {
options.roughness = 0; options.roughness = 0;
@@ -49,11 +68,11 @@ export const iconCircle = async (
} }
const iconBBox = iconElem.node().getBBox(); const iconBBox = iconElem.node().getBBox();
const iconWidth = iconBBox.width; const iconWidth = iconBBox.width;
const iconHeight = iconBBox.height; // const iconHeight = iconBBox.height;
const iconX = iconBBox.x; const iconX = iconBBox.x;
// const iconY = iconBBox.y; // const iconY = iconBBox.y;
const diameter = Math.max(iconWidth, iconHeight) * Math.SQRT2 + padding * 2; const diameter = Math.max(height, width);
const iconNode = rc.circle(0, 0, diameter, options); const iconNode = rc.circle(0, 0, diameter, options);
// const outerWidth = Math.max(diameter, bbox.width); // const outerWidth = Math.max(diameter, bbox.width);