The end-to-end solution for building and hosting better data apps, dashboards, and reports.
Unlisted
Edited
May 24, 2023
Plot.plot({
width: 640,
height: 640,
margin: 1,
projection: ({width, height}) =>
d3.geoAzimuthalEqualArea().rotate([96, -40]).clipAngle(24).fitSize([width, height], {type: "Sphere"}),
marks: [
Plot.geo(nation, {fill: "currentColor", fillOpacity: 0.2}),
Plot.dot(capitals, {x: "longitude", y: "latitude", r: 2.5, fill: "currentColor"}),
Plot.voronoiMesh(capitals, {x: "longitude", y: "latitude", clip: "sphere"}),
Plot.voronoi(
capitals,
Plot.pointer({
x: "longitude",
y: "latitude",
clip: "sphere",
title: "state",
stroke: "red",
fill: "red",
fillOpacity: 0.4,
pointerEvents: "all",
maxRadius: Infinity
})
),
Plot.sphere({strokeWidth: 2})
]
});
capitals = FileAttachment("us-state-capitals.csv").csv({typed:true})
us = FileAttachment("us-counties-10m.json").json()
nation = topojson.feature(us, us.objects.nation)
Plot = require(await FileAttachment("plot.umd.min.js").url())
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.
