From 8e27318edaae3470a0948dad4f0c44cf275292dd Mon Sep 17 00:00:00 2001 From: knsv Date: Tue, 16 Jul 2019 16:05:22 -0700 Subject: [PATCH] #847 fix for case texts with multiple br tags, explanation in usage doc on how to avoid labels out of bounds. --- dist/index.html | 8 +++++++- docs/usage.md | 10 ++++++++-- src/diagrams/flowchart/flowDb.js | 2 +- 3 files changed, 16 insertions(+), 4 deletions(-) diff --git a/dist/index.html b/dist/index.html index 22c956d77..d33127fe2 100644 --- a/dist/index.html +++ b/dist/index.html @@ -5,6 +5,12 @@ Mermaid Quick Test Page +
@@ -127,7 +133,7 @@
graph TD A[Christmas] -->|Get money| B(Go shopping) - B --> C{Let me thinksssss
ssssssssssssssssssssss
sssssssssssssssssssssssssss} + B --> C{Let me thinksssssx
sssssssssssssssssssuuu
tttsssssssssssssssssssssss} C -->|One| D[Laptop] C -->|Two| E[iPhone] C -->|Three| F[Car] diff --git a/docs/usage.md b/docs/usage.md index 544b2f89c..e48a2c222 100644 --- a/docs/usage.md +++ b/docs/usage.md @@ -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` diff --git a/src/diagrams/flowchart/flowDb.js b/src/diagrams/flowchart/flowDb.js index b777902c0..91dff3898 100644 --- a/src/diagrams/flowchart/flowDb.js +++ b/src/diagrams/flowchart/flowDb.js @@ -20,7 +20,7 @@ const sanitize = text => { let txt = text if (config.securityLevel === 'strict') { txt = txt.replace(/
/g, '#br#') - txt = txt.replace(//g, '#br#') + txt = txt.replace(//g, '#br#') txt = txt.replace(//g, '>') txt = txt.replace(/#br#/g, '
') }