mirror of
https://github.com/mermaid-js/mermaid.git
synced 2025-10-08 08:39:38 +02:00
updated html-label alignment for shapes
This commit is contained in:
@@ -116,11 +116,10 @@ export async function curlyBraceLeft<T extends SVGGraphicsElement>(
|
|||||||
|
|
||||||
curlyBraceLeftShape.attr('transform', `translate(${radius}, 0)`);
|
curlyBraceLeftShape.attr('transform', `translate(${radius}, 0)`);
|
||||||
|
|
||||||
label.attr('transform', `translate(${-bbox.width / 2}, ${-bbox.height / 2})`);
|
label.attr(
|
||||||
// label.attr(
|
'transform',
|
||||||
// 'transform',
|
`translate(${-w / 2 + (paddingX ?? 0) - (bbox.x - (bbox.left ?? 0))}, ${-bbox.height / 2})`
|
||||||
// `translate(${-w / 2 + radius - (bbox.x - (bbox.left ?? 0))},${-paddingY / 2 - (bbox.y - (bbox.top ?? 0))})`
|
);
|
||||||
// );
|
|
||||||
|
|
||||||
updateNodeBounds(node, curlyBraceLeftShape);
|
updateNodeBounds(node, curlyBraceLeftShape);
|
||||||
|
|
||||||
|
@@ -119,12 +119,10 @@ export async function curlyBraceRight<T extends SVGGraphicsElement>(
|
|||||||
|
|
||||||
curlyBraceRightShape.attr('transform', `translate(${-radius}, 0)`);
|
curlyBraceRightShape.attr('transform', `translate(${-radius}, 0)`);
|
||||||
|
|
||||||
label.attr('transform', `translate(${-bbox.width / 2}, ${-bbox.height / 2})`);
|
label.attr(
|
||||||
|
'transform',
|
||||||
// label.attr(
|
`translate(${-w / 2 + (labelPaddingX ?? 0) - (bbox.x - (bbox.left ?? 0))}, ${-bbox.height / 2})`
|
||||||
// 'transform',
|
);
|
||||||
// `translate(${-w / 2 + labelPaddingX / 2 - (bbox.x - (bbox.left ?? 0))},${-(labelPaddingY / 2) - (bbox.y - (bbox.top ?? 0))})`
|
|
||||||
// );
|
|
||||||
|
|
||||||
updateNodeBounds(node, curlyBraceRightShape);
|
updateNodeBounds(node, curlyBraceRightShape);
|
||||||
|
|
||||||
|
@@ -137,7 +137,10 @@ export async function curlyBraces<T extends SVGGraphicsElement>(
|
|||||||
|
|
||||||
curlyBracesShape.attr('transform', `translate(${radius - radius / 4}, 0)`);
|
curlyBracesShape.attr('transform', `translate(${radius - radius / 4}, 0)`);
|
||||||
|
|
||||||
label.attr('transform', `translate(${-bbox.width / 2}, ${-bbox.height / 2})`);
|
label.attr(
|
||||||
|
'transform',
|
||||||
|
`translate(${-w / 2 + (labelPaddingX ?? 0) - (bbox.x - (bbox.left ?? 0))}, ${-bbox.height / 2})`
|
||||||
|
);
|
||||||
updateNodeBounds(node, curlyBracesShape);
|
updateNodeBounds(node, curlyBracesShape);
|
||||||
|
|
||||||
node.intersect = function (point) {
|
node.intersect = function (point) {
|
||||||
|
@@ -75,7 +75,7 @@ export async function dividedRectangle<T extends SVGGraphicsElement>(
|
|||||||
// place the label in the center of the lower half of the divided rectangle
|
// place the label in the center of the lower half of the divided rectangle
|
||||||
label.attr(
|
label.attr(
|
||||||
'transform',
|
'transform',
|
||||||
`translate(${-bbox.width / 2}, ${-bbox.height / 2 - rectOffset / 2 + rectOffset})`
|
`translate(${-w / 2 + (paddingX ?? 0) - (bbox.x - (bbox.left ?? 0))}, ${-bbox.height / 2 - rectOffset / 2 + rectOffset})`
|
||||||
);
|
);
|
||||||
|
|
||||||
updateNodeBounds(node, polygon);
|
updateNodeBounds(node, polygon);
|
||||||
|
Reference in New Issue
Block a user