Public
Edited
May 26, 2023
1 fork
14 stars
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
map = bertin.draw({
params: { projection: d3.geoBertin1953() },
layers: [
{
type: "dotcartogram",
geojson: data,
onedot: onedot,
iteration: iteration,
values: "gdp",
radius: radius,
span: span,
leg_fill: "none",
leg_stroke: "black",
leg_strokeWidth: 1.5,
leg_x: 800,
leg_y: 450,
leg_title: `GDP in billion`,
fill: {
type: "typo",
values: "region",
leg_x: 700,
leg_y: 400,
leg_strokeWidth: 0.1
},
tooltip: ["$name", "$region"]
},
{
geojson: data,
fillOpacity: 0.35,
fill: "white",
stroke: "none"
},
{
type: "graticule"
},
{
type: "outline"
}
]
})
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
bertin.draw({
params: { projection: d3.geoBertin1953() },
layers: [
{ type: "header", text: "World Population in 2022" },
{
type: "dotcartogram",
geojson: data2,
values: "pop2020",
onedot: onedot2 * 1000000,
span: span2,
fill: "#0e0f2e",
radius: radius2,
leg_title: `Population in 2020`,
leg_txt: `${onedot2} million inh.`,
leg_x: 700,
leg_y: 450
},
{
geojson: geom,
fillOpacity: 0.35,
fill: "white",
stroke: "none"
},
{
type: "graticule"
},
{
type: "outline"
}
]
})
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
d3 = require("d3@7", "d3-geo-projection@4")
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