marcel/mermaid
1
0
Fork 0
mirror of https://github.com/mermaid-js/mermaid.git synced 2025-08-16 06:49:31 +02:00
Code Issues Packages Projects Releases Wiki Activity

Support flowchart curve as option

Browse Source
This commit is contained in:
Tyler Long
2018-03-17 23:05:14 +08:00
parent 52d0605066
commit f1d2808594
5 changed files with 14 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
dist/index.html vendored
View File

@@ -9,9 +9,9 @@
<body> <body>
<div class="mermaid"> <div class="mermaid">
graph TB graph TB
subgraph One subgraph One
a1-->a2 a1-->a2
end end
</div> </div>
<div class="mermaid"> <div class="mermaid">
graph LR graph LR
@@ -143,6 +143,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' },
gantt: { axisFormat: '%m/%d/%Y' }, gantt: { axisFormat: '%m/%d/%Y' },
sequence: { actorMargin: 50 }, sequence: { actorMargin: 50 },
}); });

2
package.json
View File

@@ -1,6 +1,6 @@
{ {
"name": "mermaid", "name": "mermaid",
"version": "8.0.0-beta.6", "version": "8.0.0-beta.7",
"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

@@ -5,6 +5,7 @@ import flowDb from './flowDb'
import flow from './parser/flow' import flow from './parser/flow'
import dagreD3 from 'dagre-d3-renderer' import dagreD3 from 'dagre-d3-renderer'
import { logger } from '../../logger' import { logger } from '../../logger'
import { interpolateToCurve } from '../../utils'
const conf = { const conf = {
} }
@@ -174,9 +175,11 @@ export const addEdges = function (edges, g) {
edgeData.style = style edgeData.style = style
if (typeof edge.interpolate !== 'undefined') { if (typeof edge.interpolate !== 'undefined') {
edgeData.lineInterpolate = edge.interpolate edgeData.curve = interpolateToCurve(edge.interpolate, d3.curveLinear)
} else if (typeof edges.defaultInterpolate !== 'undefined') { } else if (typeof edges.defaultInterpolate !== 'undefined') {
edgeData.lineInterpolate = edges.defaultInterpolate edgeData.curve = interpolateToCurve(edges.defaultInterpolate, d3.curveLinear)
} else {
edgeData.curve = interpolateToCurve(conf.curve, d3.curveLinear)
} }
if (typeof edge.text === 'undefined') { if (typeof edge.text === 'undefined') {

4
src/mermaidAPI.js
View File

@@ -87,7 +87,9 @@ const config = {
* **useMaxWidth** - Flag for setting whether or not a all available width should be used for * **useMaxWidth** - Flag for setting whether or not a all available width should be used for
* the diagram. * the diagram.
*/ */
useMaxWidth: true useMaxWidth: true,
curve: 'linear'
}, },
/** /**

3
todo.md
View File

@@ -1,8 +1,7 @@
- Get familar with jison - Get familar with jison
- git graph requires a blank line at the end. why? - git graph requires a blank line at the end. why?
- Create a desktop client - Create a desktop client
- Flowchart `interpolate` is useless because there is no rendering code using it - Replace all `lineInterpolate` with `curve`
I have the feeling that the flowchart DSL is not very readable or expressive despite it is short. I have the feeling that the flowchart DSL is not very readable or expressive despite it is short.
And it is too limited for complicated requirements such as: https://github.com/knsv/mermaid/issues/592 And it is too limited for complicated requirements such as: https://github.com/knsv/mermaid/issues/592