Alana version 11.0.2-b.5, Updated calcIntersections allowing mouse coordinates

This commit is contained in:
Knut Sveidqvist
2024-08-28 11:45:20 +02:00
parent 9c2d7b1dad
commit 62f887b3c3
3 changed files with 28 additions and 14 deletions

View File

@@ -188,12 +188,15 @@
// }; // };
const { svg } = await mermaid.render('the-id-of-the-svg', code, undefined, positions); const { svg } = await mermaid.render('the-id-of-the-svg', code, undefined, positions);
// if (window?.calcIntersections) { if (window?.calcIntersections) {
// console.log('Intersections', window.calcIntersections(positions, 'T', 'U')); console.log(
// } else { 'Intersections',
// console.error('calcIntersections not found'); calcIntersections('T', undefined, positions.nodes['T'], { x: 200, y: 200 })
// } );
console.log(JSON.stringify(positions)); } else {
console.error('calcIntersections not found');
}
// console.log(JSON.stringify(positions));
const elem = document.querySelector('#diagram'); const elem = document.querySelector('#diagram');
elem.innerHTML = svg; elem.innerHTML = svg;
</script> </script>

View File

@@ -1,6 +1,6 @@
{ {
"name": "@mermaid-chart/mermaid", "name": "@mermaid-chart/mermaid",
"version": "11.0.2-b.4", "version": "11.0.2-b.5",
"description": "Markdown-ish syntax for generating flowcharts, mindmaps, sequence diagrams, class diagrams, gantt charts, git graphs and more.", "description": "Markdown-ish syntax for generating flowcharts, mindmaps, sequence diagrams, class diagrams, gantt charts, git graphs and more.",
"type": "module", "type": "module",
"module": "./dist/mermaid.core.mjs", "module": "./dist/mermaid.core.mjs",

View File

@@ -45,7 +45,7 @@ const calcIntersectionPoint = (node, point) => {
return { x: intersection.x, y: intersection.y, pos }; return { x: intersection.x, y: intersection.y, pos };
}; };
const calcIntersections = (points, startNodeId, endNodeId, startNodeSize, endNodeSize) => { const calcIntersections = (startNodeId, endNodeId, startNodeSize, endNodeSize) => {
const startNode = nodeDB.get(startNodeId); const startNode = nodeDB.get(startNodeId);
if (startNodeSize) { if (startNodeSize) {
startNode.x = startNodeSize.x; startNode.x = startNodeSize.x;
@@ -53,18 +53,29 @@ const calcIntersections = (points, startNodeId, endNodeId, startNodeSize, endNod
startNode.width = startNodeSize.width; startNode.width = startNodeSize.width;
startNode.height = startNodeSize.height; startNode.height = startNodeSize.height;
} }
// If no end node it provided but you have an endNode size
// We are adding an edge to a new node
if (!endNodeId && endNodeSize) {
const startIntersection = calcIntersectionPoint(startNode, {
x: endNodeSize.x,
y: endNodeSize.y,
});
const endIntersection = { x: endNodeSize.x, y: endNodeSize.x, pos: 'c' };
return [startIntersection, endIntersection];
}
const endNode = nodeDB.get(endNodeId); const endNode = nodeDB.get(endNodeId);
if (endNodeSize) { if (endNodeSize && endNode) {
endNode.x = endNodeSize.x; endNode.x = endNodeSize.x;
endNode.y = endNodeSize.y; endNode.y = endNodeSize.y;
endNode.width = endNodeSize.width; endNode.width = endNodeSize.width;
endNode.height = endNodeSize.height; endNode.height = endNodeSize.height;
}
// Get the intersections // Get the intersections
const startIntersection = calcIntersectionPoint(startNode, { x: endNode.x, y: endNode.y }); const startIntersection = calcIntersectionPoint(startNode, { x: endNode.x, y: endNode.y });
const endIntersection = calcIntersectionPoint(endNode, { x: startNode.x, y: startNode.y }); const endIntersection = calcIntersectionPoint(endNode, { x: startNode.x, y: startNode.y });
return [startIntersection, endIntersection]; return [startIntersection, endIntersection];
}
return [];
}; };
const doRender = async (_elem, data4Layout, siteConfig, positions) => { const doRender = async (_elem, data4Layout, siteConfig, positions) => {