Fix flowchart cut off issue

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

12
dist/index.html vendored
View File

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

View File

@@ -1,6 +1,6 @@
{
"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.",
"main": "dist/mermaid.core.js",
"keywords": [

View File

@@ -409,8 +409,8 @@ export const draw = function (text, id) {
// Center the graph
svg.attr('height', '100%')
svg.attr('width', conf.width)
svg.attr('viewBox', '0 0 ' + (g.graph().width + 20) + ' ' + (g.graph().height + 20))
svg.attr('style', 'max-width:' + (g.graph().width + 20) + 'px;')
svg.attr('viewBox', '0 0 ' + (g.graph().width + 40) + ' ' + (g.graph().height + 40))
svg.attr('style', 'max-width:' + (g.graph().width + 40) + 'px;')
} else {
// Center the graph
svg.attr('height', g.graph().height)
@@ -419,8 +419,9 @@ export const draw = function (text, id) {
} else {
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
flowDb.indexNodes('subGraph' + i)