--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/toolkit/javascript/d3/examples/hull/hull.html Thu Apr 10 14:20:23 2014 +0200
@@ -0,0 +1,75 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <meta http-equiv="Content-Type" content="text/html;charset=utf-8">
+ <title>Convex Hull</title>
+ <script type="text/javascript" src="../../d3.js"></script>
+ <script type="text/javascript" src="../../d3.geom.js"></script>
+ <style type="text/css">
+
+svg {
+ border: solid 1px #aaa;
+ background: #eee;
+}
+
+path {
+ fill: lightsteelblue;
+ stroke: #000;
+}
+
+circle {
+ fill: #fff;
+ stroke: #000;
+}
+
+ </style>
+ </head>
+ <body>
+ <script type="text/javascript">
+
+var w = 960,
+ h = 500;
+
+var vertices = d3.range(15).map(function(d) {
+ return [
+ w / 4 + Math.random() * w / 2,
+ h / 4 + Math.random() * h / 2
+ ];
+});
+
+var svg = d3.select("body")
+ .append("svg:svg")
+ .attr("width", w)
+ .attr("height", h)
+ .attr("pointer-events", "all")
+ .on("mousemove", move)
+ .on("click", click);
+
+update();
+
+function update() {
+ svg.selectAll("path")
+ .data([d3.geom.hull(vertices)])
+ .attr("d", function(d) { return "M" + d.join("L") + "Z"; })
+ .enter().append("svg:path")
+ .attr("d", function(d) { return "M" + d.join("L") + "Z"; });
+
+ svg.selectAll("circle")
+ .data(vertices.slice(1))
+ .enter().append("svg:circle")
+ .attr("transform", function(d) { return "translate(" + d + ")"; })
+ .attr("r", 3);
+}
+
+function move() {
+ vertices[0] = d3.svg.mouse(this);
+ update();
+}
+
+function click() {
+ vertices.push(d3.svg.mouse(this));
+ update();
+}
+ </script>
+ </body>
+</html>