diff --git a/src/diagrams/flowchart/flowRenderer.js b/src/diagrams/flowchart/flowRenderer.js index a14d69a82..e0293b5b4 100644 --- a/src/diagrams/flowchart/flowRenderer.js +++ b/src/diagrams/flowchart/flowRenderer.js @@ -111,6 +111,9 @@ exports.addVertices = function (vert, g) { case 'circle': _shape = 'circle'; break; + case 'ellipse': + _shape = 'ellipse'; + break; case 'group': _shape = 'rect'; verticeText = ''; diff --git a/src/diagrams/flowchart/parser/flow.jison b/src/diagrams/flowchart/parser/flow.jison index 55ad5d0cd..73fa376ca 100644 --- a/src/diagrams/flowchart/parser/flow.jison +++ b/src/diagrams/flowchart/parser/flow.jison @@ -57,6 +57,8 @@ \s*\-\-\s* return '--'; \s*\-\.\s* return '-.'; \s*\=\=\s* return '=='; +"(-" return '(-'; +"-)" return '-)'; \- return 'MINUS'; "." return 'DOT'; \+ return 'PLUS'; @@ -245,6 +247,10 @@ vertex: alphaNum SQS text SQE {$$ = $1;yy.addVertex($1,$4,'circle');} | alphaNum PS PS text PE PE spaceList {$$ = $1;yy.addVertex($1,$4,'circle');} + | alphaNum '(-' text '-)' + {$$ = $1;yy.addVertex($1,$3,'ellipse');} + | alphaNum '(-' text '-)' spaceList + {$$ = $1;yy.addVertex($1,$3,'ellipse');} | alphaNum PS text PE {$$ = $1;yy.addVertex($1,$3,'round');} | alphaNum PS text PE spaceList diff --git a/src/diagrams/flowchart/parser/flow.spec.js b/src/diagrams/flowchart/parser/flow.spec.js index 1bfcdd5b4..6f2cb52cd 100644 --- a/src/diagrams/flowchart/parser/flow.spec.js +++ b/src/diagrams/flowchart/parser/flow.spec.js @@ -922,6 +922,7 @@ describe('when parsing ',function(){ expect(vert['A'].type).toBe('square'); expect(vert['A'].text).toBe('chimpansen hoppar ()[]'); }); + it('should handle text in circle vertices with space',function(){ var res = flow.parser.parse('graph TD;A((chimpansen hoppar))-->C;'); @@ -932,6 +933,16 @@ describe('when parsing ',function(){ expect(vert['A'].text).toBe('chimpansen hoppar'); }); + it('should handle text in ellipse vertices', function(){ + var res = flow.parser.parse('graph TD\nA(-this is an ellipse-)-->B'); + + var vert = flow.parser.yy.getVertices(); + var edges = flow.parser.yy.getEdges(); + + expect(vert['A'].type).toBe('ellipse'); + expect(vert['A'].text).toBe('this is an ellipse'); + }); + it('should handle text in diamond vertices with space',function(){ var res = flow.parser.parse('graph TD;A(chimpansen hoppar)-->C;'); diff --git a/src/less/default/flow.less b/src/less/default/flow.less index 9fdab96c7..f866d72c3 100644 --- a/src/less/default/flow.less +++ b/src/less/default/flow.less @@ -1,6 +1,9 @@ .mermaid .label { color:#333} -.node rect, .node circle, .node polygon { +.node rect, +.node circle, +.node ellipse, +.node polygon { fill: @mainBkg; stroke: @nodeBorder; stroke-width: 1px; @@ -19,4 +22,4 @@ .cluster text { fill:@titleColor; -} \ No newline at end of file +} diff --git a/src/less/forest/flow.less b/src/less/forest/flow.less index 5574e828a..734186005 100644 --- a/src/less/forest/flow.less +++ b/src/less/forest/flow.less @@ -3,7 +3,10 @@ color:#333 } -.node rect, .node circle, .node polygon { +.node rect, +.node circle, +.node ellipse, +.node polygon { fill: @mainBkg; stroke: @nodeBorder; stroke-width: 1px; @@ -23,4 +26,4 @@ color:#333 .cluster text { fill:@titleColor; -} \ No newline at end of file +}