Public
Edited
Jan 17, 2023
1 fork
Insert cell
# Living index
Dati:
- https://ourworldindata.org/grapher/global-living-planet-index
- http://stats.livingplanetindex.org/
Insert cell
Insert cell
Inputs.table(livingindex)
Insert cell
//trasformo valore Year in formato data
dataTyped = livingindex.map(({ Year, Entity, living_planet_index_average, living_planet_index_upper, living_planet_index_lower }) => ({
Year: new Date(Year, 0, 1),
Entity,
living_planet_index_average,
living_planet_index_upper,
living_planet_index_lower
}))
Insert cell
viewof country = Inputs.select(countries, {label: "Regione o gruppo"})
Insert cell
countries = d3.group(dataTyped, d => d.Entity)
Insert cell
grafico = Plot.plot({

y: {
label: "↑ living planet index",
grid: true,
nice: true, //limite superiore dei dati mostrato in y
},

x: {
label: "anno →"
},
marginTop: 20, // the top margin, in pixels
marginRight: 40, // the right margin, in pixels
marginBottom: 30, // the bottom margin, in pixels
marginLeft: 40, // the left margin, in pixels


marks: [
Plot.ruleY([0]), //y parte da 0
Plot.lineY(country, {
x: "Year",
y: "living_planet_index_average",
stroke: "#BEBEBE"
}),
Plot.lineY(country, {
x: "Year",
y: "living_planet_index_upper",
stroke: "#4e79a7"
}),
Plot.lineY(country, {
x: "Year",
y: "living_planet_index_lower",
stroke: "#e15759"
}),

Plot.text(country, Plot.selectLast({x: "Year", y: "living_planet_index_lower", text: d => "lower", textAnchor: "start", dx: 3})),
Plot.text(country, Plot.selectLast({x: "Year", y: "living_planet_index_upper", text: d => "upper", textAnchor: "start", dx: 3})),
Plot.text(country, Plot.selectLast({x: "Year", y: "living_planet_index_average", text: d => "average", textAnchor: "start", dx: 3})) //seleziona l'ultimo valore della serie e gli attribuisce un testo, d trasforma il valore numerico in un testo, anchor determina la posizione del testo (end, middle, start) rispetto al punto del valore, dx la distanza dal punto

]
})
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