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

Fix flowchart cut off issue

Browse Source
This commit is contained in:
Tyler Long
2018-03-20 20:08:52 +08:00
parent 01541a3dc1
commit 33da5bcee1
3 changed files with 16 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
dist/index.html vendored
View File

@@ -7,6 +7,16 @@
<link rel="icon" type="image/png" href="data:image/png;base64,iVBORw0KGgo="> <link rel="icon" type="image/png" href="data:image/png;base64,iVBORw0KGgo=">
</head> </head>
<body> <body>
<div class="mermaid">
graph TD
A-->B
A-->C
A-->Z
A-->Y
B-->Y
Z-->Y
Y-->A
</div>
<div class="mermaid"> <div class="mermaid">
graph TD graph TD
9e122290_1ec3_e711_8c5a_005056ad0002("fa:fa-creative-commons My System | Test Environment") 9e122290_1ec3_e711_8c5a_005056ad0002("fa:fa-creative-commons My System | Test Environment")
@@ -208,7 +218,7 @@ Class08 <--> C2: Cool label
theme: 'forest', theme: 'forest',
// themeCSS: '.node rect { fill: red; }', // themeCSS: '.node rect { fill: red; }',
logLevel: 3, logLevel: 3,
flowchart: { curve: 'basis' }, flowchart: { curve: 'linear' },
gantt: { axisFormat: '%m/%d/%Y' }, gantt: { axisFormat: '%m/%d/%Y' },
sequence: { actorMargin: 50 }, sequence: { actorMargin: 50 },
// sequenceDiagram: { actorMargin: 300 } // deprecated // sequenceDiagram: { actorMargin: 300 } // deprecated

2
package.json
View File

@@ -1,6 +1,6 @@
{ {
"name": "mermaid", "name": "mermaid",
"version": "8.0.0-rc.1", "version": "8.0.0-rc.2",
"description": "Markdownish syntax for generating flowcharts, sequence diagrams, class diagrams, gantt charts and git graphs.", "description": "Markdownish syntax for generating flowcharts, sequence diagrams, class diagrams, gantt charts and git graphs.",
"main": "dist/mermaid.core.js", "main": "dist/mermaid.core.js",
"keywords": [ "keywords": [

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

@@ -409,8 +409,8 @@ export const draw = function (text, id) {
// Center the graph // Center the graph
svg.attr('height', '100%') svg.attr('height', '100%')
svg.attr('width', conf.width) svg.attr('width', conf.width)
svg.attr('viewBox', '0 0 ' + (g.graph().width + 20) + ' ' + (g.graph().height + 20)) svg.attr('viewBox', '0 0 ' + (g.graph().width + 40) + ' ' + (g.graph().height + 40))
svg.attr('style', 'max-width:' + (g.graph().width + 20) + 'px;') svg.attr('style', 'max-width:' + (g.graph().width + 40) + 'px;')
} else { } else {
// Center the graph // Center the graph
svg.attr('height', g.graph().height) svg.attr('height', g.graph().height)
@@ -419,8 +419,9 @@ export const draw = function (text, id) {
} else { } else {
svg.attr('width', conf.width) svg.attr('width', conf.width)
} }
svg.attr('viewBox', '0 0 ' + (g.graph().width + 20) + ' ' + (g.graph().height + 20)) svg.attr('viewBox', '0 0 ' + (g.graph().width + 40) + ' ' + (g.graph().height + 40))
} }
svg.select('g').attr('transform', 'translate(20, 20)')
// Index nodes // Index nodes
flowDb.indexNodes('subGraph' + i) flowDb.indexNodes('subGraph' + i)