Mermaid version 11.0.0-b.63

cypress/platform/knsv-pos.html

@@ -101,7 +101,7 @@
         console.error(err);
       };
       let code = `
-stateDiagram
+      stateDiagram
         S:Stillas
         T:Tiger
         U:Ulv
@@ -154,6 +154,11 @@ stateDiagram
       };
 
       const { svg } = await mermaid.render('the-id-of-the-svg', code, undefined, positions);
+      if (window?.calcIntersections) {
+        console.log('Intersections', window.calcIntersections(positions, 'S', 'T'));
+      } else {
+        console.error('calcIntersections not found');
+      }
       // console.log(svg);
       const elem = document.querySelector('#diagram');
       elem.innerHTML = svg;

packages/mermaid/package.json

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

packages/mermaid/src/rendering-util/layout-algorithms/fixed/index.js

@@ -13,7 +13,11 @@ import {
 } from '../../rendering-elements/edges.js';
 import { getConfig } from '../../../diagram-api/diagramAPI.js';
 
-const fixInterSections = (points, startNode, endNode) => {
+let nodeDB = new Map();
+
+const fixInterSections = (points, startNodeId, endNodeId) => {
+  const startNode = nodeDB.get(startNodeId);
+  const endNode = nodeDB.get(endNodeId);
   // Get the intersections
   const startIntersection = startNode.intersect(points[1]);
   const endIntersection = endNode.intersect(points[points.length - 2]);
@@ -24,6 +28,16 @@ const fixInterSections = (points, startNode, endNode) => {
   return fixedPoints;
 };
 
+const calcIntersections = (points, startNodeId, endNodeId) => {
+  const startNode = nodeDB.get(startNodeId);
+  const endNode = nodeDB.get(endNodeId);
+  // Get the intersections
+  const startIntersection = startNode.intersect({ x: endNode.x, y: endNode.y });
+  const endIntersection = endNode.intersect({ x: startNode.x, y: startNode.y });
+
+  return [startIntersection, endIntersection];
+};
+
 const doRender = async (_elem, data4Layout, siteConfig, positions) => {
   const elem = _elem.insert('g').attr('class', 'root');
   elem.insert('g').attr('class', 'clusters');
@@ -34,7 +48,7 @@ const doRender = async (_elem, data4Layout, siteConfig, positions) => {
   // Insert nodes, this will insert them into the dom and each node will get a size. The size is updated
   // to the abstract node and is later used by dagre for the layout
 
-  const nodeDB = {};
+  nodeDB = new Map();
   await Promise.all(
     data4Layout.nodes.map(async function (node) {
       let pos;
@@ -59,7 +73,7 @@ const doRender = async (_elem, data4Layout, siteConfig, positions) => {
         }
         await insertNode(nodes, node, 'TB');
       }
-      nodeDB[node.id] = node;
+      nodeDB.set(node.id, node);
     })
   );
 
@@ -87,11 +101,7 @@ const doRender = async (_elem, data4Layout, siteConfig, positions) => {
   for (const edge of data4Layout.edges) {
     //   log.info('Edge ' + e.v + ' -> ' + e.w + ': ' + JSON.stringify(edge), edge);
 
-    edge.points = fixInterSections(
+    edge.points = fixInterSections(positions.edges[edge.id].points, edge.start, edge.end);
-      positions.edges[edge.id].points,
-      nodeDB[edge.start],
-      nodeDB[edge.end]
-    );
     const paths = insertEdge(
       edgePaths,
       edge,
@@ -103,7 +113,9 @@ const doRender = async (_elem, data4Layout, siteConfig, positions) => {
     paths.updatedPath = paths.originalPath;
     positionEdgeLabel(edge, paths);
   }
-
+  if (window) {
+    window.calcIntersections = calcIntersections;
+  }
   return { elem, diff: 0 };
 };
 /**