marcel/mermaid
1
0
Fork 0
mirror of https://github.com/mermaid-js/mermaid.git synced 2025-09-16 22:09:57 +02:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #1189 from GDFaber/maintenance/1182_flowchart_remove_newDagreD3

Browse Source 
Maintenance/Remove "newDagreD3" switch from the flowchart renderer
This commit is contained in:
Knut Sveidqvist
2020-01-08 20:56:54 +01:00
committed by GitHub
parent a483f2466f 82b79aa332
commit 7760e63b47
1 changed files with 31 additions and 75 deletions
Download Patch File Download Diff File Expand all files Collapse all files

106
src/diagrams/flowchart/flowRenderer.js
View File

@@ -5,10 +5,7 @@ import flowDb from './flowDb';
import flow from './parser/flow'; import flow from './parser/flow';
import { getConfig } from '../../config'; import { getConfig } from '../../config';
const newDagreD3 = true;
import dagreD3 from 'dagre-d3'; import dagreD3 from 'dagre-d3';
// const newDagreD3 = false;
import addHtmlLabel from 'dagre-d3/lib/label/add-html-label.js'; import addHtmlLabel from 'dagre-d3/lib/label/add-html-label.js';
import { logger } from '../../logger'; import { logger } from '../../logger';
import { interpolateToCurve } from '../../utils'; import { interpolateToCurve } from '../../utils';
@@ -296,39 +293,20 @@ export const draw = function(text, id) {
const rankSpacing = conf.rankSpacing || 50; const rankSpacing = conf.rankSpacing || 50;
// Create the input mermaid.graph // Create the input mermaid.graph
let g; const g = new graphlib.Graph({
// Todo remove newDagreD3 when properly verified multigraph: true,
if (newDagreD3) { compound: true
g = new graphlib.Graph({ })
multigraph: true, .setGraph({
compound: true rankdir: dir,
nodesep: nodeSpacing,
ranksep: rankSpacing,
marginx: 8,
marginy: 8
}) })
.setGraph({ .setDefaultEdgeLabel(function() {
rankdir: dir, return {};
nodesep: nodeSpacing, });
ranksep: rankSpacing,
marginx: 8,
marginy: 8
})
.setDefaultEdgeLabel(function() {
return {};
});
} else {
g = new graphlib.Graph({
multigraph: true,
compound: true
})
.setGraph({
rankdir: dir,
nodesep: nodeSpacing,
ranksep: rankSpacing,
marginx: 20,
marginy: 20
})
.setDefaultEdgeLabel(function() {
return {};
});
}
let subG; let subG;
const subGraphs = flowDb.getSubGraphs(); const subGraphs = flowDb.getSubGraphs();
@@ -412,49 +390,27 @@ export const draw = function(text, id) {
}); });
const padding = 8; const padding = 8;
// Todo remove newDagreD3 when properly verified const svgBounds = svg.node().getBBox();
if (newDagreD3) { const width = svgBounds.width + padding * 2;
const svgBounds = svg.node().getBBox(); const height = svgBounds.height + padding * 2;
const width = svgBounds.width + padding * 2; logger.debug(
const height = svgBounds.height + padding * 2; `new ViewBox 0 0 ${width} ${height}`,
logger.debug( `translate(${padding - g._label.marginx}, ${padding - g._label.marginy})`
`new ViewBox 0 0 ${width} ${height}`, );
`translate(${padding - g._label.marginx}, ${padding - g._label.marginy})`
);
if (conf.useMaxWidth) { if (conf.useMaxWidth) {
svg.attr('width', '100%'); svg.attr('width', '100%');
svg.attr('style', `max-width: ${width}px;`); svg.attr('style', `max-width: ${width}px;`);
} else {
svg.attr('height', height);
svg.attr('width', width);
}
svg.attr('viewBox', `0 0 ${width} ${height}`);
svg
.select('g')
.attr('transform', `translate(${padding - g._label.marginx}, ${padding - svgBounds.y})`);
} else { } else {
const width = g.maxX - g.minX + padding * 2; svg.attr('height', height);
const height = g.maxY - g.minY + padding * 2; svg.attr('width', width);
if (conf.useMaxWidth) {
svg.attr('width', '100%');
svg.attr('style', `max-width: ${width}px;`);
} else {
svg.attr('height', height);
svg.attr('width', width);
}
logger.debug(
`Org ViewBox 0 0 ${width} ${height}`,
`translate(${padding - g.minX}, ${padding - g.minY})\n${location.href}`
);
svg.attr('viewBox', `0 0 ${width} ${height}`);
svg.select('g').attr('transform', `translate(${padding - g.minX}, ${padding - g.minY})`);
// svg.select('g').attr('transform', `translate(${padding - minX}, ${padding - minY})`);
} }
svg.attr('viewBox', `0 0 ${width} ${height}`);
svg
.select('g')
.attr('transform', `translate(${padding - g._label.marginx}, ${padding - svgBounds.y})`);
// Index nodes // Index nodes
flowDb.indexNodes('subGraph' + i); flowDb.indexNodes('subGraph' + i);