Data Visualization & GIS at Eurostat. Exploring new ways of making maps.
{
//refresh data when year changes
if (stats[year]) {
if (mapType == "ch") {
map.statData("default").setData(stats[year]);
map.updateStatValues().title(`Population change in ${year}`);
} else if (mapType == "ps") {
map.statData("size").setData(totalStats[year]);
//map.statData("color").setData(stats[year]);
map.updateStatValues().title(`Population change in ${year}`);
}
}
}
stats = {
let data = {};
for (let i = 2002; i < 2023; i++) {
data[i] = indexStats(
await d3.json(
`https://ec.europa.eu/eurostat/api/dissemination/statistics/1.0/data/demo_r_gind3?format=json&lang=en&geoLevel=${nutsLevel}&time=${i}&indic_de=GROWRT`
)
);
}
return data;
}
totalStats = {
let data = {};
for (let i = 2002; i < 2023; i++) {
data[i] = indexStats(
await d3.json(
`https://ec.europa.eu/eurostat/api/dissemination/statistics/1.0/data/demo_r_gind3?format=json&lang=en&geoLevel=${nutsLevel}&time=${i}&indic_de=JAN`
)
);
}
return data;
}
// turn eurostat API response into an index of {NUTSCODE: value}
indexStats = function (response) {
const arr = Object.entries(response.dimension.geo.category.index)
// define our object structure
.map(([key, val]) => ({
id: key,
value: response.value[val] || null,
name: response.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))
.filter((v) => v.value !== null)
.reduce((acc, item) => {
acc[item.id] = item.value;
return acc;
}, {});
}
eurostatmap = require("eurostat-map")
//for tooltip<style>table{margin:0px}</style>
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.
