The avatar for @udg-master-data-science
UdG | Master's in Data Science
Public
Edited
Jan 18, 2024
1 fork
2
Insert cell
Insert cell
emissions_raw = FileAttachment("owid-co2-data (1).csv").csv()
Insert cell
countries = FileAttachment("countries.csv").csv()
Insert cell
ue_world = {
const filteredCountries = countries.filter(country => country.UE === 'Yes');

return filteredCountries;
}
Insert cell
emissions_ue_world = {
const countries_ue = ue_world.map(item => item.country)
countries_ue.push('World')
countries_ue.push('Asia')
countries_ue.push('Africa')
countries_ue.push('North America');

const filtered_emissions = emissions_raw
.filter(item => countries_ue.includes(item.country))
.map(item => ({
...item,
co2: parseFloat(item.co2) // Convert 'co2' to decimal
}));

const filtered_emissions2 = filtered_emissions
.filter(d => d.year >= 1950)
.filter(d => d.year <= 2000)

return filtered_emissions2
}
Insert cell
emissions_ue_world
select * from
(select t1.year,t2.co2 - t1.co2 as co2, t1.Region,'Rest of the World' as country from
(SELECT year,sum(co2) as co2,'Rest of the World'as Region
FROM "emissions_ue_world"
where country <> 'World'
group by year)t1
left join
(SELECT year,sum(co2) as co2,'World'as Region
FROM "emissions_ue_world"
where country = 'World'
group by year)t2
on t1.year = t2.year
union all
select year, co2, case when country <> 'World'
and country <> 'Asia'
and country <> 'Africa'
and country <> 'North America'
then 'European Union'
else country end as Region, country
FROM "emissions_ue_world"
where country <> 'World');
Insert cell
emissions_ue_world_formatted
select t1.*, coalesce(t2.order_eu,0),t3.order_region from
(select * from "emissions_ue_world_formatted")t1
left join
(select country, row_number() over (order by sum(co2) desc) as order_eu from "emissions_ue_world_formatted"
where Region = 'European Union'
group by country)t2
on t1.country = t2.country
left join
(select Region, row_number() over (order by sum(co2) asc) as order_region from "emissions_ue_world_formatted"
group by Region)t3
on t1.Region = t3.Region
Insert cell
miniPlots2 = html`
<div>
<div style="display: flex">
<div>${[AreaChart_1(),AreaChart_2()]}</div>
</div>`
Insert cell
Insert cell
Insert cell
Plot.plot({
title: "CO2 Emissions between 1950 and 2000 ",
color: { legend: true, scheme: "PuRd" , type: "categorical",className:"Region"},
x: { type: "linear" },
y: {},
marks: [
Plot.areaY(
emissions_ue_world_sorted,
Plot.groupX(
{ y: "sum" },
{ x: "year", y: "co2",z:"order_region", order: "z", fill: "order_region"}
// , channels: { year: "year",Region: "Region",co2: "co2"},
// tip: { format: { year: true,co2: true}}}
)),
Plot.ruleY([0]),
Plot.tip(
[`EU 1990 Emissions`],
{x: 1990, y: 4500}
),
Plot.tip(

)
]
});
Insert cell
Plot.plot({
title: "CO2 Emissions between 1950 and 2000 ",
color: { legend: true, scheme: "PuRd" , type: "categorical",label:"Region"},
x: { type: "linear" },
y: {},
marks: [
Plot.areaY(
emissions_ue_world_sorted.filter(d => d.country === 'European Union'),
Plot.stackY(
{ y: "sum",sort:"order_eu" },
{ x: "year", y: "co2",fill: "country",stroke:"order_eu", tip: true }
)
),
Plot.ruleY([0]),
Plot.tip(
[`EU 1990 Emissions`],
{x: 1990, y: 4500}
)
]
});
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
miniPlots = html`
<div>
<div style="display: flex">
<div>${[barChart_1(), barChart_3()]}</div>
<div>${[barChart_2(), barChart_4()]}</div>
</div>`
Insert cell
Select a data source…
Type Chart, then Shift-Enter. Ctrl-space for more options.

Insert cell
viewof dashboard = {
const crimeBarChart = vl.markBar()
.encode(
vl.x().fieldN("year").title("Year"),
vl.y().sum("total_ghg").title("Total GHG Emissions")
);

const crimeBarChartLayer = vl.layer(
crimeBarChart.params(emissions_ue_single_country_percentage).encode(vl.color().value('lightgrey')),
crimeBarChart.transform(vl.filter(emissions_ue_single_country_percentage))
)
.title("Emissions by Year")
.data(emissions_ue_single_country_percentage)
.width(width * 0.4)
.height(200);
}

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