GitHub/mermaid
1
0
Fork 0
mirror of https://github.com/mermaid-js/mermaid.git synced 2025-01-14 06:43:25 +08:00
Code Issues Projects Releases Wiki Activity

Merge branch '5237-unified-layout-common-renderer' into sidv/5237_Cleanup

Browse Source 
* 5237-unified-layout-common-renderer:
  #5237 Fix fir subgraphs with elk
  #5237 Fix for diamond intersections with ELK, tweak
  #5237 Fix for diamond intersections with ELK
  fix for note with a composite state
  #5237 Handling of subgraphs using elk
  #5237 Handling of subgraphs using elk
  Fix fro direction in layout data
This commit is contained in:
Sidharth Vinod 2024-07-04 12:47:57 +05:30
commit 03a634607a
No known key found for this signature in database
GPG Key ID: FB5CCD378D3907CD
9 changed files with 10513 additions and 8003 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

512
packages/mermaid-layout-elk/src/render.ts
View File

@ -17,7 +17,7 @@ const {
log,
positionEdgeLabel,
} = mermaid.internalHelpers;
// import { insertEdge } from '../../mermaid/src/rendering-util/rendering-elements/edges.js';
const nodeDb = {};
const portPos = {};
const clusterDb = {};
@ -54,7 +54,7 @@ export const addVertex = async (nodeEl, graph, nodeArr, node) => {
let boundingBox;
const child = {
...node,
ports: node.shape === 'diamond' ? ports : [],
// ports: node.shape === 'diamond' ? ports : [],
};
graph.children.push(child);
nodeDb[node.id] = child;
@ -102,47 +102,49 @@ export const addVertices = async function (nodeEl, nodeArr, graph, parentId) {
return graph;
};
const drawNodes = (relX, relY, nodeArray, svg, subgraphsEl, depth) => {
nodeArray.forEach(function (node) {
if (node) {
nodeDb[node.id] = node;
nodeDb[node.id].offset = {
posX: node.x + relX,
posY: node.y + relY,
x: relX,
y: relY,
depth,
width: node.width,
height: node.height,
};
if (node.isGroup) {
log.debug('Id abc88 subgraph = ', node.id, node.x, node.y, node.labelData);
const subgraphEl = subgraphsEl.insert('g').attr('class', 'subgraph');
// TODO use faster way of cloning
const clusterNode = JSON.parse(JSON.stringify(node));
clusterNode.x = node.offset.posX + node.width / 2;
clusterNode.y = node.offset.posY + node.height / 2;
insertCluster(subgraphEl, clusterNode);
const drawNodes = async (relX, relY, nodeArray, svg, subgraphsEl, depth) => {
Promise.all(
nodeArray.map(async function (node) {
if (node) {
nodeDb[node.id] = node;
nodeDb[node.id].offset = {
posX: node.x + relX,
posY: node.y + relY,
x: relX,
y: relY,
depth,
width: Math.max(node.width, node.labels ? node.labels[0]?.width || 0 : 0),
height: node.height,
};
if (node.isGroup) {
console.log('Id abc88 subgraph = ', node.id, node.x, node.y, node.labelData);
const subgraphEl = subgraphsEl.insert('g').attr('class', 'subgraph');
// TODO use faster way of cloning
const clusterNode = JSON.parse(JSON.stringify(node));
clusterNode.x = node.offset.posX + node.width / 2;
clusterNode.y = node.offset.posY + node.height / 2;
await insertCluster(subgraphEl, clusterNode);
log.info('Id (UGH)= ', node.shape, node.labels);
} else {
log.info(
'Id NODE = ',
node.id,
node.x,
node.y,
relX,
relY,
node.domId.node(),
`translate(${node.x + relX + node.width / 2}, ${node.y + relY + node.height / 2})`
);
node.domId.attr(
'transform',
`translate(${node.x + relX + node.width / 2}, ${node.y + relY + node.height / 2})`
);
console.log('Id (UIO)= ', node.id, node.width, node.shape, node.labels);
} else {
log.info(
'Id NODE = ',
node.id,
node.x,
node.y,
relX,
relY,
node.domId.node(),
`translate(${node.x + relX + node.width / 2}, ${node.y + relY + node.height / 2})`
);
node.domId.attr(
'transform',
`translate(${node.x + relX + node.width / 2}, ${node.y + relY + node.height / 2})`
);
}
}
}
});
})
);
nodeArray.forEach(function (node) {
if (node?.isGroup) {
drawNodes(relX + node.x, relY + node.y, node.children, svg, subgraphsEl, depth + 1);
@ -388,7 +390,7 @@ export const addEdges = async function (dataForLayout, graph, svg) {
// calculate start and end points of the edge, note that the source and target
// can be modified for shapes that have ports
const { source, target, sourceId, targetId } = getEdgeStartEndPoint(edge, dir);
log.debug('abc78 source and target', source, target);
console.log('abc78 source and target', source, target);
// Add the edge to the graph
graph.edges.push({
id: 'e' + edge.start + edge.end,
@ -489,6 +491,7 @@ export const render = async (data4Layout: LayoutData, svg, element, algorithm) =
// Add elements in the svg to be used to hold the subgraphs container
// elements and the nodes
const subGraphsEl = svg.insert('g').attr('class', 'subgraphs');
const nodeEl = svg.insert('g').attr('class', 'nodes');
// Add the nodes to the graph, this will entail creating the actual nodes
@ -511,21 +514,24 @@ export const render = async (data4Layout: LayoutData, svg, element, algorithm) =
if (parentLookupDb.childrenById[node.id] !== undefined) {
node.labels = [
{
text: node.labelText,
layoutOptions: {
'nodeLabels.placement': '[H_CENTER, V_TOP, INSIDE]',
},
width: node?.labelData?.width || 0,
height: node?.labelData?.height || 0,
text: node.label,
width: node?.labelData?.width || 50,
height: node?.labelData?.height || 50,
},
(node.width = node.width + 2 * node.paddding),
console.log('UIO node label', node?.labelData?.width, node.padding),
];
node.layoutOptions = {
'spacing.baseValue': 30,
'nodeLabels.placement': '[H_CENTER V_TOP, INSIDE]',
};
if (node.dir) {
node.layoutOptions = {
...node.layoutOptions,
'elk.algorithm': algorithm,
'elk.direction': dir2ElkDirection(node.dir),
'nodePlacement.strategy': data4Layout.config['elk.nodePlacement.strategy'],
'elk.layered.mergeEdges': data4Layout.config['elk.mergeEdges'],
'elk.hierarchyHandling': 'SEPARATE_CHILDREN',
};
}
@ -554,14 +560,126 @@ export const render = async (data4Layout: LayoutData, svg, element, algorithm) =
g.edges?.map((edge) => {
// (elem, edge, clusterDb, diagramType, graph, id)
const startNode = nodeDb[edge.sources[0]];
const startCluster = parentLookupDb[edge.sources[0]];
const endNode = nodeDb[edge.targets[0]];
const sourceId = edge.start;
const targetId = edge.end;
const offset = calcOffset(sourceId, targetId, parentLookupDb);
log.info('APA12 offset', offset, sourceId, targetId, edge);
if (!edge.sections) {
return;
console.log(
'offset',
offset,
sourceId,
' ==> ',
targetId,
'edge:',
edge,
'cluster:',
startCluster,
startNode
);
if (edge.sections) {
const src = edge.sections[0].startPoint;
const dest = edge.sections[0].endPoint;
const segments = edge.sections[0].bendPoints ? edge.sections[0].bendPoints : [];
const segPoints = segments.map((segment) => {
return { x: segment.x + offset.x, y: segment.y + offset.y };
});
edge.points = [
{ x: src.x + offset.x, y: src.y + offset.y },
...segPoints,
{ x: dest.x + offset.x, y: dest.y + offset.y },
];
let sw = startNode.width;
let ew = endNode.width;
if (startNode.isGroup) {
const bbox = startNode.domId.node().getBBox();
// sw = Math.max(bbox.width, startNode.width, startNode.labels[0].width);
sw = Math.max(startNode.width, startNode.labels[0].width + startNode.padding);
// sw = startNode.width;
console.log(
'UIO width',
startNode.id,
startNode.with,
'bbox.width=',
bbox.width,
'lw=',
startNode.labels[0].width,
'node:',
startNode.width,
'SW = ',
sw
// 'HTML:',
// startNode.domId.node().innerHTML
);
}
if (endNode.isGroup) {
const bbox = endNode.domId.node().getBBox();
ew = Math.max(startNode.width, endNode.labels[0].width + endNode.padding);
console.log(
'UIO width',
startNode.id,
startNode.with,
bbox.width,
'EW = ',
ew,
'HTML:',
startNode.innerHTML
);
}
if (startNode.shape === 'diamond') {
edge.points.unshift({
x: startNode.x + startNode.width / 2 + offset.x,
y: startNode.y + startNode.height / 2 + offset.y,
});
}
if (startNode.shape === 'diamond') {
edge.points.push({
x: endNode.x + endNode.width / 2 + offset.x,
y: endNode.y + endNode.height / 2 + offset.y,
});
}
edge.points = cutPathAtIntersect(
edge.points.reverse(),
{
x: startNode.x + startNode.width / 2 + offset.x,
y: startNode.y + startNode.height / 2 + offset.y,
width: sw,
height: startNode.height,
padding: startNode.padding,
},
startNode.shape === 'diamond'
).reverse();
edge.points = cutPathAtIntersect(
edge.points,
{
x: endNode.x + ew / 2 + offset.x,
y: endNode.y + endNode.height / 2 + offset.y,
width: ew,
height: endNode.height,
padding: endNode.padding,
},
endNode.shape === 'diamond'
);
const paths = insertEdge(
edgesEl,
edge,
clusterDb,
data4Layout.type,
startNode,
endNode,
data4Layout.diagramId
);
log.info('APA12 edge points after insert', JSON.stringify(edge.points));
edge.x = edge.labels[0].x + offset.x + edge.labels[0].width / 2;
edge.y = edge.labels[0].y + offset.y + edge.labels[0].height / 2;
positionEdgeLabel(edge, paths);
}
const src = edge.sections[0].startPoint;
const dest = edge.sections[0].endPoint;
@ -591,3 +709,295 @@ export const render = async (data4Layout: LayoutData, svg, element, algorithm) =
positionEdgeLabel(edge, paths);
});
};
function intersectLine(p1, p2, q1, q2) {
console.log('UIO intersectLine', p1, p2, q1, q2);
// Algorithm from J. Avro, (ed.) Graphics Gems, No 2, Morgan Kaufmann, 1994,
// p7 and p473.
let a1, a2, b1, b2, c1, c2;
let r1, r2, r3, r4;
let denom, offset, num;
let x, y;
// Compute a1, b1, c1, where line joining points 1 and 2 is F(x,y) = a1 x +
// b1 y + c1 = 0.
a1 = p2.y - p1.y;
b1 = p1.x - p2.x;
c1 = p2.x * p1.y - p1.x * p2.y;
// Compute r3 and r4.
r3 = a1 * q1.x + b1 * q1.y + c1;
r4 = a1 * q2.x + b1 * q2.y + c1;
// Check signs of r3 and r4. If both point 3 and point 4 lie on
// same side of line 1, the line segments do not intersect.
if (r3 !== 0 && r4 !== 0 && sameSign(r3, r4)) {
return /*DON'T_INTERSECT*/;
}
// Compute a2, b2, c2 where line joining points 3 and 4 is G(x,y) = a2 x + b2 y + c2 = 0
a2 = q2.y - q1.y;
b2 = q1.x - q2.x;
c2 = q2.x * q1.y - q1.x * q2.y;
// Compute r1 and r2
r1 = a2 * p1.x + b2 * p1.y + c2;
r2 = a2 * p2.x + b2 * p2.y + c2;
// Check signs of r1 and r2. If both point 1 and point 2 lie
// on same side of second line segment, the line segments do
// not intersect.
if (r1 !== 0 && r2 !== 0 && sameSign(r1, r2)) {
return /*DON'T_INTERSECT*/;
}
// Line segments intersect: compute intersection point.
denom = a1 * b2 - a2 * b1;
if (denom === 0) {
return /*COLLINEAR*/;
}
offset = Math.abs(denom / 2);
// The denom/2 is to get rounding instead of truncating. It
// is added or subtracted to the numerator, depending upon the
// sign of the numerator.
num = b1 * c2 - b2 * c1;
x = num < 0 ? (num - offset) / denom : (num + offset) / denom;
num = a2 * c1 - a1 * c2;
y = num < 0 ? (num - offset) / denom : (num + offset) / denom;
return { x: x, y: y };
}
/**
* @param r1
* @param r2
*/
function sameSign(r1, r2) {
return r1 * r2 > 0;
}
const diamondIntersection = (bounds, outsidePoint, insidePoint) => {
const x1 = bounds.x;
const y1 = bounds.y;
const w = bounds.width; //+ bounds.padding;
const h = bounds.height; // + bounds.padding;
const s = w + h;
const polyPoints = [
{ x: x1, y: y1 - h / 2 },
{ x: x1 + w / 2, y: y1 },
{ x: x1, y: y1 + h / 2 },
{ x: x1 - w / 2, y: y1 },
];
log.debug(
`UIO diamondIntersection calc abc89:
outsidePoint: ${JSON.stringify(outsidePoint)}
insidePoint : ${JSON.stringify(insidePoint)}
node : x:${bounds.x} y:${bounds.y} w:${bounds.width} h:${bounds.height}`,
polyPoints
);
const intersections = [];
let minX = Number.POSITIVE_INFINITY;
let minY = Number.POSITIVE_INFINITY;
if (typeof polyPoints.forEach === 'function') {
polyPoints.forEach(function (entry) {
minX = Math.min(minX, entry.x);
minY = Math.min(minY, entry.y);
});
} else {
minX = Math.min(minX, polyPoints.x);
minY = Math.min(minY, polyPoints.y);
}
const left = x1 - w / 2;
const top = y1 + h / 2;
for (let i = 0; i < polyPoints.length; i++) {
const p1 = polyPoints[i];
const p2 = polyPoints[i < polyPoints.length - 1 ? i + 1 : 0];
const intersect = intersectLine(
bounds,
outsidePoint,
{ x: p1.x, y: p1.y },
{ x: p2.x, y: p2.y }
);
if (intersect) {
intersections.push(intersect);
}
}
if (!intersections.length) {
return bounds;
}
console.log('UIO intersections', intersections);
if (intersections.length > 1) {
// More intersections, find the one nearest to edge end point
intersections.sort(function (p, q) {
const pdx = p.x - outsidePoint.x;
const pdy = p.y - outsidePoint.y;
const distp = Math.sqrt(pdx * pdx + pdy * pdy);
const qdx = q.x - outsidePoint.x;
const qdy = q.y - outsidePoint.y;
const distq = Math.sqrt(qdx * qdx + qdy * qdy);
return distp < distq ? -1 : distp === distq ? 0 : 1;
});
}
return intersections[0];
};
export const intersection = (node, outsidePoint, insidePoint) => {
log.debug(`intersection calc abc89:
outsidePoint: ${JSON.stringify(outsidePoint)}
insidePoint : ${JSON.stringify(insidePoint)}
node : x:${node.x} y:${node.y} w:${node.width} h:${node.height}`);
const x = node.x;
const y = node.y;
const dx = Math.abs(x - insidePoint.x);
// const dy = Math.abs(y - insidePoint.y);
const w = node.width / 2;
let r = insidePoint.x < outsidePoint.x ? w - dx : w + dx;
const h = node.height / 2;
const Q = Math.abs(outsidePoint.y - insidePoint.y);
const R = Math.abs(outsidePoint.x - insidePoint.x);
if (Math.abs(y - outsidePoint.y) * w > Math.abs(x - outsidePoint.x) * h) {
// Intersection is top or bottom of rect.
const q = insidePoint.y < outsidePoint.y ? outsidePoint.y - h - y : y - h - outsidePoint.y;
r = (R * q) / Q;
const res = {
x: insidePoint.x < outsidePoint.x ? insidePoint.x + r : insidePoint.x - R + r,
y: insidePoint.y < outsidePoint.y ? insidePoint.y + Q - q : insidePoint.y - Q + q,
};
if (r === 0) {
res.x = outsidePoint.x;
res.y = outsidePoint.y;
}
if (R === 0) {
res.x = outsidePoint.x;
}
if (Q === 0) {
res.y = outsidePoint.y;
}
log.debug(`abc89 topp/bott calc, Q ${Q}, q ${q}, R ${R}, r ${r}`, res); // cspell: disable-line
return res;
} else {
// Intersection onn sides of rect
if (insidePoint.x < outsidePoint.x) {
r = outsidePoint.x - w - x;
} else {
// r = outsidePoint.x - w - x;
r = x - w - outsidePoint.x;
}
const q = (Q * r) / R;
// OK let _x = insidePoint.x < outsidePoint.x ? insidePoint.x + R - r : insidePoint.x + dx - w;
// OK let _x = insidePoint.x < outsidePoint.x ? insidePoint.x + R - r : outsidePoint.x + r;
let _x = insidePoint.x < outsidePoint.x ? insidePoint.x + R - r : insidePoint.x - R + r;
// let _x = insidePoint.x < outsidePoint.x ? insidePoint.x + R - r : outsidePoint.x + r;
let _y = insidePoint.y < outsidePoint.y ? insidePoint.y + q : insidePoint.y - q;
log.debug(`sides calc abc89, Q ${Q}, q ${q}, R ${R}, r ${r}`, { _x, _y });
if (r === 0) {
_x = outsidePoint.x;
_y = outsidePoint.y;
}
if (R === 0) {
_x = outsidePoint.x;
}
if (Q === 0) {
_y = outsidePoint.y;
}
return { x: _x, y: _y };
}
};
const outsideNode = (node, point) => {
console.log('Checking bounds ', node, point);
const x = node.x;
const y = node.y;
const dx = Math.abs(point.x - x);
const dy = Math.abs(point.y - y);
const w = node.width / 2;
const h = node.height / 2;
if (dx >= w || dy >= h) {
return true;
}
return false;
};
/**
* This function will page a path and node where the last point(s) in the path is inside the node
* and return an update path ending by the border of the node.
*
* @param {Array} _points
* @param {any} bounds
* @returns {Array} Points
*/
const cutPathAtIntersect = (_points, bounds, isDiamond: boolean) => {
console.log('UIO cutPathAtIntersect Points:', _points, 'node:', bounds, 'isDiamond', isDiamond);
const points = [];
let lastPointOutside = _points[0];
let isInside = false;
_points.forEach((point) => {
// const node = clusterDb[edge.toCluster].node;
console.log(' checking point', point, bounds);
// check if point is inside the boundary rect
if (!outsideNode(bounds, point) && !isInside) {
// First point inside the rect found
// Calc the intersection coord between the point anf the last point outside the rect
let inter;
if (isDiamond) {
const inter2 = diamondIntersection(bounds, lastPointOutside, point);
const distance = Math.sqrt(
(lastPointOutside.x - inter2.x) ** 2 + (lastPointOutside.y - inter2.y) ** 2
);
if (distance > 1) {
inter = inter2;
}
}
if (!inter) {
inter = intersection(bounds, lastPointOutside, point);
}
// Check case where the intersection is the same as the last point
let pointPresent = false;
points.forEach((p) => {
pointPresent = pointPresent || (p.x === inter.x && p.y === inter.y);
});
// if (!pointPresent) {
if (!points.some((e) => e.x === inter.x && e.y === inter.y)) {
points.push(inter);
} else {
console.log('abc88 no intersect', inter, points);
}
// points.push(inter);
isInside = true;
} else {
// Outside
console.log('abc88 outside', point, lastPointOutside, points);
lastPointOutside = point;
// points.push(point);
if (!isInside) {
points.push(point);
}
}
});
console.log('returning points', points);
return points;
};

2
packages/mermaid/src/diagrams/flowchart/flowDb.ts
View File

@ -866,7 +866,7 @@ export const getData = () => {
label: subGraph.title,
labelStyle: '',
parentId: parentDB.get(subGraph.id),
padding: config.flowchart?.padding ?? 8,
padding: 8,
cssCompiledStyles: getCompiledStyles(subGraph.classes),
cssClasses: subGraph.classes.join(' '),
shape: 'rect',

2
packages/mermaid/src/diagrams/flowchart/flowRenderer-v3-unified.ts
View File

@ -49,7 +49,7 @@ export const draw = async function (text: string, id: string, _version: string,
data4Layout.diagramId = id;
log.debug('REF1:', data4Layout);
await render(data4Layout, svg, element);
const padding = 8;
const padding = data4Layout.config.flowchart?.padding ?? 8;
utils.insertTitle(
element,
'statediagramTitleText',

2
packages/mermaid/src/diagrams/state/dataFetcher.js
View File

@ -372,7 +372,7 @@ export const dataFetcher = (
groupData.id = parentNodeId;
//add parent id to noteData
noteData.parentId = parentNodeId;
nodeData.parentId = parentNodeId;
//nodeData.parentId = parentNodeId;
//insert groupData
insertOrUpdateNode(nodes, groupData, classes);

3
packages/mermaid/src/diagrams/state/stateDb.js
View File

@ -12,6 +12,7 @@ import {
getDiagramTitle,
} from '../common/commonDb.js';
import { dataFetcher, reset as resetDataFetching } from './dataFetcher.js';
import { getDir } from './stateRenderer-v3-unified.js';
import {
DEFAULT_DIAGRAM_DIRECTION,
@ -588,7 +589,7 @@ const trimColon = (str) => (str && str[0] === ':' ? str.substr(1).trim() : str.t
export const getData = () => {
const config = getConfig();
return { nodes, edges, other: {}, config };
return { nodes, edges, other: {}, config, direction: getDir(getRootDocV2()) };
};
export default {

4
packages/mermaid/src/diagrams/state/stateRenderer-v3-unified.ts
View File

@ -48,7 +48,7 @@ export const draw = async function (text: string, id: string, _version: string,
// Not related to the refactoring, but this is the first step in the rendering process
diag.db.extract(diag.db.getRootDocV2());
const DIR = getDir(diag.db.getRootDocV2());
//const DIR = getDir(diag.db.getRootDocV2());
// The getData method provided in all supported diagrams is used to extract the data from the parsed structure
// into the Layout data format
@ -59,7 +59,6 @@ export const draw = async function (text: string, id: string, _version: string,
data4Layout.type = diag.type;
data4Layout.layoutAlgorithm = layout;
data4Layout.direction = DIR;
// TODO: Should we move these two to baseConfig? These types are not there in StateConfig.
@ -82,4 +81,5 @@ export const draw = async function (text: string, id: string, _version: string,
export default {
getClasses,
draw,
getDir,
};

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

@ -55,17 +55,18 @@ const rect = async (parent, node) => {
const padding = 0 * node.padding;
const width = node.width <= bbox.width + padding ? bbox.width + padding : node.width;
if (node.width <= bbox.width + padding) {
node.diff = (bbox.width - node.width) / 2 - node.padding / 2;
const width =
(node.width <= bbox.width + node.padding ? bbox.width + node.padding : node.width) + padding;
if (node.width <= bbox.width + node.padding) {
node.diff = (width - node.width) / 2 - node.padding;
} else {
node.diff = -node.padding / 2;
node.diff = -node.padding;
}
const totalWidth = width + padding;
const totalHeight = node.height + padding;
const x = node.x - totalWidth / 2;
const y = node.y - totalHeight / 2;
const height = node.height;
const x = node.x - width / 2;
const y = node.y - height / 2;
// console.log('UIO diff 2', node.id, node.diff, 'totalWidth: ', width);
log.trace('Data ', node, JSON.stringify(node));
let rect;
@ -80,9 +81,8 @@ const rect = async (parent, node) => {
fillWeight: 3,
seed: handdrawnSeed,
});
const roughNode = rc.path(createRoundedRectPathD(x, y, totalWidth, totalHeight, 0), options);
const roughNode = rc.path(createRoundedRectPathD(x, y, width, height, 0), options);
// console.log('Rough node insert CXC', roughNode);
rect = shapeSvg.insert(() => {
log.debug('Rough node insert CXC', roughNode);
return roughNode;
@ -97,8 +97,8 @@ const rect = async (parent, node) => {
.attr('ry', node.ry)
.attr('x', x)
.attr('y', y)
.attr('width', totalWidth)
.attr('height', totalHeight);
.attr('width', width)
.attr('height', height);
}
const { subGraphTitleTopMargin } = getSubGraphTitleMargins(siteConfig);
labelEl.attr(
@ -116,8 +116,11 @@ const rect = async (parent, node) => {
// Center the label
const rectBox = rect.node().getBBox();
node.offsetX = 0;
node.width = rectBox.width;
node.height = rectBox.height;
// Used by layout engine to position subgraph in parent
node.offsetY = bbox.height - node.padding / 2;
node.intersect = function (point) {
return intersectRect(node, point);
@ -163,6 +166,7 @@ const noteGroup = (parent, node) => {
return { cluster: shapeSvg, labelBBox: { width: 0, height: 0 } };
};
const roundedWithTitle = async (parent, node) => {
const siteConfig = getConfig();
@ -200,6 +204,7 @@ const roundedWithTitle = async (parent, node) => {
dv.attr('height', bbox.height);
}
// Rounded With Title
const padding = 0 * node.padding;
const halfPadding = padding / 2;
@ -211,12 +216,6 @@ const roundedWithTitle = async (parent, node) => {
node.diff = -node.padding;
}
// if (node.id === 'Apa0') {
// console.log('XBX here', node);
// node.y += 10;
// } else {
// console.log('XBX there', node);
// }
const height = node.height + padding;
// const height = node.height + padding;
const innerHeight = node.height + padding - bbox.height - 6;
@ -293,7 +292,7 @@ const divider = (parent, node) => {
const siteConfig = getConfig();
const { themeVariables, handdrawnSeed } = siteConfig;
const { compositeTitleBackground, nodeBorder } = themeVariables;
const { nodeBorder } = themeVariables;
// Add outer g element
const shapeSvg = parent

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

@ -465,13 +465,6 @@ export const insertEdge = function (elem, edge, clusterDb, diagramType, startNod
const tail = startNode;
var head = endNode;
log.info(
'abc88 InsertEdge Start: ',
edge.start,
'-->',
edge.end,
JSON.stringify(points, null, 2)
);
if (head.intersect && tail.intersect) {
// log.info('abc88 InsertEdge: 0.5', edge.start, '-->', edge.end, JSON.stringify(points));
points = points.slice(1, edge.points.length - 1);

17947
pnpm-lock.yaml generated
View File

File diff suppressed because it is too large Load Diff