Published
Edited
Dec 23, 2019
6 forks
39 stars
Plot: Voronoi labelsDelaunay edge coloringDelaunay sub-graphsd3-delaunay@6 robustly releasedClip LloydSemi-square voronoiTP3: Power Diagram and Semi-Discrete Optimal TransportSpatial interpolation: Voronoi & Blur (code)Paths Delaunay hoverSelf-Organizing Maps meet DelaunayVoronoiMap2DPolygon TriangulationHello, constrainautorThe Gray-Fuller spatial gridUnconnected Delaunay NeighborsLloyd’s relaxation on a graphManhattan Voronoi IIManhattan VoronoiGraph VoronoiWorld Cities UrquhartUK TricontoursGeo Voronoi interpolationSpherical contoursPetri dish bubblingd3-geo-voronoi and gridded dataDelaunay.findTriangleIris Voronoi 3The Voronoi projectionSouth Africa’s medial axisDirection to shoreDistance to shoret-SNE VoronoiMurphey Butterfly ProjectionAlpha shapes 3Alpha shapes 2So many countries’ VoronoisKruskal MazeOffscreen VoronoiGeo Mesh & fake pointsDrawing Voronoi with two.jsAlpha shapesSpherical VoronoiPerturbed Geodesic RainbowWorld Airports UrquhartSpherical Lloyds RelaxationAntarctica’s VoronoiWorld Airports VoronoiThe Urquhart graphGeo Delaunay
Linde–Buzo–Gray stippling
im = d3
.image(await FileAttachment("rosa.jpg").url(), { crossOrigin: "anonymous" })
.then(d => ((d.style = "max-width: 100px"), d))
// this object shows the structure needed by Jochen’s implementation
grid = {
const context = DOM.context2d(w, h, 1);
context.drawImage(im, 0, 0, w, h);
const data = context.getImageData(0, 0, w, h);
return {
width: w,
height: h,
pos_at_index: function(idx) {
return [idx % w, Math.floor(idx / w)];
},
values: data.data
.filter((_, i) => i % 4 === 1) // note: we're using the green canal of (r,g,b,a)
.map(d => (!inverse ? 255 - d : d))
};
}
import { stipples_new } with { grid as himmelblau_grid } from "b333da9462d0762b" // a variant of "@grtlr/stippling-of-2d-scalar-fields" using d3-delaunay instead of d3-voronoi
w = Math.min(width)
h = ((im.height / im.width) * w) | 0
d3 = require("d3@5")
import { checkbox } from "@jashkenas/inputs"
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
