Added arrow head to async arrow with cross

mermaid-js · Jan 9, 2015 · 36b389b · 36b389b
1 parent 9527237
commit 36b389b
Show file tree

Hide file tree

Showing 5 changed files with 71 additions and 32 deletions.
diff --git a/dist/mermaid.full.js b/dist/mermaid.full.js
@@ -16602,19 +16602,32 @@ exports.insertArrowHead = function(elem){
  * Setup arrow head and define the marker. The result is appended to the svg.
  */
 exports.insertArrowCrossHead = function(elem){
-    elem.append("defs").append("marker")
+    var defs = elem.append("defs");
+    var marker = defs.append("marker")
         .attr("id", "crosshead")
-        .attr("markerWidth", 8)
+        .attr("markerWidth", 15)
         .attr("markerHeight", 8)
         .attr("orient", "auto")
-        .attr("refX", 15)
-        .attr("refY", 4)
-        .append("path")
-        .attr("fill",'none')
-        .attr("stroke",'#000000')
-        .style("stroke-dasharray", ("0, 0"))
-        .attr("stroke-width",'1px')
-        .attr("d", "M 1,1 L 7,7 M 7,1 L 1,7"); //this is actual shape for arrowhead
+        .attr("refX", 16)
+        .attr("refY", 4);
+
+    // The arrow
+    marker.append("path")
+            .attr("fill",'black')
+            .attr("stroke",'#000000')
+            .style("stroke-dasharray", ("0, 0"))
+            .attr("stroke-width",'1px')
+            .attr("d", "M 9,2 V 6 L16,4 Z");
+
+    // The cross
+    marker.append("path")
+            .attr("fill",'none')
+            .attr("stroke",'#000000')
+            .style("stroke-dasharray", ("0, 0"))
+            .attr("stroke-width",'1px')
+            .attr("d", "M 0,1 L 6,7 M 6,1 L 0,7")
+        ; //this is actual shape for arrowhead
+
 };
 
 exports.getTextObj = function(){

diff --git a/dist/mermaid.full.min.js b/dist/mermaid.full.min.js
diff --git a/dist/mermaid.slim.js b/dist/mermaid.slim.js
@@ -16570,19 +16570,32 @@ exports.insertArrowHead = function(elem){
  * Setup arrow head and define the marker. The result is appended to the svg.
  */
 exports.insertArrowCrossHead = function(elem){
-    elem.append("defs").append("marker")
+    var defs = elem.append("defs");
+    var marker = defs.append("marker")
         .attr("id", "crosshead")
-        .attr("markerWidth", 8)
+        .attr("markerWidth", 15)
         .attr("markerHeight", 8)
         .attr("orient", "auto")
-        .attr("refX", 15)
-        .attr("refY", 4)
-        .append("path")
-        .attr("fill",'none')
-        .attr("stroke",'#000000')
-        .style("stroke-dasharray", ("0, 0"))
-        .attr("stroke-width",'1px')
-        .attr("d", "M 1,1 L 7,7 M 7,1 L 1,7"); //this is actual shape for arrowhead
+        .attr("refX", 16)
+        .attr("refY", 4);
+
+    // The arrow
+    marker.append("path")
+            .attr("fill",'black')
+            .attr("stroke",'#000000')
+            .style("stroke-dasharray", ("0, 0"))
+            .attr("stroke-width",'1px')
+            .attr("d", "M 9,2 V 6 L16,4 Z");
+
+    // The cross
+    marker.append("path")
+            .attr("fill",'none')
+            .attr("stroke",'#000000')
+            .style("stroke-dasharray", ("0, 0"))
+            .attr("stroke-width",'1px')
+            .attr("d", "M 0,1 L 6,7 M 6,1 L 0,7")
+        ; //this is actual shape for arrowhead
+
 };
 
 exports.getTextObj = function(){

diff --git a/dist/mermaid.slim.min.js b/dist/mermaid.slim.min.js
diff --git a/src/diagrams/sequenceDiagram/svgDraw.js b/src/diagrams/sequenceDiagram/svgDraw.js
@@ -168,19 +168,32 @@ exports.insertArrowHead = function(elem){
  * Setup arrow head and define the marker. The result is appended to the svg.
  */
 exports.insertArrowCrossHead = function(elem){
-    elem.append("defs").append("marker")
+    var defs = elem.append("defs");
+    var marker = defs.append("marker")
         .attr("id", "crosshead")
-        .attr("markerWidth", 8)
+        .attr("markerWidth", 15)
         .attr("markerHeight", 8)
         .attr("orient", "auto")
-        .attr("refX", 15)
-        .attr("refY", 4)
-        .append("path")
-        .attr("fill",'none')
-        .attr("stroke",'#000000')
-        .style("stroke-dasharray", ("0, 0"))
-        .attr("stroke-width",'1px')
-        .attr("d", "M 1,1 L 7,7 M 7,1 L 1,7"); //this is actual shape for arrowhead
+        .attr("refX", 16)
+        .attr("refY", 4);
+
+    // The arrow
+    marker.append("path")
+            .attr("fill",'black')
+            .attr("stroke",'#000000')
+            .style("stroke-dasharray", ("0, 0"))
+            .attr("stroke-width",'1px')
+            .attr("d", "M 9,2 V 6 L16,4 Z");
+
+    // The cross
+    marker.append("path")
+            .attr("fill",'none')
+            .attr("stroke",'#000000')
+            .style("stroke-dasharray", ("0, 0"))
+            .attr("stroke-width",'1px')
+            .attr("d", "M 0,1 L 6,7 M 6,1 L 0,7")
+        ; //this is actual shape for arrowhead
+
 };
 
 exports.getTextObj = function(){