The avatar for @linard-y
linard-y
Public
Edited
Feb 22, 2024
Fork of Flow map of Europe
1
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
geometries = {
if (nutsLevel == 0) return nuts0;
if (nutsLevel == 1) return nuts1;
if (nutsLevel == 2) return nuts2;
if (nutsLevel == 3) return nuts3;
}
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
nuts2Json = d3.json(
"https://raw.githubusercontent.com/eurostat/Nuts2json/master/pub/v2/2021/4326/20M/all.json"
)
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
countryBorders = topojson.feature(nuts2Json, nuts2Json.objects.cntbn).features
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
// our parsed eurostat data, ready to be sankeyed
data = eurostatData
// .filter((d) => exporter == d.id)
.filter((d) => importer.has(d.id))
.map((d) => ({
source: exporter,
target: d.id,
value: d.value
}))
Insert cell
Insert cell
Insert cell
rawEurostatAPIData = d3.json(
// total trade
`https://ec.europa.eu/eurostat/api/dissemination/statistics/1.0/data/ext_tec10?format=json&lang=en&unit=THS_EUR&sizeclas=TOTAL&stk_flow=EXP&partner=${exporter}&time=2021&geoLevel=country`
)
Insert cell
rawEurostatAPIData2 = d3.json(
// inland waterways
`https://ec.europa.eu/eurostat/api/dissemination/statistics/1.0/data/iww_go_atygofl?format=JSON&time=2022&unit=THS_T&nst07=TOTAL&c_load=${exporter}&lang=en&`
)
Insert cell
Insert cell
indexStats = function (data) {
const arr = Object.entries(data.dimension.geo.category.index)
// define our object structure
.map(([key, val]) => ({
id: key,
value: data.value[val] || null,
name: data.dimension.geo.category.label[key]
}));
//sort the array in ascending order by 'value'
return arr.sort((a, b) =>
a.value > b.value ? -1 : b.value > a.value ? 1 : 0
);
}
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
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