GitHub/mermaid
1
0
Fork 0
mirror of https://github.com/mermaid-js/mermaid.git synced 2025-01-28 07:03:17 +08:00
Code Issues Projects Releases Wiki Activity

#847 fix for case texts with multiple br tags, explanation in usage doc on how to avoid labels out of bounds.

Browse Source
This commit is contained in:
knsv 2019-07-16 16:05:22 -07:00
parent 976d16b0db
commit 8e27318eda
3 changed files with 16 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
dist/index.html vendored
View File

@ -5,6 +5,12 @@
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Mermaid Quick Test Page</title>
<link rel="icon" type="image/png" href="data:image/png;base64,iVBORw0KGgo=">
<style>
div.mermaid {
/* font-family: 'trebuchet ms', verdana, arial; */
font-family: 'Courier New', Courier, monospace !important;
}
</style>
</head>
<body>
<div class="mermaid">
@ -127,7 +133,7 @@
<div class="mermaid">
graph TD
A[Christmas] -->|Get money| B(Go shopping)
B --> C{Let me thinksssss<br/>ssssssssssssssssssssss<br/>sssssssssssssssssssssssssss}
B --> C{Let me thinksssssx<br/>sssssssssssssssssssuuu<br />tttsssssssssssssssssssssss}
C -->|One| D[Laptop]
C -->|Two| E[iPhone]
C -->|Three| F[Car]

10
docs/usage.md
View File

@ -96,8 +96,14 @@ $(document).ready(function() {
});
```
Not doing so will most likely result in mermaid rendering graphs that have labels out of bounds. The default integration
in mermaid uses the window.load event to start rendering.
Not doing so will most likely result in mermaid rendering graphs that have labels out of bounds. The default integration in mermaid uses the window.load event to start rendering. Also note that when rendering the width of lebale sare calucated of what width it bening meassured at the time.
If your page has other fonts in its body those might be used instead of the mermaid font. Specifying the font in your styling is a workaround for this.
```
div.mermaid {
font-family: 'trebuchet ms', verdana, arial;
}
```
### Calling `mermaid.init`

2
src/diagrams/flowchart/flowDb.js
View File

@ -20,7 +20,7 @@ const sanitize = text => {
let txt = text
if (config.securityLevel === 'strict') {
txt = txt.replace(/<br>/g, '#br#')
txt = txt.replace(/<br\S*\/>/g, '#br#')
txt = txt.replace(/<br\S*?\/>/g, '#br#')
txt = txt.replace(/</g, '&lt;').replace(/>/g, '&gt;')
txt = txt.replace(/#br#/g, '<br/>')
}