Code and stories for ABC News and other experiments online
chart = html`<svg style="width: 100%; height: auto; display: block;" viewBox="0 0 ${n} ${m}">
${Array.from(contours(values), d => svg`<path d="${path(d)}" fill="${color(d.value)}" />`)}
</svg>`
path = d3.geoPath()
contours = d3.contours().size([n, m]).smooth(false).thresholds(8)
color = d3.scaleSequential(d3.extent(values), d3.interpolateMagma)
image = tiff.getImage()
values = (await image.readRasters())[0]
n = image.getWidth()
m = image.getHeight()
tiff = FileAttachment("sfctmp.tiff").arrayBuffer()
.then(buffer => GeoTIFF.fromArrayBuffer(buffer))
GeoTIFF = require("geotiff@1.0.0-beta.13")
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.
