Public
Edited
Dec 3, 2022
Importers
2 stars
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
url = `https://unpkg.com/world-atlas@2/land-${precision}.json`
Insert cell
world = fetch(url).then(d => d.json())
Insert cell
Insert cell
world.objects.land
Insert cell
Insert cell
objects_ocean = ({
type: "GeometryCollection",
geometries: [
{
type: "Polygon",
arcs: world.objects.land.geometries
.map(polygon => polygon.arcs).flat(2)
.map(arcs => arcs.map(s => ~s).reverse())
}
]
})
Insert cell
Insert cell
ocean = topojson.feature(world, objects_ocean)
Insert cell
d3.geoArea(ocean)
Insert cell
caspian = {
const s = JSON.parse(JSON.stringify(ocean));
s.features[0].geometry.coordinates = s.features[0].geometry.coordinates.filter(
d => d3.geoArea({ type: "Polygon", coordinates: [d] }) < 2 * Math.PI
);
return s;
}
Insert cell
ocean_without_caspian = {
const s = JSON.parse(JSON.stringify(ocean));
s.features[0].geometry.coordinates = s.features[0].geometry.coordinates.filter(
d => d3.geoArea({ type: "Polygon", coordinates: [d] }) >= 2 * Math.PI
);
return s;
}
Insert cell
Insert cell
topojson = require("topojson@3")
Insert cell
d3 = require("d3@7", "d3-geo-polygon@1.8")
Insert cell
projection = d3.geoImago()
Insert cell
height = width * (413 / 954)
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