GitHub/mermaid
1
0
Fork 0
mirror of https://github.com/mermaid-js/mermaid.git synced 2025-01-28 07:03:17 +08:00
Code Issues Projects Releases Wiki Activity

#5237 Fix of alignment with htmlLabels

Browse Source
This commit is contained in:
Knut Sveidqvist 2024-06-25 15:48:19 +02:00
parent fc31b22eb0
commit 9979ea1d74
3 changed files with 15 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
packages/mermaid/src/rendering-util/createText.ts
View File

@ -203,13 +203,14 @@ export const createText = async (
config: MermaidConfig
) => {
log.info(
'XXX createText',
'XYZ createText',
text,
style,
isTitle,
classes,
useHtmlLabels,
isNode,
'addSvgBackground: ',
addSvgBackground
);
if (useHtmlLabels) {
@ -226,7 +227,12 @@ export const createText = async (
return vertexNode;
} else {
const structuredText = markdownToLines(text, config);
const svgLabel = createFormattedText(width, el, structuredText, addSvgBackground);
const svgLabel = createFormattedText(
width,
el,
structuredText,
text ? addSvgBackground : false
);
svgLabel.setAttribute(
'style',
style.replace('fill:', 'color:') + (isNode ? ';text-anchor: middle;' : '')

8
packages/mermaid/src/rendering-util/rendering-elements/clusters.js
View File

@ -99,19 +99,11 @@ const rect = async (parent, node) => {
.attr('height', totalHeight);
}
const { subGraphTitleTopMargin } = getSubGraphTitleMargins(siteConfig);
if (useHtmlLabels) {
labelEl.attr(
'transform',
// This puts the label on top of the box instead of inside it
`translate(${node.x - bbox.width / 2}, ${node.y - node.height / 2 + subGraphTitleTopMargin})`
);
} else {
labelEl.attr(
'transform',
// This puts the label on top of the box instead of inside it
`translate(${node.x}, ${node.y - node.height / 2 + subGraphTitleTopMargin})`
);
}
if (labelStyles) {
const span = labelEl.select('span');

3
packages/mermaid/src/rendering-util/rendering-elements/edges.js
View File

@ -25,7 +25,7 @@ export const getLabelStyles = (styleArray) => {
};
export const insertEdgeLabel = async (elem, edge) => {
const useHtmlLabels = evaluate(getConfig().flowchart.htmlLabels);
let useHtmlLabels = evaluate(getConfig().flowchart.htmlLabels);
// Create the actual text element
// const labelElement =
@ -36,6 +36,7 @@ export const insertEdgeLabel = async (elem, edge) => {
// addSvgBackground: true,
// })
// : await createLabel(edge.label, getLabelStyles(edge.labelStyle));
const labelElement = await createText(elem, edge.label, {
style: getLabelStyles(edge.labelStyle),
useHtmlLabels,