Public
Edited
May 20
1 fork
data = d3.dsvFormat(";").parse(await FileAttachment("Immigrés et étrangers@1.csv").text())
Object.keys(data[0])
data1 = data.map(d => ({
Année : +d["Année"],
Immigrés : parseFloat(d["Immigrés "].replace(",", ".")),
Etrangers : parseFloat(d["Etrangers "].replace(",", ".")),
}))
dataLong = data1.flatMap(d => [
{ Année: d.Année, Nombre: d.Immigrés, Catégorie: "Immigrés" },
{ Année: d.Année, Nombre: d.Etrangers, Catégorie: "Etrangers" },
])
dataGrouped = data1.flatMap(d => [
{ Année: d.Année, Type: "Immigrés", Nombre: d.Immigrés },
{ Année: d.Année, Type: "Etrangers", Nombre: d.Etrangers },
])
Plot.plot({
title: "Population immigrée et étrangère depuis 1990 en France entière (1990-2023)",
y: {
grid: true,
label: "Nombre",
tickFormat: d3.format(" ") // format réel (ex: 1 000 000 au lieu de 1M)
},
x: {
axis: null,
domain: dataGrouped.Type
},
fx: {
domain: [...new Set(dataGrouped.map(d => d.Année))],
label: null,
tickFormat: d3.format("d") // supprime les virgules (2019, pas 2,019)
},
color: {
domain: dataGrouped.Type,
scheme: "spectral",
legend: true
},
marks: [
Plot.ruleY([0]),
Plot.barY(dataGrouped, {
x: "Type",
y: "Nombre",
fill: "Type",
fx: "Année"
}),
// Les étiquettes au-dessus des barres
Plot.text(dataGrouped, {
x: "Type",
y: "Nombre",
fx: "Année",
text: d => d3.format(" ")(d.Nombre),
dy: -5, // position au-dessus des barres
fill: "black",
fontSize: 10,
textAnchor: "middle"
})
]
})
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.
