#815 Adding possibility to configure elk as renderer for flowcharts

This commit is contained in:
Knut Sveidqvist
2022-12-22 10:33:41 +01:00
parent bb9b0b015e
commit 913ba34386
6 changed files with 99 additions and 27 deletions

View File

@@ -3,11 +3,18 @@ import type { ExternalDiagramDefinition } from 'mermaid';
const id = 'flowchart-v3';
const detector = (txt: string, config) => {
if (config?.flowchart?.defaultRenderer === 'dagre-d3') {
return false;
}
if (config?.flowchart?.defaultRenderer === 'dagre-wrapper') {
return false;
}
// If we have configured to use dagre-wrapper then we should return true in this function for graph code thus making it use the new flowchart diagram
if (config?.flowchart?.defaultRenderer === 'cytoscape' && txt.match(/^\s*graph/) !== null) {
if (txt.match(/^\s*graph/) !== null) {
return true;
}
return txt.match(/^\s*cyto/) !== null;
return txt.match(/^\s*flowchart/) !== null;
};
const loader = async () => {

View File

@@ -247,12 +247,13 @@ const config: Partial<MermaidConfig> = {
/**
* | Parameter | Description | Type | Required | Values |
* | --------------- | ----------- | ------- | -------- | ----------------------- |
* | defaultRenderer | See notes | boolean | 4 | dagre-d3, dagre-wrapper |
* | defaultRenderer | See notes | boolean | 4 | dagre-d3, dagre-wrapper, elk |
*
* **Notes:**
*
* Decides which rendering engine that is to be used for the rendering. Legal values are:
* dagre-d3 dagre-wrapper - wrapper for dagre implemented in mermaid
* dagre-d3 dagre-wrapper - wrapper for dagre implemented in mermaid, elk for layout using
* elkjs
*
* Default value: 'dagre-wrapper'
*/

View File

@@ -1,8 +1,15 @@
import type { DiagramDetector } from '../../diagram-api/types';
export const flowDetectorV2: DiagramDetector = (txt, config) => {
if (config?.flowchart?.defaultRenderer === 'dagre-d3') {
return false;
}
if (config?.flowchart?.defaultRenderer === 'elk') {
return false;
}
// If we have configured to use dagre-wrapper then we should return true in this function for graph code thus making it use the new flowchart diagram
if (config?.flowchart?.defaultRenderer === 'dagre-wrapper' && txt.match(/^\s*graph/) !== null) {
if (txt.match(/^\s*graph/) !== null) {
return true;
}
return txt.match(/^\s*flowchart/) !== null;

View File

@@ -6,5 +6,8 @@ export const flowDetector: DiagramDetector = (txt, config) => {
if (config?.flowchart?.defaultRenderer === 'dagre-wrapper') {
return false;
}
if (config?.flowchart?.defaultRenderer === 'elk') {
return false;
}
return txt.match(/^\s*graph/) !== null;
};