Published
Edited
Dec 2, 2019
md`# Delaunator`
Delaunator = require('delaunator');
{
const context = DOM.context2d(width, height);
const delaunator = Delaunator.from(points);
renderInternalEdges(delaunator, context);
context.stroke();
context.canvas.style.maxWidth = "100%";
return context.canvas;
}
function renderInternalEdges(delaunator, context) {
for (let i = 0, n = delaunator.halfedges.length; i < n; ++i) {
const j = delaunator.halfedges[i];
if (i < j) {
const p = delaunator.triangles[i];
const q = delaunator.triangles[j];
context.moveTo(delaunator.coords[p * 2], delaunator.coords[p * 2 + 1]);
context.lineTo(delaunator.coords[q * 2], delaunator.coords[q * 2 + 1]);
}
}
}
points = [[-206.6615869776648,-61.13065234375002],[-164.42158697766484,-122.26130468750004],[-122.18158697766489,-183.39195703125006],[-79.94158697766494,-244.5226093750001],[-37.70158697766499,-305.6532617187501],[4.538413022334964,-366.7839140625001],[-377.89079348883206,366.7839140625001],[-335.65079348883216,305.6532617187501],[-293.41079348883216,244.5226093750001],[-251.17079348883223,183.39195703125006],[166.69079348883233,-61.13065234375002],[208.93079348883228,-122.26130468750004],[251.17079348883223,-183.39195703125006],[293.41079348883216,-244.5226093750001],[335.65079348883216,-305.6532617187501],[377.89079348883206,-366.7839140625001],[-4.538413022334964,366.7839140625001],[37.70158697766499,305.6532617187501],[79.94158697766494,244.5226093750001],[122.18158697766489,183.39195703125006],[164.42158697766484,122.26130468750004],[206.6615869776648,61.13065234375002],[248.90158697766475,0],[291.1415869776647,-61.13065234375002],[333.38158697766465,-122.26130468750004],[375.6215869776646,-183.39195703125006],[417.86158697766456,-244.5226093750001],[460.1015869776645,-305.6532617187501],[502.34158697766446,-366.7839140625001],[493.2647609329946,366.7839140625001],[535.5047609329945,305.6532617187501]]
height = 500
delaunay = Delaunator.from(points)
delaunay.triangles
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.
