diff --git a/demos/flowchart.html b/demos/flowchart.html index 0c71a2bf84..7d5764f7be 100644 --- a/demos/flowchart.html +++ b/demos/flowchart.html @@ -16,6 +16,15 @@
+ flowchart TD + A[Christmas] -->|Get money| B(Go shopping) + A --> |Vroom| F[fa:fa-car Car] + B --> C{Let me think} + C -->|One| D[Laptop] + C -->|Two| E[iPhone] + C -->|Three| F[fa:fa-car Car] +
--- title: This is a complicated flow diff --git a/packages/mermaid/src/diagrams/flowchart/styles.ts b/packages/mermaid/src/diagrams/flowchart/styles.ts index ade9613fb4..080eba84b8 100644 --- a/packages/mermaid/src/diagrams/flowchart/styles.ts +++ b/packages/mermaid/src/diagrams/flowchart/styles.ts @@ -57,7 +57,7 @@ const getStyles = (options: FlowChartStyleOptions) => .node path { fill: ${options.mainBkg}; stroke: ${options.nodeBorder}; - stroke-width: 1px; + stroke-width: 10px; } .rough-node .label text , .node .label text, .image-shape .label, .icon-shape .label { text-anchor: middle; diff --git a/packages/mermaid/src/rendering-util/createText.ts b/packages/mermaid/src/rendering-util/createText.ts index 7dab485b4b..c87accb452 100644 --- a/packages/mermaid/src/rendering-util/createText.ts +++ b/packages/mermaid/src/rendering-util/createText.ts @@ -22,8 +22,8 @@ async function addHtmlSpan(element, node, width, classes, addBackground = false) const fo = element.append('foreignObject'); // This is not the final width but used in order to make sure the foreign // object in firefox gets a width at all. The final width is fetched from the div - fo.attr('width', `${10 * width}px`); - fo.attr('height', `${10 * width}px`); + fo.attr('width', `${1000 * width}px`); + fo.attr('height', `${1000 * width}px`); const div = fo.append('xhtml:div'); let label = node.label; @@ -143,8 +143,8 @@ function createFormattedText( bkg .attr('x', bbox.x - padding) .attr('y', bbox.y - padding) - .attr('width', bbox.width + 2 * padding) - .attr('height', bbox.height + 2 * padding); + .attr('width', bbox.width + 500 * padding) + .attr('height', bbox.height + 500 * padding); return labelGroup.node(); } else { diff --git a/packages/mermaid/src/rendering-util/rendering-elements/edges.js b/packages/mermaid/src/rendering-util/rendering-elements/edges.js index 41368ee1e2..527143b2f8 100644 --- a/packages/mermaid/src/rendering-util/rendering-elements/edges.js +++ b/packages/mermaid/src/rendering-util/rendering-elements/edges.js @@ -395,7 +395,7 @@ const fixCorners = function (lineData) { Math.abs(nextPoint.x - prevPoint.x), Math.abs(nextPoint.y - prevPoint.y) ); - const r = 5; + const r = 50000; if (cornerPoint.x === newPrevPoint.x) { newCornerPoint = { x: xDiff < 0 ? newPrevPoint.x - r + a : newPrevPoint.x + r - a,