marcel/mermaid
1
0
Fork 0
mirror of https://github.com/mermaid-js/mermaid.git synced 2025-10-11 01:59:41 +02:00
Code Issues Packages Projects Releases Wiki Activity

5237 Fix for edges to diamond shapes and new mermaid version

Browse Source
This commit is contained in:
Knut Sveidqvist
2024-07-31 15:07:28 +02:00
parent 04b31b8672
commit 6346e29f6a
4 changed files with 14 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
packages/mermaid-layout-elk/package.json
View File

@@ -1,6 +1,6 @@
{ {
"name": "@mermaid-chart/layout-elk", "name": "@mermaid-chart/layout-elk",
"version": "0.0.8", "version": "0.0.14",
"description": "ELK layout engine for mermaid", "description": "ELK layout engine for mermaid",
"module": "dist/mermaid-layout-elk.core.mjs", "module": "dist/mermaid-layout-elk.core.mjs",
"types": "dist/packages/mermaid-layout-elk/src/index.d.ts", "types": "dist/packages/mermaid-layout-elk/src/index.d.ts",
@@ -40,4 +40,4 @@
"files": [ "files": [
"dist" "dist"
] ]
} }

2
packages/mermaid-layout-elk/src/layouts.ts
View File

@@ -1,4 +1,4 @@
import type { LayoutLoaderDefinition } from 'mermaid'; import type { LayoutLoaderDefinition } from '@mermaid-chart/mermaid';
const loader = async () => await import(`./render.js`); const loader = async () => await import(`./render.js`);
const algos = ['elk.stress', 'elk.force', 'elk.mrtree', 'elk.sporeOverlap']; const algos = ['elk.stress', 'elk.force', 'elk.mrtree', 'elk.sporeOverlap'];

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

@@ -1,7 +1,8 @@
// @ts-nocheck File not ready to check types // @ts-nocheck File not ready to check types
import { curveLinear } from 'd3'; import { curveLinear } from 'd3';
import ELK from 'elkjs/lib/elk.bundled.js'; import ELK from 'elkjs/lib/elk.bundled.js';
import { type LayoutData } from 'mermaid'; import mermaid from '@mermaid-chart/mermaid';
import { type LayoutData } from '@mermaid-chart/mermaid';
import { type TreeData, findCommonAncestor } from './find-common-ancestor.js'; import { type TreeData, findCommonAncestor } from './find-common-ancestor.js';
const { const {
@@ -503,7 +504,7 @@ export const render = async (data4Layout: LayoutData, svg, element, algorithm) =
// we will position the nodes when we get the layout from elkjs // we will position the nodes when we get the layout from elkjs
elkGraph = await addVertices(nodeEl, data4Layout.nodes, elkGraph); elkGraph = await addVertices(nodeEl, data4Layout.nodes, elkGraph);
// Time for the edges, we start with adding an element in the node to hold the edges // Time for the edges, we start with adding an element in the node to hold the edges
const edgesEl = svg.insert('g').attr('class', 'edges edgePath'); const edgesEl = svg.insert('g').attr('class', 'edges edgePaths');
// Add the edges to the elk graph, this will entail creating the actual edges // Add the edges to the elk graph, this will entail creating the actual edges
elkGraph = await addEdges(data4Layout, elkGraph, svg); elkGraph = await addEdges(data4Layout, elkGraph, svg);
@@ -638,13 +639,18 @@ export const render = async (data4Layout: LayoutData, svg, element, algorithm) =
x: startNode.x + startNode.width / 2 + offset.x, x: startNode.x + startNode.width / 2 + offset.x,
y: startNode.y + startNode.height / 2 + offset.y, y: startNode.y + startNode.height / 2 + offset.y,
}); });
}
if (startNode.shape === 'diamond') {
edge.points.push({ edge.points.push({
x: endNode.x + endNode.width / 2 + offset.x, x: endNode.x + endNode.width / 2 + offset.x,
y: endNode.y + endNode.height / 2 + offset.y, y: endNode.y + endNode.height / 2 + offset.y,
}); });
} }
if (endNode.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 = cutPathAtIntersect(
edge.points.reverse(), edge.points.reverse(),
{ {

2
packages/mermaid/package.json
View File

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