Public
Edited
Dec 17
1 star
Insert cell
Insert cell
/// the library is not bundled and relies on hyparquet. For now, we need to call a 3rd-party service. https://github.com/hyparam/geoparquet/issues/1
geoparquet = await import("https://cdn.jsdelivr.net/npm/geoparquet/+esm")
/// or
//geoparquet = await import("https://cdn.skypack.dev/geoparquet@0.2.2")
Insert cell
file = geoparquet.asyncBufferFromUrl({
url: "https://raw.githubusercontent.com/hyparam/geoparquet/refs/heads/master/demo/polys.parquet"
})
Insert cell
data = await geoparquet.toGeoJson({ file })
Insert cell
map = {
const projection = d3.geoIdentity().reflectY(true).fitWidth(width, data);
const path = d3.geoPath(projection);
const height = Math.ceil(path.bounds(data)[1][1]);
return html`<svg viewBox="0 0 ${width} ${height}">
<path d="${path(data)}" fill="none" stroke="black"></path>
</svg>`;
}
Insert cell
Insert cell

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.
Learn more