From c714a7a28c03a028c5ccd1e701932019161047d4 Mon Sep 17 00:00:00 2001 From: brook hong Date: Thu, 16 Feb 2017 22:50:39 +0800 Subject: [PATCH] Fixed #456 sequenceDiagram: dotted line for alt and empty bracket should be hidden And draw label with right bottom corner cut --- dist/mermaid.js | 29 +++++++++++------------ src/diagrams/sequenceDiagram/svgDraw.js | 31 ++++++++++++------------- test/web.html | 16 +++++++++++++ 3 files changed, 45 insertions(+), 31 deletions(-) diff --git a/dist/mermaid.js b/dist/mermaid.js index a4a529fa7..cc3a7ad67 100644 --- a/dist/mermaid.js +++ b/dist/mermaid.js @@ -57861,17 +57861,16 @@ exports.drawText = function (elem, textData, width) { }; exports.drawLabel = function (elem, txtObject) { - var rectData = exports.getNoteRect(); - rectData.x = txtObject.x; - rectData.y = txtObject.y; - rectData.width = 50; - rectData.height = 20; - rectData.fill = '#526e52'; - rectData.stroke = 'none'; - rectData['class'] = 'labelBox'; - //rectData.color = 'white'; - - exports.drawRect(elem, rectData); + function genPoints(x, y, width, height, cut) { + return x + "," + y + " " + + (x + width) + "," + y + " " + + (x + width) + "," + (y + height - cut) + " " + + (x + width - cut * 1.2) + "," + (y + height) + " " + + (x) + "," + (y + height); + } + var polygon = elem.append("polygon"); + polygon.attr("points" , genPoints(txtObject.x, txtObject.y, 50, 20, 7)); + polygon.attr("style", "fill:#e4db14;stroke:none"); txtObject.y = txtObject.y + txtObject.labelMargin; txtObject.x = txtObject.x + 0.5 * txtObject.labelMargin; @@ -57938,14 +57937,14 @@ exports.drawActivation = function (elem, bounds, verticalPos) { exports.drawLoop = function (elem, bounds, labelText, conf) { var g = elem.append('g'); var drawLoopLine = function drawLoopLine(startx, starty, stopx, stopy) { - g.append('line').attr('x1', startx).attr('y1', starty).attr('x2', stopx).attr('y2', stopy).attr('stroke-width', 2).attr('stroke', '#526e52').attr('class', 'loopLine'); + return g.append('line').attr('x1', startx).attr('y1', starty).attr('x2', stopx).attr('y2', stopy).attr('stroke-width', 2).attr('stroke', '#526e52').attr('class', 'loopLine'); }; drawLoopLine(bounds.startx, bounds.starty, bounds.stopx, bounds.starty); drawLoopLine(bounds.stopx, bounds.starty, bounds.stopx, bounds.stopy); drawLoopLine(bounds.startx, bounds.stopy, bounds.stopx, bounds.stopy); drawLoopLine(bounds.startx, bounds.starty, bounds.startx, bounds.stopy); if (typeof bounds.elsey !== 'undefined') { - drawLoopLine(bounds.startx, bounds.elsey, bounds.stopx, bounds.elsey); + drawLoopLine(bounds.startx, bounds.elsey, bounds.stopx, bounds.elsey).style('stroke-dasharray', '3, 3'); } var txt = exports.getTextObj(); @@ -57967,7 +57966,7 @@ exports.drawLoop = function (elem, bounds, labelText, conf) { exports.drawText(g, txt); - if (typeof bounds.elseText !== 'undefined') { + if (typeof bounds.elseText !== 'undefined' && bounds.elseText !== "") { txt.text = '[ ' + bounds.elseText + ' ]'; txt.y = bounds.elsey + 1.5 * conf.boxMargin; exports.drawText(g, txt); @@ -59155,4 +59154,4 @@ var isSubstringInArray = function isSubstringInArray(str, arr) { exports.isSubstringInArray = isSubstringInArray; },{"./logger":131}]},{},[132])(132) -}); \ No newline at end of file +}); diff --git a/src/diagrams/sequenceDiagram/svgDraw.js b/src/diagrams/sequenceDiagram/svgDraw.js index 16204c763..96ab0d02c 100644 --- a/src/diagrams/sequenceDiagram/svgDraw.js +++ b/src/diagrams/sequenceDiagram/svgDraw.js @@ -58,21 +58,20 @@ exports.drawText = function(elem, textData, width) { return textElem; }; -exports.drawLabel = function(elem , txtObject){ - var rectData = exports.getNoteRect(); - rectData.x = txtObject.x; - rectData.y = txtObject.y; - rectData.width = 50; - rectData.height = 20; - rectData.fill = '#526e52'; - rectData.stroke = 'none'; - rectData.class = 'labelBox'; - //rectData.color = 'white'; - - exports.drawRect(elem, rectData); +exports.drawLabel = function (elem, txtObject) { + function genPoints(x, y, width, height, cut) { + return x + "," + y + " " + + (x + width) + "," + y + " " + + (x + width) + "," + (y + height - cut) + " " + + (x + width - cut * 1.2) + "," + (y + height) + " " + + (x) + "," + (y + height); + } + var polygon = elem.append("polygon"); + polygon.attr("points" , genPoints(txtObject.x, txtObject.y, 50, 20, 7)); + polygon.attr("style", "fill:#e4db14;stroke:none"); txtObject.y = txtObject.y + txtObject.labelMargin; - txtObject.x = txtObject.x + 0.5*txtObject.labelMargin; + txtObject.x = txtObject.x + 0.5 * txtObject.labelMargin; txtObject.fill = 'white'; exports.drawText(elem, txtObject); @@ -145,7 +144,7 @@ exports.drawActivation = function(elem,bounds,verticalPos){ exports.drawLoop = function(elem,bounds,labelText, conf){ var g = elem.append('g'); var drawLoopLine = function(startx,starty,stopx,stopy){ - g.append('line') + return g.append('line') .attr('x1', startx) .attr('y1', starty) .attr('x2', stopx ) @@ -159,7 +158,7 @@ exports.drawLoop = function(elem,bounds,labelText, conf){ drawLoopLine(bounds.startx, bounds.stopy , bounds.stopx , bounds.stopy ); drawLoopLine(bounds.startx, bounds.starty, bounds.startx, bounds.stopy ); if(typeof bounds.elsey !== 'undefined'){ - drawLoopLine(bounds.startx, bounds.elsey, bounds.stopx, bounds.elsey ); + drawLoopLine(bounds.startx, bounds.elsey, bounds.stopx, bounds.elsey).style('stroke-dasharray', '3, 3'); } var txt = exports.getTextObj(); @@ -181,7 +180,7 @@ exports.drawLoop = function(elem,bounds,labelText, conf){ exports.drawText(g,txt); - if(typeof bounds.elseText !== 'undefined') { + if (typeof bounds.elseText !== 'undefined' && bounds.elseText !== "") { txt.text = '[ ' + bounds.elseText + ' ]'; txt.y = bounds.elsey + 1.5 * conf.boxMargin; exports.drawText(g, txt); diff --git a/test/web.html b/test/web.html index 1ea5bc565..3634257a2 100644 --- a/test/web.html +++ b/test/web.html @@ -226,6 +226,22 @@ end +
+ sequenceDiagram + loop Daily query + Alice->>Bob: Hello Bob, how are you? + alt is sick + Bob->>Alice: Not so good :( + else + Bob->>Alice: Feeling fresh like a daisy + end + opt Extra response + Bob->>Alice: Thanks for asking + end + + end +
+
graph LR; A[Start]-->B{a = '1,2'}