Add diamond shape

Author: zenkyomu

demo/shapes.html

@@ -14,7 +14,8 @@
 
 .node rect,
 .node circle,
-.node ellipse {
+.node ellipse,
+.node polygon {
   stroke: #333;
   fill: #fff;
   stroke-width: 1.5px;
@@ -42,6 +43,7 @@ <h1>Dagre D3 Demo: Shapes</h1>
 g.setNode("rect", { shape: "rect" });
 g.setNode("circle", { shape: "circle" });
 g.setNode("ellipse", { shape: "ellipse" });
+g.setNode("diamond", { shape: "diamond" });
 
 var svg = d3.select("svg"),
     inner = svg.select("g");

lib/shapes.js

@@ -2,12 +2,14 @@
 
 var intersectRect = require("./intersect/intersect-rect"),
     intersectEllipse = require("./intersect/intersect-ellipse"),
-    intersectCircle = require("./intersect/intersect-circle");
+    intersectCircle = require("./intersect/intersect-circle"),
+    intersectPolygon = require("./intersect/intersect-polygon");
 
 module.exports = {
   rect: rect,
   ellipse: ellipse,
-  circle: circle
+  circle: circle,
+  diamond: diamond
 };
 
 function rect(parent, bbox, node) {
@@ -55,3 +57,25 @@ function circle(parent, bbox, node) {
 
   return shapeSvg;
 }
+
+// Circumscribe an ellipse for the bounding box with a diamond shape. I derived
+// the function to calculate the diamond shape from:
+// http://mathforum.org/kb/message.jspa?messageID=3750236
+function diamond(parent, bbox, node) {
+  var w = (bbox.width * Math.SQRT2) / 2,
+      h = (bbox.height * Math.SQRT2) / 2,
+      points = [
+        { x:  0, y: -h },
+        { x: -w, y:  0 },
+        { x:  0, y:  h },
+        { x:  w, y:  0 }
+      ],
+      shapeSvg = parent.insert("polygon", ":first-child")
+        .attr("points", points.map(function(p) { return p.x + "," + p.y; }).join(" "));
+
+  node.intersect = function(p) {
+    return intersectPolygon(node, points, p);
+  };
+
+  return shapeSvg;
+}