merge voronoi into delaunay

Author: mbostock

README.md

@@ -984,27 +984,27 @@ Equivalent to [Plot.cell](#plotcelldata-options), except that if the **y** optio
 
 ### Delaunay
 
-Plot provides a handful of marks for Delaunay and Voronoi diagrams (using [d3-delaunay](https://github.com/d3/d3-delaunay) and [Delaunator](https://github.com/mapbox/delaunator)). These marks require the **x** and **y** channels to be specified.
+[Source](./src/marks/delaunay.js) · Plot provides a handful of marks for Delaunay and Voronoi diagrams (using [d3-delaunay](https://github.com/d3/d3-delaunay) and [Delaunator](https://github.com/mapbox/delaunator)). These marks require the **x** and **y** channels to be specified.
 
 #### Plot.delaunayLink(*data*, *options*)
 
-[Source](./src/marks/delaunay.js) · Draws links for each edge of the Delaunay triangulation of the points given by the **x** and **y** channels.
+Draws links for each edge of the Delaunay triangulation of the points given by the **x** and **y** channels.
 
 #### Plot.delaunayMesh(*data*, *options*)
 
-[Source](./src/marks/delaunay.js) · Draws a mesh of the Delaunay triangulation of the points given by the **x** and **y** channels.
+Draws a mesh of the Delaunay triangulation of the points given by the **x** and **y** channels.
 
 #### Plot.hull(*data*, *options*)
 
-[Source](./src/marks/delaunay.js) · Draws a convex hull around the points given by the **x** and **y** channels.
+Draws a convex hull around the points given by the **x** and **y** channels.
 
 #### Plot.voronoi(*data*, *options*)
 
-[Source](./src/marks/voronoi.js) · Draws polygons for each cell of the Voronoi tesselation of the points given by the **x** and **y** channels.
+Draws polygons for each cell of the Voronoi tesselation of the points given by the **x** and **y** channels.
 
 #### Plot.voronoiMesh(*data*, *options*)
 
-[Source](./src/marks/voronoi.js) · Draws a mesh for the cell boundaries of the Voronoi tesselation of the points given by the **x** and **y** channels.
+Draws a mesh for the cell boundaries of the Voronoi tesselation of the points given by the **x** and **y** channels.
 
 ### Dot
 

src/index.js

@@ -4,7 +4,7 @@ export {Arrow, arrow} from "./marks/arrow.js";
 export {BarX, BarY, barX, barY} from "./marks/bar.js";
 export {boxX, boxY} from "./marks/box.js";
 export {Cell, cell, cellX, cellY} from "./marks/cell.js";
-export {delaunayLink, delaunayMesh, hull} from "./marks/delaunay.js";
+export {delaunayLink, delaunayMesh, hull, voronoi, voronoiMesh} from "./marks/delaunay.js";
 export {Dot, dot, dotX, dotY, circle, hexagon} from "./marks/dot.js";
 export {Frame, frame} from "./marks/frame.js";
 export {Hexgrid, hexgrid} from "./marks/hexgrid.js";
@@ -17,7 +17,6 @@ export {Text, text, textX, textY} from "./marks/text.js";
 export {TickX, TickY, tickX, tickY} from "./marks/tick.js";
 export {tree, cluster} from "./marks/tree.js";
 export {Vector, vector, vectorX, vectorY} from "./marks/vector.js";
-export {voronoi, voronoiMesh} from "./marks/voronoi.js";
 export {valueof, column} from "./options.js";
 export {filter, reverse, sort, shuffle, basic as transform, initializer} from "./transforms/basic.js";
 export {bin, binX, binY} from "./transforms/bin.js";

src/marks/delaunay.js

@@ -5,14 +5,14 @@ import {Mark} from "../plot.js";
 import {applyChannelStyles, applyDirectStyles, applyIndirectStyles, applyTransform, offset} from "../style.js";
 import {markers, applyMarkers} from "./marker.js";
 
-const linkDefaults = {
+const delaunayLinkDefaults = {
   ariaLabel: "delaunay link",
   fill: "none",
   stroke: "currentColor",
   strokeMiterlimit: 1
 };
 
-const meshDefaults = {
+const delaunayMeshDefaults = {
   ariaLabel: "delaunay mesh",
   fill: null,
   stroke: "currentColor",
@@ -23,10 +23,25 @@ const hullDefaults = {
   ariaLabel: "hull",
   fill: "none",
   stroke: "currentColor",
-  strokeWidth: 1.5
+  strokeWidth: 1.5,
+  strokeMiterlimit: 1
+};
+
+const voronoiDefaults = {
+  ariaLabel: "voronoi",
+  fill: "none",
+  stroke: "currentColor",
+  strokeMiterlimit: 1
 };
 
-export class DelaunayLink extends Mark {
+const voronoiMeshDefaults = {
+  ariaLabel: "voronoi mesh",
+  fill: null,
+  stroke: "currentColor",
+  strokeOpacity: 0.2
+};
+
+class DelaunayLink extends Mark {
   constructor(data, options = {}) {
     const {x, y, z, curve, tension} = options;
     super(
@@ -37,7 +52,7 @@ export class DelaunayLink extends Mark {
         {name: "z", value: z, optional: true}
       ],
       options,
-      linkDefaults
+      delaunayLinkDefaults
     );
     this.curve = Curve(curve, tension);
     markers(this, options);
@@ -105,8 +120,8 @@ export class DelaunayLink extends Mark {
   }
 }
 
-export class DelaunayMesh extends Mark {
-  constructor(data, options = {}, defaults = meshDefaults) {
+class DelaunayMesh extends Mark {
+  constructor(data, options = {}, defaults = delaunayMeshDefaults) {
     const {x, y, z, stroke} = options;
     super(
       data,
@@ -146,7 +161,7 @@ export class DelaunayMesh extends Mark {
   }
 }
 
-export class Hull extends DelaunayMesh {
+class Hull extends DelaunayMesh {
   constructor(data, options = {}) {
     super(data, options, hullDefaults);
   }
@@ -155,6 +170,61 @@ export class Hull extends DelaunayMesh {
   }
 }
 
+class Voronoi extends Mark {
+  constructor(data, options = {}) {
+    const {x, y, z} = options;
+    super(
+      data,
+      [
+        {name: "x", value: x, scale: "x"},
+        {name: "y", value: y, scale: "y"},
+        {name: "z", value: z, optional: true}
+      ],
+      options,
+      voronoiDefaults
+    );
+  }
+  render(index, {x, y}, channels, dimensions) {
+    const {x: X, y: Y, z: Z} = channels;
+    const {dx, dy} = this;
+
+    function cells(index) {
+      const delaunay = Delaunay.from(index, i => X[i], i => Y[i]);
+      const voronoi = voronoiof(delaunay, dimensions);
+      select(this)
+        .selectAll()
+        .data(index)
+        .enter()
+        .append("path")
+          .call(applyDirectStyles, this)
+          .attr("d", (_, i) => voronoi.renderCell(i))
+          .call(applyChannelStyles, this, channels);
+    }
+
+    return create("svg:g")
+        .call(applyIndirectStyles, this, dimensions)
+        .call(applyTransform, x, y, offset + dx, offset + dy)
+        .call(Z
+          ? g => g.selectAll().data(group(index, i => Z[i]).values()).enter().append("g").each(cells)
+          : g => g.datum(index).each(cells))
+      .node();
+  }
+}
+
+function voronoiof(delaunay, dimensions) {
+  const {width, height, marginTop, marginRight, marginBottom, marginLeft} = dimensions;
+  return delaunay.voronoi([marginLeft, marginTop, width - marginRight, height - marginBottom]);
+}
+
+class VoronoiMesh extends DelaunayMesh {
+  constructor(data, options) {
+    super(data, options, voronoiMeshDefaults);
+  }
+  _render(delaunay, dimensions) {
+    return voronoiof(delaunay, dimensions).render();
+  }
+}
+
 export function delaunayMark(DelaunayMark, data, {x, y, ...options} = {}) {
   ([x, y] = maybeTuple(x, y));
   return new DelaunayMark(data, {...options, x, y});
@@ -171,3 +241,12 @@ export function delaunayMesh(data, options) {
 export function hull(data, options) {
   return delaunayMark(Hull, data, options);
 }
+
+// TODO voronoiX, voronoiY?
+export function voronoi(data, options) {
+  return delaunayMark(Voronoi, data, options);
+}
+
+export function voronoiMesh(data, options) {
+  return delaunayMark(VoronoiMesh, data, options);
+}