marcel/mermaid
1
0
Fork 0
mirror of https://github.com/mermaid-js/mermaid.git synced 2025-09-28 11:49:37 +02:00
Code Issues Packages Projects Releases Wiki Activity

Making the font size being configurable and addting the ability set the section font size

Browse Source
This commit is contained in:
Knut Sveidqvist
2021-02-25 10:06:13 +01:00
parent 693de2996a
commit 021bc5f011
5 changed files with 57 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
cypress/platform/knsv.html
View File

@@ -25,17 +25,35 @@
<body>
<h1>info below</h1>
<div class="flex">
<div class="mermaid" style="width: 50%; height: 400px;">
%%{init: { "logLevel": 1, "journey": {"useMaxWidth": false }} }%%
journey
title My working day
section Go to work
Make tea: 5: Me
Go upstairs: 3: Me
Do work: 1: Me, Cat
section Go home
Go downstairs: 5: Me
Sit down: 5: Me
<div class="mermaid" style="width: 100%; height: 400px;">
%%{init: { "logLevel": 1, "gantt": {"sectionFontSize": 6, "fontSize": 16 }} }%%
gantt
dateFormat :YYYY-MM-DD
title Adding GANTT diagram functionality to mermaid
excludes :excludes the named dates/days from being included in a charted task..
section A section
Active task :done, des2, 2014-01-09, 3d
Completed task :done, des1, 2014-01-06, 5d
Future task : des3, after des2, 5d
Future task2 : des4, after des3, 5d
section Critical tasks
Completed task in the critical line :crit, done, 2014-01-06,24h
Implement parser and jison :crit, done, after des1, 2d
Create tests for parser :crit, active, 3d
Future task in critical line :crit, 5d
Create tests for renderer :2d
Add to mermaid :1d
section Documentation
Describe gantt syntax :active, a1, after des1, 3d
Add gantt diagram to demo page :after a1 , 20h
Add another diagram to demo page :doc1, after a1 , 48h
section Last section
Describe gantt syntax :after doc1, 3d
Add gantt diagram to demo page :20h
Add another diagram to demo page :48h
</div>
<div class="mermaid2" style="width: 50%; height: 400px;">
flowchart TD
@@ -116,13 +134,12 @@ A --> B
flowchart: { nodeSpacing: 10, curve: 'cardinal', htmlLabels: true },
htmlLabels: true,
// gantt: { axisFormat: '%m/%d/%Y' },
sequence: { actorFontFamily: 'courier',actorMargin: 50, showSequenceNumbers: true },
sequence: { actorFontFamily: 'courier',actorMargin: 50, showSequenceNumbers: false },
// sequenceDiagram: { actorMargin: 300 } // deprecated
fontFamily: '"arial", sans-serif',
fontFamily: 'courier',
curve: 'cardinal',
securityLevel: 'loose',
sequence:{mirrorActors:false}
});
function callback(){alert('It worked');}
</script>