2f:T5a6,## Introduction CO2, or carbon dioxide, is the fourth most abundant gas in the earth's atmosphere. Like other greenhouse gases, CO2 absorbs energy at a variety of wavelengths, it vibrates, and re-emits the infrared energy in all directions. About half of that energy goes out into space, and about half of it returns to Earth as heat, contributing to the "greenhouse effect". Before humans, naturally occurring greenhouse gases helped to make Earth’s climate habitable. Without them, the planet’s average temperature would be below freezing. So we know that even very low natural levels of carbon dioxide and other greenhouse gases can make a huge difference in Earth’s climate. Today, CO2 levels are higher than they have been in at least 3 million years. And although they still account for only 0.04% of the atmosphere, that still adds up to billions upon billions of tons of heat-trapping gas. If this goes on in the future, billions of people would suffer and die from the impacts of climate change; there would be mass extinctions, and our beautiful planet would become unrecognizable. The aim of this paper is to explore one of the biggest sources of CO2 emissions: the oil industry. We will explore the current data to determine why the CO2 that comes from oil is a problem, which countries have higher CO2 emissions today and through time, and how this affects their economies and their relationship with renewable energies.30:T509,Plot.plot({ marginRight: 100, width: 1000, height: 500, x: { domain: [1800,2020], label: "Year" }, y: { label: "CO2 measured in million tonnes." }, color: { range: ["#002051","#2b446e","#696970","#414487","#2a788e"] }, marks: [ Plot.line(total_co2_separated_sources_by_year.filter(c => c.name !== "Other" && c.name !== "Oil" && c.year > 1800), { x: "year", y: "co2", z: "name", stroke: "name", curve: "natural", sort: t => t.name === "Oil" }), Plot.text(total_co2_separated_sources_by_year.filter(c => c.name !== "Other" && c.name !== "Oil" && c.year > 1800), Plot.selectLast({ x: "year", y: "co2", z: "name", text: "name", dx: 5, fill: "name", textAnchor: "start" })), Plot.line(total_co2_separated_sources_by_year.filter(c => c.name === "Oil" && c.year > 1800), { x: "year", y: "co2", z: "name", stroke: "#eb3838", curve: "natural", sort: t => t.name === "Oil" }), Plot.text(total_co2_separated_sources_by_year.filter(c => c.name === "Oil"), Plot.selectLast({ x: "year", y: "co2", z: "name", text: "name", dx: 5, fill: "#eb3838", textAnchor: "start" })), ] })31:T4c6,The principal uses of oil: - Transportation: Cars, motorcycles, light trucks, buses, trains, boats and ships use gasoline or diesel, both fuels are petroleum products. Jet airplanes and some types of helicopters often use kerosene, a fuel also produced with petroleum. To date, petroleum is the basic source of energy used in transportation. Two-thirds of all transportation uses some form of oil derivative fuel. The following are several fuels made from oil: - Gasoline - Kerosene - Liquefied natural gas - Liquefied petroleum gas - Butane - Diesel fuel - Fuel oil - Propane - Power Generation: Oil-fired power stations use petroleum for electricity generation. Although coal is the major source of electricity generation, petroleum also accounts for significant power generation. [Click here to see Oil-fired power stations over the world](https://en.wikipedia.org/wiki/Category:Oil-fired_power_stations_by_country) Other uses of petroleum are: - Engine lubricants. - Pharmaceuticals. - Pesticides for the agriculture sector. - Chemical Industry: Synthetic fibers, insecticides, synthetic rubber, nylon, plastics, perfumes, dyes, paints... - Household products like detergents, vaseline and wax.32:Te9d,chart4 = { const svg = d36.create('svg') .style('font-family', 'sans-serif') .attr('width', width) .attr('height', 500) const g = svg.append('g') .attr('class', 'treemap-container') // Place the labels for our countries g.selectAll('text.country') // The data is the first "generation" of children .data( root.children ) .join('text') .attr('class', 'country') // The rest is just placement/styling .attr('x', d => d.x0) .attr('y', d => d.y0) .attr('dy', '0.3em') .attr('dx', 3) .style('font-size', 12) // Remember, the data on the original node is available on node.data (d.data here) .text(d => d.data.name) // Now, we place the groups for all of the leaf nodes const leaf = g.selectAll('g.leaf') // root.leaves() returns all of the leaf nodes .data(root.leaves()) .join('g') .attr('class', 'leaf') // position each group at the top left corner of the rect .attr('transform', d => `translate(${ d.x0 },${ d.y0 })`) .style('font-size', 10) .style('font-weight', 'bold') .style('stroke-width', '3') .style('paint-order', 'stroke') .style('stroke', 'rgba(255,255,255, .75)') .style('stroke-linecap', 'round') .style('stroke-linejoin', 'round') // A title element tells the browser to display its text value // in a popover when the cursor is held over a rect. This is a simple // way to add some interactivity leaf.append('title') .text(d => `${ d.parent.data.name } ${ d.data.name }\n${ d.value.toLocaleString() + ' Tonnes' }`) // Now we append the rects. Nothing crazy here leaf.append('rect') .attr('fill', function(d) { const key = d.data.name const colors = { 'oil_co2': '#eb3838', 'flaring_co2': '#696970', 'gas_co2': '#414487', 'land_use_change_co2': '#2a788e', 'cement_co2': '#2b446e', 'coal_co2': '#002051' } return colors[key] || 'white' }) .attr('opacity', 0.90) // the width is the right edge position - the left edge position .attr('width', d => d.x1 - d.x0) // same for height, but bottom - top .attr('height', d => d.y1 - d.y0) // make corners rounded .attr('rx', 3) .attr('ry', 3) // This next section checks the width and height of each rectangle // If it's big enough, it places labels. If not, it doesn't. leaf.each((d, i, arr) => { // The current leaf element const current = arr[i] const left = d.x0, right = d.x1, // calculate its width from the data width = right - left, top = d.y0, bottom = d.y1, // calculate its height from the data height = d.y1 - d.y0 // too small to show text const tooSmall = width < 30 || height < 20 // and append the text (you saw something similar with the pie chart (day 6) const text = d3.select( current ).append('text') // If it's too small, don't show the text .attr('opacity', tooSmall ? 0 : 1) .selectAll('tspan') .data(function(d) { const key = d.data.name const colors = { 'oil_co2': 'Oil CO2', 'flaring_co2': 'Flaring CO2', 'gas_co2': 'Gas CO2', 'land_use_change_co2': 'Land Use CO2', 'cement_co2': 'Cement CO2', 'coal_co2': 'Coal CO2' } const value = parseFloat(d.value).toFixed(2) return [colors[key], value.toLocaleString()] }) .join('tspan') .attr('x', 3) .attr('y', (d,i) => i ? '2.5em' : '1.15em') .text(d => d) }) return svg.node(); }33:T53c,Plot.plot({ width: width, height: width * 0.4, marginRight: 100, marginLeft: 100, grid: true, y: { label: "CO2 emissions from oil measured in tonnes per person" }, x:{ domain: d3.filter(co2_total_and_oil, e => e.iso_code === selectedCountry.iso_code || e.iso_code === selectedOilCountry.iso_code ) .sort(e => e.iso_code !== selectedCountry.iso_code ).map(d => d.country), label: null }, marks: [ Plot.barY( co2_total_and_oil.filter(c => c.iso_code === selectedOilCountry.iso_code && c.year === 2021), { x: "country", y: "co2_per_capita", fill: "#adadad", opacity: 0.75 }), Plot.barY( co2_total_and_oil.filter(c => c.iso_code === selectedCountry.iso_code && c.year === 2021), { x: "country", y: "co2_per_capita", fill: "#adadad", opacity: 0.75 }), Plot.barY( co2_total_and_oil.filter(c => c.iso_code === selectedCountry.iso_code && c.year === 2021), { x: "country", y: "oil_co2_per_capita", fill: "#eb3838", }), Plot.barY( co2_total_and_oil.filter(c => c.iso_code === selectedOilCountry.iso_code && c.year === 2021), { x: "country", y: "oil_co2_per_capita", fill: "#eb3838", }) ] })34:T64c,Plot.plot({ height: 580, width: width, grid: true, x: { type: "log", label: "GDP per capita ($)", domain: [minGDP, maxGDP * 2] }, y: { axis: "right", label: "C02 from oil per capita", domain: [-1, 25] }, r: { range: [2, 36], type: "sqrt", }, color:{ scheme: "greens", type: "sqrt", //domain: [1000000000, 20000000000000], }, marks: [ Plot.line(trail, { x: "gdp", y: "oil_co2_per_capita", z: "country", curve: "catmull-rom", strokeWidth: 1, stroke: "#adadad", marker: "circle" }), Plot.dot(dataEx8.filter(c => yearValueForG7 === parseInt(c.year)) , { y: "oil_co2_per_capita", x: "gdp", r: "oil_co2_per_capita", fill: "gdp", fillOpacity: .9, stroke: "#4a4a4a", strokeWidth: 2, mixBlendMode: "multiply", title: d => `${d.country}\nCO2 oil production: ${d.oil_co2_per_capita} \nGDP: $${d.gdp} per capita` }), Plot.text( co2_total_and_oil .filter(c => yearValueForG7 === parseInt(c.year) && c.oil_co2_per_capita > 0 && c.gdp > 0 && c.population > 1000000 && oil_countries.includes(c.iso_code)) .sort((a,b) => b.oil_co2_per_capita - a.oil_co2_per_capita), { y: "oil_co2_per_capita", x: "gdp", text: "country", stroke: "#fff", fill: "black", strokeWidth: 2 }) ], style: { padding: 10, paintOrder: "stroke" } })35:T403,co2_total_and_oil = { // co2 levels in oil countries const cmp = data .filter(e => e.iso_code !== "") .map(function(e) { const co2 = parseFloat(e.co2) || 0 const oil_co2 = parseFloat(e.oil_co2) || 0 const co2_per_capita = parseFloat(e.co2_per_capita) || 0 const co2_oil_per_capita = parseFloat(e.oil_co2_per_capita) || 0 const gdp = parseFloat(e.gdp) || 0 const population = parseInt(e.population) || 0 return { country : e.country, iso_code : e.iso_code, year: parseInt(e.year), co2 : co2, oil_co2 : oil_co2, population: population, co2_per_capita: co2_per_capita, oil_co2_per_capita: co2_oil_per_capita, gdp: gdp } }) .sort((a,b) => b.oil_co2 - a.oil_co2) return cmp }36:T698,function annotate (svg, p, countries, type) { const c = data_2021_CO2_emissions_per_capita.filter(c => countries.includes(c.iso)); const f = data_2021_CO2_emissions_per_capita_sorted.filter(c => !countries.includes(c.iso)) const newPositions = moveLabels(c,p) const fPositions = moveLabels(f, p) const text = svg.append("g") .selectAll("text") .data(newPositions) .join("text") .style('font-family', 'sans-serif') .style('font-size', '.8em') .style('paint-order', 'stroke') .style('stroke-width', '3') .style('stroke', 'rgba(255,255,255,.85)') .style('stroke-linecap', 'round') .style('stroke-linejoin', 'round') .style('paint-order', 'stroke') .style('text-anchor', 'middle') .attr("transform", d => `translate(${d.x}, ${d.y})`) text.append("tspan") .attr("x", 0) .attr("y", 0) .style('font-size', '.8em') .text(d => data_2021_CO2_emissions_per_capita.find(c => c.iso === d.iso).country) text.append("tspan") .style('font-weight', 'bold') .attr("x", 0) .attr("y", '1.1em') .text(d => `${number(data_2021_CO2_emissions_per_capita.find(c => c.iso === d.iso)[type])}`); svg.append("g") .attr("class", "floatingmaplabel") .attr("fill", "transparent") .attr("stroke", "transparent") .attr("stroke-width", 0.5) .selectAll("circle") .data(f) .join("circle") .attr("fill-opacity", d => `${d.co2_opacity}`)//".2") .attr("transform", d => `translate(${p([d.lon,d.lat])[0]},${p([d.lon,d.lat])[1]})`) .attr("r", d => radius(d.co2_per_capita)) .append('title') .text(d => `${d.country} | ${parseFloat(d.co2_per_capita).toFixed(2)}`) }37:Td33,// Copyright 2021 Observable, Inc. // Released under the ISC license. // https://observablehq.com/@d3/donut-chart function DonutChart(data, { name = ([x]) => x, // given d in data, returns the (ordinal) label value = ([, y]) => y, // given d in data, returns the (quantitative) value title, // given d in data, returns the title text width = 640, // outer width, in pixels height = 400, // outer height, in pixels innerRadius = Math.min(width, height) / 3, // inner radius of pie, in pixels (non-zero for donut) outerRadius = Math.min(width, height) / 2, // outer radius of pie, in pixels labelRadius = (innerRadius + outerRadius) / 2, // center radius of labels format = ",", // a format specifier for values (in the label) names, // array of names (the domain of the color scale) colors, // array of colors for names stroke = innerRadius > 0 ? "none" : "white", // stroke separating widths strokeWidth = 1, // width of stroke separating wedges strokeLinejoin = "round", // line join of stroke separating wedges padAngle = stroke === "none" ? 1 / outerRadius : 0, // angular separation between wedges } = {}) { // Compute values. const N = d3.map(data, name); const V = d3.map(data, value); const I = d3.range(N.length).filter(i => !isNaN(V[i])); // Unique the names. if (names === undefined) names = N; names = new d3.InternSet(names); // Chose a default color scheme based on cardinality. if (colors === undefined) colors = d3.schemeSpectral[names.size]; if (colors === undefined) colors = d3.quantize(t => d3.interpolateSpectral(t * 0.8 + 0.1), names.size); // Construct scales. const color = d3.scaleOrdinal(names, colors); // Compute titles. if (title === undefined) { const formatValue = d3.format(format); title = i => `${N[i]}\n${formatValue(V[i])}`; } else { const O = d3.map(data, d => d); const T = title; title = i => T(O[i], i, data); } // Construct arcs. const arcs = d3.pie().padAngle(padAngle).sort(null).value(i => V[i])(I); const arc = d3.arc().innerRadius(innerRadius).outerRadius(outerRadius); const arcLabel = d3.arc().innerRadius(labelRadius).outerRadius(labelRadius); const svg = d3.create("svg") .attr("width", width) .attr("height", height) .attr("viewBox", [-width / 2, -height / 2, width, height]) .attr("style", "max-width: 100%; height: auto; height: intrinsic;"); svg.append("g") .attr("stroke", stroke) .attr("stroke-width", strokeWidth) .attr("stroke-linejoin", strokeLinejoin) .selectAll("path") .data(arcs) .join("path") .attr("fill", d => color(N[d.data])) .attr("d", arc) .append("title") .text(d => title(d.data)); svg.append("g") .attr("font-family", "sans-serif") .attr("font-size", 10) .attr("text-anchor", "middle") .selectAll("text") .data(arcs) .join("text") .attr("transform", d => `translate(${arcLabel.centroid(d)})`) .selectAll("tspan") .data(d => { const lines = `${title(d.data)}`.split(/\n/); return (d.endAngle - d.startAngle) > 0.25 ? lines : lines.slice(0, 1); }) .join("tspan") .attr("x", 0) .attr("y", (_, i) => `${i * 1.1}em`) //.attr("font-weight", (_, i) => i ? null : "bold") .text(d => d); return Object.assign(svg.node(), {scales: {color}}); }38:T52d,function chart(root) { const svg = d3_v2.select(DOM.svg(width, 500)); const scheme = bigest.map(e => e.group) var format = d3_v2.format(",d"); var tooltip = d3_v2.select("body").append("div") .style("position", "absolute") .style("z-index", "10") .style("visibility", "hidden") .style("color", "white") .style("padding", "8px") .style("background-color", "rgba(0, 0, 0, 0.75)") .style("border-radius", "6px") .style("font", "12px sans-serif") //.text("tooltip"); var bubble = d3_v2.pack() .size([width, 500]) .padding(1.5); bubble(root); var node = svg.selectAll(".node") .data(root.children) .enter().append("g") .attr("class", "node") .attr("transform", function(d) { return "translate(" + d.x + "," + d.y + ")"; }); node.append("circle") .attr("r", function(d) { return d.r; }) .style("fill", function(d) { const countryGroup = d.data.group; return countryGroup === "oil" ? "#eb3838" : "#adadad"; }) node.append("text") .attr("dy", ".3em") .style("text-anchor", "middle") //.style('font-family', '10px sans-serif') .style("font", "10px sans-serif") .style("pointer-events", "none") .text(function(d) { return d.data.name; }); return svg.node(); }39:T63d,dataEx4 = { const cmp = data .filter(e => e.iso_code !== "" && e.year === "2021") .map(function(e) { const cement_co2 = parseFloat(e.cement_co2) || 0 const coal_co2 = parseFloat(e.coal_co2) || 0 const consumption_co2 = parseFloat(e.consumption_co2) || 0 const flaring_co2 = parseFloat(e.flaring_co2) || 0 const gas_co2 = parseFloat(e.gas_co2) || 0 const land_use_change_co2 = parseFloat(e.land_use_change_co2) || 0 const oil_co2 = parseFloat(e.oil_co2) || 0 const trade_co2 = parseFloat(e.trade_co2) || 0 const country = e.country const iso = e.iso_code const values = { // co2, cement_co2, coal_co2, consumption_co2, flaring_co2, gas_co2, land_use_change_co2, oil_co2, trade_co2 } const children = [] for (let [key, value] of Object.entries(values)) { children.push( { name: key, value: value } ) } const child = { name : country || iso, iso: iso, children: children } return child }) return { children: cmp } }3a:Ta3f,function Scrubber(values, { format = value => value, initial = 0, delay = null, autoplay = true, loop = true, loopDelay = null, alternate = false } = {}) { values = Array.from(values); const form = html``; let frame = null; let timer = null; let interval = null; let direction = 1; function start() { form.b.textContent = "Pause"; if (delay === null) frame = requestAnimationFrame(tick); else interval = setInterval(tick, delay); } function stop() { form.b.textContent = "Play"; if (frame !== null) cancelAnimationFrame(frame), frame = null; if (timer !== null) clearTimeout(timer), timer = null; if (interval !== null) clearInterval(interval), interval = null; } function running() { return frame !== null || timer !== null || interval !== null; } function tick() { if (form.i.valueAsNumber === (direction > 0 ? values.length - 1 : direction < 0 ? 0 : NaN)) { if (!loop) return stop(); if (alternate) direction = -direction; if (loopDelay !== null) { if (frame !== null) cancelAnimationFrame(frame), frame = null; if (interval !== null) clearInterval(interval), interval = null; timer = setTimeout(() => (step(), start()), loopDelay); return; } } if (delay === null) frame = requestAnimationFrame(tick); step(); } function step() { form.i.valueAsNumber = (form.i.valueAsNumber + direction + values.length) % values.length; form.i.dispatchEvent(new CustomEvent("input", {bubbles: true})); } form.i.oninput = event => { if (event && event.isTrusted && running()) stop(); form.value = values[form.i.valueAsNumber]; form.o.value = format(form.value, form.i.valueAsNumber, values); }; form.b.onclick = () => { if (running()) return stop(); direction = alternate && form.i.valueAsNumber === values.length - 1 ? -1 : 1; form.i.valueAsNumber = (form.i.valueAsNumber + direction) % values.length; form.i.dispatchEvent(new CustomEvent("input", {bubbles: true})); start(); }; form.i.oninput(); if (autoplay) start(); else stop(); Inputs.disposal(form).then(stop); return form; }3b:T830,// Copyright 2021, Observable Inc. // Released under the ISC license. // https://observablehq.com/@d3/color-legend function Swatches(color, { columns = null, format, unknown: formatUnknown, swatchSize = 15, swatchWidth = swatchSize, swatchHeight = swatchSize, marginLeft = 0 } = {}) { const id = `-swatches-${Math.random().toString(16).slice(2)}`; const unknown = formatUnknown == null ? undefined : color.unknown(); const unknowns = unknown == null || unknown === d3.scaleImplicit ? [] : [unknown]; const domain = color.domain().concat(unknowns); if (format === undefined) format = x => x === unknown ? formatUnknown : x; function entity(character) { return `&#${character.charCodeAt(0).toString()};`; } if (columns !== null) return htl.html`

${domain.map(value => { const label = `${format(value)}`; return htl.html`

${label}

`; })}

`; return htl.html`

${domain.map(value => htl.html`${format(value)}`)}

`; }3c:T120f,// Copyright 2021, Observable Inc. // Released under the ISC license. // https://observablehq.com/@d3/color-legend function Legend(color, { title, tickSize = 6, width = 750, height = 44 + tickSize, marginTop = 18, marginRight = 0, marginBottom = 16 + tickSize, marginLeft = 0, ticks = width / 64, tickFormat, tickValues } = {}) { function ramp(color, n = 256) { const canvas = document.createElement("canvas"); canvas.width = n; canvas.height = 1; const context = canvas.getContext("2d"); for (let i = 0; i < n; ++i) { context.fillStyle = color(i / (n - 1)); context.fillRect(i, 0, 1, 1); } return canvas; } const svg = d3.create("svg") .attr("width", width) .attr("height", height) .attr("viewBox", [0, 0, width, height]) .style("overflow", "visible") .style("display", "block"); let tickAdjust = g => g.selectAll(".tick line").attr("y1", marginTop + marginBottom - height); let x; // Continuous if (color.interpolate) { const n = Math.min(color.domain().length, color.range().length); x = color.copy().rangeRound(d3.quantize(d3.interpolate(marginLeft, width - marginRight), n)); svg.append("image") .attr("x", marginLeft) .attr("y", marginTop) .attr("width", width - marginLeft - marginRight) .attr("height", height - marginTop - marginBottom) .attr("preserveAspectRatio", "none") .attr("xlink:href", ramp(color.copy().domain(d3.quantize(d3.interpolate(0, 1), n))).toDataURL()); } // Sequential else if (color.interpolator) { x = Object.assign(color.copy() .interpolator(d3.interpolateRound(marginLeft, width - marginRight)), {range() { return [marginLeft, width - marginRight]; }}); svg.append("image") .attr("x", marginLeft) .attr("y", marginTop) .attr("width", width - marginLeft - marginRight) .attr("height", height - marginTop - marginBottom) .attr("preserveAspectRatio", "none") .attr("xlink:href", ramp(color.interpolator()).toDataURL()); // scaleSequentialQuantile doesn’t implement ticks or tickFormat. if (!x.ticks) { if (tickValues === undefined) { const n = Math.round(ticks + 1); tickValues = d3.range(n).map(i => d3.quantile(color.domain(), i / (n - 1))); } if (typeof tickFormat !== "function") { tickFormat = d3.format(tickFormat === undefined ? ",f" : tickFormat); } } } // Threshold else if (color.invertExtent) { const thresholds = color.thresholds ? color.thresholds() // scaleQuantize : color.quantiles ? color.quantiles() // scaleQuantile : color.domain(); // scaleThreshold const thresholdFormat = tickFormat === undefined ? d => d : typeof tickFormat === "string" ? d3.format(tickFormat) : tickFormat; x = d3.scaleLinear() .domain([-1, color.range().length - 1]) .rangeRound([marginLeft, width - marginRight]); svg.append("g") .selectAll("rect") .data(color.range()) .join("rect") .attr("x", (d, i) => x(i - 1)) .attr("y", marginTop) .attr("width", (d, i) => x(i) - x(i - 1)) .attr("height", height - marginTop - marginBottom) .attr("fill", d => d); tickValues = d3.range(thresholds.length); tickFormat = i => thresholdFormat(thresholds[i], i); } // Ordinal else { x = d3.scaleBand() .domain(color.domain()) .rangeRound([marginLeft, width - marginRight]); svg.append("g") .selectAll("rect") .data(color.domain()) .join("rect") .attr("x", x) .attr("y", marginTop) .attr("width", Math.max(0, x.bandwidth() - 1)) .attr("height", height - marginTop - marginBottom) .attr("fill", color); tickAdjust = () => {}; } svg.append("g") .attr("transform", `translate(0,${height - marginBottom})`) .call(d3.axisBottom(x) .ticks(ticks, typeof tickFormat === "string" ? tickFormat : undefined) .tickFormat(typeof tickFormat === "function" ? tickFormat : undefined) .tickSize(tickSize) .tickValues(tickValues)) .call(tickAdjust) .call(g => g.select(".domain").remove()) .call(g => g.append("text") .attr("x", marginLeft) .attr("y", marginTop + marginBottom - height - 6) .attr("fill", "currentColor") .attr("text-anchor", "start") .attr("font-weight", "bold") .attr("class", "title") .text(title)); return svg.node(); }3d:T998,total_co2_separated_sources_by_year = { let list = [] for( let i = Math.min(...data.filter(c => c.iso_code !== "").map(c => parseInt(c.year))); i <= Math.max(...data.filter(c => c.iso_code !== "").map(c => parseInt(c.year))); i++) { let total_co2_from_oil = data.filter(c => c.iso_code !== "" && parseInt(c.year) === i && c.oil_co2) .reduce( (a,c) => parseFloat(c.oil_co2) + a ,0) let total_co2_from_cement = data.filter(c => c.iso_code !== "" && parseInt(c.year) === i && c.cement_co2) .reduce( (a,c) => parseFloat(c.cement_co2) + a ,0) let total_co2_from_coal = data.filter(c => c.iso_code !== "" && parseInt(c.year) === i && c.coal_co2) .reduce( (a,c) => parseFloat(c.coal_co2) + a ,0) let total_co2_from_flaring = data.filter(c => c.iso_code !== "" && parseInt(c.year) === i && c.flaring_co2) .reduce( (a,c) => parseFloat(c.flaring_co2) + a ,0) let total_co2_from_gas = data.filter(c => c.iso_code !== "" && parseInt(c.year) === i && c.gas_co2) .reduce( (a,c) => parseFloat(c.gas_co2) + a ,0) let total_co2_from_land_use = data.filter(c => c.iso_code !== "" && parseInt(c.year) === i && c.land_use_change_co2) .reduce( (a,c) => parseFloat(c.land_use_change_co2) + a ,0) let total_co2_from_trade = data.filter(c => c.iso_code !== "" && parseInt(c.year) === i && c.trade_co2) .reduce( (a,c) => parseFloat(c.trade_co2) + a ,0) let total_co2_from_other_industry = data.filter(c => c.iso_code !== "" && parseInt(c.year) === i && c.other_industry_co2) .reduce( (a,c) => parseFloat(c.other_industry_co2) + a ,0) list.push({ year: i, name: "Oil", co2: total_co2_from_oil }) list.push({ year: i, name: "Coal", co2: total_co2_from_coal }) list.push({ year: i, name: "Cement", co2: total_co2_from_cement }) list.push({ year: i, name: "Flaring", co2: total_co2_from_flaring }) list.push({ year: i, name: "Gas", co2: total_co2_from_gas }) list.push({ year: i, name: "Land Use", co2: total_co2_from_land_use }) list.push({ year: i, name: "Trade", co2: total_co2_from_trade }) list.push({ year: i, name: "Other", co2: total_co2_from_other_industry }) } return list }3e:[{"id":"bf53a6300f5880d98f85d010a8cf5f4c25ae068fe96a2e0d3f3f1b73972d68606eb01409e30dfe9ca979c6277e925a5e885e66a234962ed99107fe4d00310c35","href":"https://static.observableusercontent.com/files/bf53a6300f5880d98f85d010a8cf5f4c25ae068fe96a2e0d3f3f1b73972d68606eb01409e30dfe9ca979c6277e925a5e885e66a234962ed99107fe4d00310c35","name":"owid-co2-data.csv","type":"text/csv","lastModified":1671311851094.529,"size":11818627},{"id":"067744c67061c5e50f9908ff9ea17ef8e1c6a8c04210fbcfb800fd511698155f7f03c311493fc84faf50f0acc8ff11d812cd36fc00d8226bb9411872443b6eaf","href":"https://static.observableusercontent.com/files/067744c67061c5e50f9908ff9ea17ef8e1c6a8c04210fbcfb800fd511698155f7f03c311493fc84faf50f0acc8ff11d812cd36fc00d8226bb9411872443b6eaf","name":"imagen@1.png","type":"image/png","lastModified":1671312069099.773,"size":70473},{"id":"76d4b7a1bf7440cff87d30058e0cc919eb0e6e686853d0091ccf2d6fc89c0036a41394086f6b2c80412800109007b1cd2514b5f4c8888c0ffb56d78ecbccf8de","href":"https://static.observableusercontent.com/files/76d4b7a1bf7440cff87d30058e0cc919eb0e6e686853d0091ccf2d6fc89c0036a41394086f6b2c80412800109007b1cd2514b5f4c8888c0ffb56d78ecbccf8de","name":"world.json","type":"application/json","lastModified":1671996245926.096,"size":209743},{"id":"e7a92468c9844d0d81f4a928081bd31df37163d83f0f79ccc31e8cad6001573af18619318b687d48ee947a5001fb02ff8033d643d8569b1d66876ecaff453c4c","href":"https://static.observableusercontent.com/files/e7a92468c9844d0d81f4a928081bd31df37163d83f0f79ccc31e8cad6001573af18619318b687d48ee947a5001fb02ff8033d643d8569b1d66876ecaff453c4c","name":"Electricity generation by source-1.csv","type":"text/csv","lastModified":1672936184088.273,"size":547},{"id":"a990e30efcac36665d5328a91e74114472eb614b80adda6ef7d9e44340b911504f2099b60b80655796c25c312a5f57e9f91c629b43b1eb374498e7ab372be254","href":"https://static.observableusercontent.com/files/a990e30efcac36665d5328a91e74114472eb614b80adda6ef7d9e44340b911504f2099b60b80655796c25c312a5f57e9f91c629b43b1eb374498e7ab372be254","name":"country-coord@1.csv","type":"text/csv","lastModified":1673456144138.117,"size":8760},{"id":"56a6fde7559d8f9e1e88afdfdaeb21382a79436b6b3ba636b1acc2a482038a4bbf13e59f5154856664b84ab1efd6c4d2b7a48a02dfc9b604e6f1a9e03a3808c0","href":"https://static.observableusercontent.com/files/56a6fde7559d8f9e1e88afdfdaeb21382a79436b6b3ba636b1acc2a482038a4bbf13e59f5154856664b84ab1efd6c4d2b7a48a02dfc9b604e6f1a9e03a3808c0","name":"2front_page-01-01.png","type":"image/png","lastModified":1673363688899.931,"size":6239197},{"id":"52a67d8209a943f08f897d04cc5dd1ef8da5d27fa9a469619426105a0ee1597b47158ac329fcfde1440be2861103febadd16f7c75bc31fc4c84f8cfe578308a5","href":"https://static.observableusercontent.com/files/52a67d8209a943f08f897d04cc5dd1ef8da5d27fa9a469619426105a0ee1597b47158ac329fcfde1440be2861103febadd16f7c75bc31fc4c84f8cfe578308a5","name":"renewable-share-energy.csv","type":"text/csv","lastModified":1673864622323.133,"size":158582},{"id":"9e830e8fed76f4f3806407873205f2f004944109e797d9cfb00e9f4d94f6453bd89279dc031135958d8810a9c274da4a56a8a889aa91a265891563ca7300e036","href":"https://static.observableusercontent.com/files/9e830e8fed76f4f3806407873205f2f004944109e797d9cfb00e9f4d94f6453bd89279dc031135958d8810a9c274da4a56a8a889aa91a265891563ca7300e036","name":"imagen@4.png","type":"image/png","lastModified":1671313076262.025,"size":87032},{"id":"2ccb05dde29ff40498acc2a047e5c1c7b67e251cfc176b0e9a4eb00e98f814ee83411f41f745f909b39a2f52ee4e1137e08e9e8260d6b20bc8e3c307ddb7ffaa","href":"https://static.observableusercontent.com/files/2ccb05dde29ff40498acc2a047e5c1c7b67e251cfc176b0e9a4eb00e98f814ee83411f41f745f909b39a2f52ee4e1137e08e9e8260d6b20bc8e3c307ddb7ffaa","name":"imagen@5.png","type":"image/png","lastModified":1671313619095.297,"size":125974},{"id":"bc0858e8331fe6e2971813bb35134b5fb86ae5c20cb3ad587e3c653425ab6844306467e4b88e2ba17cf7b3311c3229ce76c4999bfd1e953696523fb8295156fe","href":"https://static.observableusercontent.com/files/bc0858e8331fe6e2971813bb35134b5fb86ae5c20cb3ad587e3c653425ab6844306467e4b88e2ba17cf7b3311c3229ce76c4999bfd1e953696523fb8295156fe","name":"imagen@6.png","type":"image/png","lastModified":1671313871890.72,"size":101783},{"id":"623169522a6bd5fa9f2a20ec3192e228eebdc4f95aeb9e09191111de467e416a47158c967856267312d95b5bfc56abaca5ae50188ffa02a62ca2063a3707cf02","href":"https://static.observableusercontent.com/files/623169522a6bd5fa9f2a20ec3192e228eebdc4f95aeb9e09191111de467e416a47158c967856267312d95b5bfc56abaca5ae50188ffa02a62ca2063a3707cf02","name":"imagen.png","type":"image/png","lastModified":1671311398633.265,"size":218807},{"id":"df6726326cd7567b2521268b43d3d4255a1fe6ac0f62130477bd5470eb75d2284f33156c89ddc5978aa66a41d62eb8c804febbebb90a98bcb4c1c6c83dfa16b9","href":"https://static.observableusercontent.com/files/df6726326cd7567b2521268b43d3d4255a1fe6ac0f62130477bd5470eb75d2284f33156c89ddc5978aa66a41d62eb8c804febbebb90a98bcb4c1c6c83dfa16b9","name":"imagen@2.png","type":"image/png","lastModified":1671312395309.669,"size":58977},{"id":"cc1f921e161dbedd39b3dbe537ac188189b257ca70f24424e1b7f325c35f93a46569150fbe0db193dcda30ef6b03f7f6c4b68a32c450038ad5b8a6a3ef671acd","href":"https://static.observableusercontent.com/files/cc1f921e161dbedd39b3dbe537ac188189b257ca70f24424e1b7f325c35f93a46569150fbe0db193dcda30ef6b03f7f6c4b68a32c450038ad5b8a6a3ef671acd","name":"imagen@3.png","type":"image/png","lastModified":1671312705624.587,"size":72328}] 2d:{"title":" CO2 emissions from oil - Judit Quintana & Wilber E. Bermeo ","cells":[{"id":1747,"value":"# CO2 emissions from oil - Judit Quintana & Wilber E. Bermeo ","pinned":false,"hidden":false,"mode":"md"},{"id":1743,"value":"FileAttachment(\"2front_page-01-01.png\").image()","pinned":false,"hidden":false,"mode":"ojs"},{"id":5,"value":"## Abstract\nCO2 is one of the gases that contribute to the greenhouse effect. By using the repository of [CO2 data](https://github.com/owid/co2-data) from Our World in Data, we have represented the increase of CO2 emissions from the oil industry. We have also determined which countries have the biggest impact on oil emissions, and we have represented the relationship between a country's economy and its emissions of CO2 from oil. Finally, we demonstrated that countries with higher emissions of CO2 from oil lack primary sources of renewable energy.\n","pinned":false,"hidden":false,"mode":"md"},{"id":197,"value":"toc({\n title: 'Index',\n headers: 'h2'\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1759,"value":"$2f","pinned":false,"hidden":false,"mode":"md"},{"id":1770,"value":"## Why are oil CO2 emissions a problem?","pinned":false,"hidden":false,"mode":"md"},{"id":1955,"value":"CO2 emissions from oil combustion are a problem because they account for almost one-third of total CO2 emissions.\n\nThe following story depicts how global CO2 emissions were distributed in 2021:","pinned":false,"hidden":false,"mode":"md"},{"id":1914,"value":"chart3 = DonutChart(\n total_co2_separated_sources_last_year.reduce( \n (a,c) => {\n if (c.name === \"Oil\"){\n return [c,...a]\n } else {\n let id_found = a.findIndex(element => element.name === \"Others\");\n let found = a[id_found]\n if (found) {\n a[id_found] = ({year: found.year, name: found.name, co2: found.co2 + c.co2})\n return a\n }\n else {\n return [({year: 2021, name: \"Others\", co2: c.co2}),...a]\n }\n }\n },[]),\n {\n name: d => d.name,\n value: d => d.co2,\n width,\n height: 500,\n colors: [\"#adadad\",\"#eb3838\"]\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1963,"value":"If we separate all CO2 emissions from their source, we will find the following:\n\n\n \n\t\n\t\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n

Industry	% of the total CO2 emissions
Coal	36%
Oil	26%
Gas	19%
Land Use	12%
Cement	4%
Flaring	1%
Other	0.7%

\n","pinned":false,"hidden":false,"mode":"md"},{"id":1957,"value":"Currently, the oil industry is the second-largest source of CO2 emissions. It is just below the emissions produced by the coal industry. As we can see in the next graph, their emissions are increasing every year. ","pinned":false,"hidden":false,"mode":"md"},{"id":1838,"value":"$30","pinned":false,"hidden":false,"mode":"ojs"},{"id":1998,"value":"$31","pinned":false,"hidden":false,"mode":"md"},{"id":317,"value":"## Which countries have higer emissions of CO2? \n### World map of CO2 emissions per capita in 2021\nThe story shows the CO2 in tons per person.","pinned":false,"hidden":false,"mode":"md"},{"id":446,"value":"worldConfirmedCases = {\n const h = height(projection.world);\n const p = projection.world;\n const svg = d3.create(\"svg\")\n .attr('viewBox', [0, 0, width, h*.85]);\n const topCO2PerCapita = data_2021_CO2_emissions_per_capita.slice(0,15).map(c => c.iso)\n radius.range([.5,width/75])\n drawMap(svg, p)\n annotate(svg, p, topCO2PerCapita, 'co2_per_capita')\n return svg.node();\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":2170,"value":"As we can see, the highest CO2 emissions per capita are in the Arabian Peninsula. In this region, there are several countries whose economies depend, or once depended, on oil, such as Qatar, Saudi Arabia and the United Arab Emirates.\n\nThe top 3 counties with higher CO2 emissions from oil per capita are:\n\n \n\t\n\t\n \n \n \n \n \n \n \n \n \n \n \n \n \n

Country	Tonnes per person of CO2
Qatar	35.59
Bahrain	26.66
Kuwait	24.97

","pinned":false,"hidden":false,"mode":"md"},{"id":330,"value":"### Higer emissions of CO2 from oil ","pinned":false,"hidden":false,"mode":"md"},{"id":370,"value":"Although there are many countries with high CO2 emissions per capita, such as Qatar, Saudi Arabia or the United Arab Emirates, which are highly related to the oil industry, we cannot ignore those with high overall CO2 emissions from oil.","pinned":false,"hidden":false,"mode":"md"},{"id":2188,"value":"Swatches(d3.scaleOrdinal([\"CO2 emissions from oil\", \"Total CO2 emissions\"], [\"#eb3838\",\"#adadad\"]))","pinned":false,"hidden":false,"mode":"ojs"},{"id":868,"value":"Plot.plot({\n width: width,\n height: width * 0.4,\n marginRight: 100,\n marginLeft: 100,\n grid: true,\n x: {\n label: \"CO2 emissions from oil measured in million tonnes\"\n },\n y:{\n domain: d3.sort(top_10_co2_oil_emissions, e => -e.oil_co2).map(d => d.country),\n label: null\n },\n marks: [\n Plot.barX(\n top_10_co2_oil_emissions, \n {\n y: \"country\", \n x: \"co2\",\n fill: \"#adadad\",\n opacity: 0.75\n }),\n Plot.barX(\n top_10_co2_oil_emissions, \n {\n y: \"country\", \n x: \"oil_co2\",\n fill: \"#eb3838\"\n })\n ]\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":2205,"value":"Taking these results and information from other sources into account, we have developed a list of the countries that contribute the most to CO2 oil emissions.\n- 🇶🇦 Qatar \n- 🇧🇭 Bahrain \n- 🇰🇼 Kuwait \n- 🇹🇹 Trinidad and Tobago \n- 🇦🇪 United Arab Emirates \n- 🇨🇳 China \n- 🇸🇦 Saudi Arabia \n- 🇴🇲 Oman \n- 🇦🇺 Australia \n- 🇲🇳 Mongolia \n- 🇺🇸 United States \n- 🇰🇿 Kazakhstan \n- 🇨🇦 Canada\n- 🇹🇲 Turmenistan \n- 🇷🇺 Russia \n- 🇱🇾 Libya \n- 🇧🇳 Brunei \n- 🇬🇫 Guayana \n- 🇮🇶 Iraq \n- 🇮🇷 Iran","pinned":false,"hidden":false,"mode":"md"},{"id":3164,"value":"\n----\n\n⚠ **Disclaimer**\n\n*From now on, we will refer to the countries on the list as \"oil countries.\"\nIt is important to not misunderstand this term and think of them as oil-producing countries.\nThis story reflects the big emissions related to oil, whether they are oil-producing countries or not.*\n\n\n----","pinned":false,"hidden":false,"mode":"md"},{"id":346,"value":"## Evolution of CO2 emissions over the years","pinned":false,"hidden":false,"mode":"md"},{"id":377,"value":"In this graphic shows the 30 countries that contribute the most over the years to CO2 oil emissions. Circle size depends on howh big are these emissionse. A red circle means that the country is an oil country. \n\nThe aim of this representation is to show the big impact of oil countries on global CO2 emissions over time.","pinned":false,"hidden":false,"mode":"md"},{"id":2512,"value":"viewof fromOilYear = Scrubber(d3.range(1877, 2021), {loop: false, delay: 200, autoplay: false})","pinned":false,"hidden":false,"mode":"ojs"},{"id":2822,"value":"Swatches(d3.scaleOrdinal([\"Oil countries\", \"Other countries\"], [\"#eb3838\",\"#adadad\"]))","pinned":false,"hidden":false,"mode":"ojs"},{"id":2298,"value":"chartX()","pinned":false,"hidden":false,"mode":"ojs"},{"id":3191,"value":"This graph clearly shows how, over time, oil countries have become more responsible for global CO2 emissions.\n\nBeginning in 1877 with only five countries in the ranking, with the United States in the top three, and ending in 2020 with nine countries, with China and the United States in the first and second positions, respectively, of the top three.","pinned":false,"hidden":false,"mode":"md"},{"id":367,"value":"## CO2 emissions by source in the Oil Countries","pinned":false,"hidden":false,"mode":"md"},{"id":381,"value":"Despite the fact that we are attempting to demonstrate how CO2 emissions from oil have a significant impact on oil countries, not all of them have only big productions of oil CO2 emissions, but from other sources instead. This treemap depicts the distribution of emissions in each of these countries.\n","pinned":false,"hidden":false,"mode":"md"},{"id":1584,"value":"viewof selectedCountryEx4 = Inputs.select(data\n .filter(c => c.year === \"2021\" && c.iso_code !== \"\" && oil_countries.includes(c.iso_code))\n .map(function(c) {\n return {\n iso_code: c.iso_code,\n name: c.country\n }\n }), \n {\n label: \"Select the desired oil country\", \n format: x => x.name\n })","pinned":false,"hidden":false,"mode":"ojs"},{"id":3069,"value":"Swatches(d3.scaleOrdinal([\"from oil\", \"from coal\", \"from gas\", \"from flaring\", \"form cement\",\"from land use\"], \n [\"#eb3838\",\"#002051\",\"#414487\",\"#696970\",\"#2b446e\",\"#2a788e\"]))","pinned":false,"hidden":false,"mode":"ojs"},{"id":1571,"value":"$32","pinned":false,"hidden":false,"mode":"ojs"},{"id":3205,"value":"The countries that its principal CO2 emissions come from oil are:\n- United States\n- Canada\n- Saudi Arabia\n- Iraq\n- Libya\n- Kuwait","pinned":false,"hidden":false,"mode":"md"},{"id":372,"value":"## Compare CO2 emissions and CO2 emissions form oil between countries","pinned":false,"hidden":false,"mode":"md"},{"id":386,"value":"In this graph, you can compare the total CO2 emissions and CO2 emissions produced by oil between oil countries and the rest of the world.","pinned":false,"hidden":false,"mode":"md"},{"id":3350,"value":"viewof oilContriesSearcher = Inputs.search(\n oilContriesTables, \n {\n label: \"Search an Oil Country\",\n multiple: true,\n autocomplete: true,\n columns: ['name', 'iso_code']\n })","pinned":false,"hidden":false,"mode":"ojs"},{"id":1053,"value":"viewof selectedOilCountry = Inputs.select(oilContriesSearcher, \n {\n label: \"Oil Country\", \n sort: tablesSortFn,\n format: x => x.name\n })","pinned":false,"hidden":false,"mode":"ojs"},{"id":3303,"value":"viewof nonOilContriesSearcher = Inputs.search(\n nonOilContriesTables, \n {\n label: \"Search a non Oil Country\",\n multiple: true,\n autocomplete: true,\n columns: ['name', 'iso_code']\n })","pinned":false,"hidden":false,"mode":"ojs"},{"id":3364,"value":"viewof selectedCountry = Inputs.select(nonOilContriesSearcher, { label: \"Non Oil Country\", format: x => x.name, sort: tablesSortFn})","pinned":false,"hidden":false,"mode":"ojs"},{"id":2315,"value":"Swatches(d3.scaleOrdinal([\"CO2 emissions from oil\", \"Total CO2 emissions\"], [\"#eb3838\",\"#adadad\"]))","pinned":false,"hidden":false,"mode":"ojs"},{"id":1046,"value":"$33","pinned":false,"hidden":false,"mode":"ojs"},{"id":393,"value":"## Evolution of the economy over time related to oil CO2 emissions from oil countries","pinned":false,"hidden":false,"mode":"md"},{"id":3100,"value":"In this plot, we can follow the economic evolution of oil countries at the same time we compare their oil CO2 emissions.\n\n*The following countires are the ones that show a stronger relationship between its economy growth and the increase of CO2 emissions from oil.*\n\n*Select them to compare their evolution through years.*","pinned":false,"hidden":false,"mode":"md"},{"id":3091,"value":"viewof trailed = Inputs.checkbox([\"United States\",\"China\",\"Australia\",\"Russia\",\"Canada\",\"Saudi Arabia\",\"Iran\",\"Iraq\",\"Oman\"])","pinned":false,"hidden":false,"mode":"ojs"},{"id":1286,"value":"viewof yearValueForG7 = Scrubber(d3.range(1877, 2019), {loop: false, delay: 200, autoplay: false})","pinned":false,"hidden":false,"mode":"ojs"},{"id":2837,"value":"Legend(d3.scaleSequential([1 , 30000 ], d3.interpolateGreens), {\n title: \"GDP per capita (10^9 $)\"\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1288,"value":"$34","pinned":false,"hidden":false,"mode":"ojs"},{"id":3106,"value":"## The use of renewable energies \nThe goal of this plot is to demonstrate that oil countries do not use renewable energy in the same proportion as other countries.","pinned":false,"hidden":false,"mode":"md"},{"id":3134,"value":"Swatches(d3.scaleOrdinal([\"Oil country\", \"Non oil country\"], [\"#eb3838\",\"#adadad\"]))","pinned":false,"hidden":false,"mode":"ojs"},{"id":3109,"value":"\nPlot.plot({\n x: {\n label: \"% of primary energy from renewable sources\",\n\n },\n y: {\n label: null,\n },\n grid: true,\n marks: [\n Plot.barX(renewable_energy_countries , {x: \"renewable\", y: \"country\", fill: \"is_oil_country\", \n sort: {y: 'x', reverse: true}})\n ],\n marginLeft: 100,\n color: {\n range: [\"#adadad\", \"#eb3838\"]\n },\n})\n\n","pinned":false,"hidden":false,"mode":"ojs"},{"id":3223,"value":"As we can see, the list includes only one country classified as an \"oil country\": Canada.\n\nCanada is one of the biggest oil and natural gas producers in America. However, a large portion of its output is exported.\nCurrently, almost all of Canada's oil and natural gas exports go to one customer: the United States.\n\nHydro power is historically Canada's main source of energy, providing around 60% of the electricity. New renewable sources - wind, solar, tidal waves and others – have the highest growth rate and are projected to reach 12% of total power generation by 2035, according to the Canada Energy Regulator (CER).","pinned":false,"hidden":false,"mode":"md"},{"id":2690,"value":"## Conclusions\n\nIn the course of this study, we have seen the relationship between CO2 oil emissions and their huge impact on global CO2 emissions. We've shown that the countries with the highest oil-related CO2 emissions also contribute the most to global CO2 emissions.\nThe penultimate plot shows us how oil CO2 emissions are also strongly related to the growth of the country's gross domestic product.\n\nNowadays, the oil industry is one of the most powerful industries in the world. It has been the solution for a lot of countries in the Global South to raise their economies. \n\nAs a single person, fighting against global warming and the oil industry is almost impossible. However, we can always do whatever is in our hands to not contribute more to it.\nUsing renewable energies as a source of energy from your home, like solar power or wind power, or using an electric car or a bike instead of fuel powered vehicles are good options to adapt to our lifestyles to help the environment.\n\n\n","pinned":false,"hidden":false,"mode":"md"},{"id":21,"value":"---\n## Other questions\nAs the CO2 dataset of Our World in Data is constantly expanding, it would be interesting to see how CO2 emissions evolve, especially with the advent of new technologies that could replace the use of oil in the energy or transport markets.\n\nIt would also be interesting to see other ways of looking at the evolution of oil-producing countries as their CO2 levels increase.\n\nFinally, it would be a good idea to experiment with new visualizations to demonstrate how oil is used and why it is so important in our lives.","pinned":false,"hidden":false,"mode":"md"},{"id":209,"value":"---\n## Addendum","pinned":false,"hidden":false,"mode":"md"},{"id":2554,"value":"### Libraries","pinned":false,"hidden":false,"mode":"md"},{"id":2598,"value":"import {SummaryTable} from \"@observablehq/summary-table\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":19,"value":"import { toc } from \"@nebrius/indented-toc\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":495,"value":"d3 = {\n const d3 = await require(\"d3-array@^2.2\", \"d3-shape@1\", \"d3-axis@1\", \"d3-format@1\", \"d3-random@1\", \"d3-scale@2\", \"d3-random@1\", \"d3-selection@1\", \"d3-fetch@1\", \"d3-brush\",\"d3-zoom\",\"d3-interpolate\", \"d3-transition@1\", \"d3-scale-chromatic@1\", \"d3-geo@1\", \"d3-time-format\", \"d3-geo-projection@2\", \"d3-force@1\");\n d3.bin = d3.histogram;\n d3.area = d3.area;\n return d3;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":2226,"value":"d3_v2 = require(\"https://d3js.org/d3.v5.min.js\")","pinned":false,"hidden":false,"mode":"ojs"},{"id":2557,"value":"### Data","pinned":false,"hidden":false,"mode":"md"},{"id":342,"value":"data = FileAttachment(\"owid-co2-data.csv\").csv()","pinned":false,"hidden":false,"mode":"ojs"},{"id":349,"value":"viewof table = Inputs.table(data)","pinned":false,"hidden":false,"mode":"ojs"},{"id":2596,"value":"viewof summary_data = SummaryTable(co2_total_and_oil, {label: html`Data Summary`})","pinned":false,"hidden":false,"mode":"ojs"},{"id":746,"value":"$35","pinned":false,"hidden":false,"mode":"ojs"},{"id":507,"value":"countries_data_raw = FileAttachment(\"country-coord@1.csv\").csv()","pinned":false,"hidden":false,"mode":"ojs"},{"id":513,"value":"countries_data = countries_data_raw.map(c => {\n const iso = c.alpha3code;\n var iso_code = iso;\n switch (iso) {\n case 'TZ':\n iso_code = 'TZA';\n break;\n case 'TW':\n iso_code = 'TWN';\n break;\n case 'IR':\n iso_code = 'IRN';\n break;\n case 'BO':\n iso_code = 'BOL';\n break;\n case 'PS':\n iso_code = 'PSE';\n break;\n case 'VE':\n iso_code = 'VEN';\n break;\n case 'KP':\n iso_code = 'KOR';\n break;\n case 'KR':\n iso_code = 'PRK';\n break;\n }\n\n return ({\n iso_code: iso_code,\n lat: c.lat, \n lon: c.lon \n })\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":406,"value":"data_2021_CO2_emissions_per_capita = data.filter(c => c.year === \"2021\" && c.iso_code !== \"\" && c.co2_per_capita !== \"\" && c.population > 1000000 ).map((c) => {\n const coord = countries_data.filter(x => x.iso_code === c.iso_code)[0];\n if (coord === undefined){\n return ({country: c.country, \n iso_code: c.iso_code, \n co2_per_capita: c.co2_per_capita\n })\n } else {\n return ({country: c.country, \n iso: c.iso_code, \n co2_per_capita: c.co2_per_capita,\n co2_opacity: (c.co2_per_capita * 2 / 100) + 0.1,\n lat: coord.lat, \n lon: coord.lon,\n pop: c.population})\n }\n}).filter(c => c.lat !== undefined && c.lon !== undefined)","pinned":false,"hidden":false,"mode":"ojs"},{"id":473,"value":"data_2021_CO2_emissions_per_capita_sorted = data_2021_CO2_emissions_per_capita.sort((a,b) => b.co2_per_capita - a.co2_per_capita)","pinned":false,"hidden":false,"mode":"ojs"},{"id":673,"value":"#### World Map Graphic with emissions per capita","pinned":false,"hidden":false,"mode":"md"},{"id":2633,"value":"##### Plan","pinned":false,"hidden":false,"mode":"md"},{"id":322,"value":"![imagen.png](${await FileAttachment(\"imagen.png\").url()})","pinned":false,"hidden":false,"mode":"md"},{"id":2636,"value":"##### Functions","pinned":false,"hidden":false,"mode":"md"},{"id":449,"value":"function height (p){\n const projection = p;\n const [[x0, y0], [x1, y1]] = d3.geoPath(projection.fitWidth(width, {type: \"Sphere\"})).bounds({type: \"Sphere\"});\n const dy = Math.ceil(y1 - y0), l = Math.min(Math.ceil(x1 - x0), dy);\n projection.scale(projection.scale() * (l - 1) / l).precision(0.2);\n return dy;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":490,"value":"number = d3.format(',.2~f')","pinned":false,"hidden":false,"mode":"ojs"},{"id":457,"value":"radius = d3.scaleSqrt([0,d3.max(data_2021_CO2_emissions_per_capita, c=> c.co2_per_capita)], [.5, width/30])","pinned":false,"hidden":false,"mode":"ojs"},{"id":463,"value":"path = d3.geoPath();","pinned":false,"hidden":false,"mode":"ojs"},{"id":470,"value":"countryBorders = ({\n type: \"GeometryCollection\",\n geometries: worldMap.objects.countries.geometries.filter(d=> d.properties.ISO3_CODE.length <= 3)\n });","pinned":false,"hidden":false,"mode":"ojs"},{"id":461,"value":"noAntarctica = ({\n type: \"GeometryCollection\",\n geometries: worldMap.objects.countries.geometries.filter(d=> d.properties.ISO3_CODE !== 'ATA')\n });","pinned":false,"hidden":false,"mode":"ojs"},{"id":485,"value":"function moveLabels(countries, proj = null) {\n countries.forEach(c => {\n [c.x, c.y] = (proj)?proj([c.lon, c.lat]):[c.x0, c.y0];\n c.r = 24;\n });\n\n const force = d3\n .forceSimulation()\n .force(\"x\", d3.forceX(d => d.x))\n .force(\"y\", d3.forceY(d => d.y))\n .force(\"collide\", d3.forceCollide().radius(d => d.r).iterations(100))\n .nodes(countries)\n .stop()\n .tick(100);\n\n return countries;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":459,"value":"worldMap = FileAttachment('world.json').json()","pinned":false,"hidden":false,"mode":"ojs"},{"id":481,"value":"$36","pinned":false,"hidden":false,"mode":"ojs"},{"id":455,"value":"function drawMap(svg, p){\n svg.append(\"path\")\n .datum(topojson.feature(worldMap, noAntarctica))\n .attr(\"fill\", function(e) { return \"#ededed\"})\n .attr(\"d\", path.projection(p));\n\n svg.append(\"path\")\n .datum(topojson.mesh(worldMap, countryBorders, (a, b) => a !== b))\n .attr(\"fill\", \"none\")\n .attr(\"stroke\", '#bdbdbd')\n .attr(\"stroke-width\", .5)\n .attr(\"stroke-linejoin\", \"round\")\n .attr(\"d\", path.projection(p));\n \n svg.append(\"g\")\n .attr(\"class\", \"co2_per_capita\")\n .attr(\"fill\", \"#002051\")\n // .attr(\"stroke\", \"#002051\")\n // .attr(\"stroke-width\", 0.5)\n .selectAll(\"circle\")\n .data(data_2021_CO2_emissions_per_capita_sorted) //.slice(0,100)\n .join(\"circle\")\n .attr(\"fill-opacity\", d => `${d.co2_opacity}`)//\".2\")\n .attr(\"transform\", d => `translate(${p([d.lon,d.lat])[0]},${p([d.lon,d.lat])[1]})`)\n .attr(\"r\", d => radius(d.co2_per_capita))\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":499,"value":"projection = ({\n world: d3.geoKavrayskiy7(),\n europe: d3.geoAzimuthalEqualArea().rotate([-16,-55]).scale(900),\n asia: d3.geoAzimuthalEqualArea().rotate([-85,-29]).scale(480),\n us: d3.geoAlbersUsa().scale(1250).translate([487.5, 305])\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":976,"value":"#### Barplot with TOP 10 CO2 oil emissions and CO2 total emissions \n##### Plan","pinned":false,"hidden":false,"mode":"md"},{"id":337,"value":"![imagen@1.png](${await FileAttachment(\"imagen@1.png\").url()})","pinned":false,"hidden":false,"mode":"md"},{"id":2645,"value":"##### Functions","pinned":false,"hidden":false,"mode":"md"},{"id":1010,"value":"top_10_co2_oil_emissions = co2_total_and_oil.filter(c => c.year === last_year_with_data ).slice(0, TOP_N_CO2)","pinned":false,"hidden":false,"mode":"ojs"},{"id":780,"value":"Inputs.table(top_10_co2_oil_emissions)","pinned":false,"hidden":false,"mode":"ojs"},{"id":978,"value":"#### Pie Chart with top 10 countries with higher CO2 emissions in oil industry\n##### Plan","pinned":false,"hidden":false,"mode":"md"},{"id":2281,"value":"![imagen@2.png](${await FileAttachment(\"imagen@2.png\").url()})","pinned":false,"hidden":false,"mode":"md"},{"id":2660,"value":"##### Function","pinned":false,"hidden":false,"mode":"md"},{"id":2293,"value":"chartY = () => DonutChart(\n co2_total_and_oil.filter(c => parseInt(c.year) === fromOilYearY).slice(0,10).filter(c => c.oil_co2 > 0), \n {\n name: d => d.country,\n value: d => d.oil_co2,\n width,\n height: 500,\n colors: co2_total_and_oil.filter(c => parseInt(c.year) === fromOilYearY).slice(0,10).filter(c => c.oil_co2 > 0).map(c => stringToColour(\"j\" + c.country))\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":980,"value":"$37","pinned":false,"hidden":false,"mode":"ojs"},{"id":2664,"value":"#### CO2 emissions evolution in oil countries\n##### Plan","pinned":false,"hidden":false,"mode":"md"},{"id":391,"value":"![imagen@5.png](${await FileAttachment(\"imagen@5.png\").url()})\n","pinned":false,"hidden":false,"mode":"md"},{"id":2675,"value":"##### Functions","pinned":false,"hidden":false,"mode":"md"},{"id":2277,"value":"chartX = () => chart(d3_v2.hierarchy(transformToGenericObjectList(bigest))\n .sum(function(d) { return d.value; })\n .sort(function(a, b) { return b.value - a.value }))","pinned":false,"hidden":false,"mode":"ojs"},{"id":2229,"value":"$38","pinned":false,"hidden":false,"mode":"ojs"},{"id":2241,"value":"function transformToGenericObjectList(flatData) {\n var container = {};\n container.children = [];\n var regionToCountry = {};\n flatData.forEach(entry => {\n container.children.push({group: oil_countries.includes(entry.iso_code) ? \"oil\" : \"no_oil\", value: entry.co2, name: entry.country});\n });\n \n return container;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":2257,"value":"bigest = co2_total_and_oil.filter(c => parseInt(c.year) === fromOilYear && c.co2 > 0).sort((a,b) => b.co2 - a.co2).slice(0,30)","pinned":false,"hidden":false,"mode":"ojs"},{"id":1392,"value":"#### CO2 emissions sources in oil countries\n##### Plan","pinned":false,"hidden":false,"mode":"md"},{"id":369,"value":" $\"imagen@3.png\"$ ","pinned":false,"hidden":false,"mode":"html"},{"id":2667,"value":"##### Functions","pinned":false,"hidden":false,"mode":"md"},{"id":1430,"value":" // https://observablehq.com/@will-r-chase/voronoi-treemap\nd36 = require('d3@6')","pinned":false,"hidden":false,"mode":"ojs"},{"id":1397,"value":"hierarchy = {\n\n const { children } = dataEx4\n const fChildren = (children || []).filter(c => c.iso === selectedCountryEx4.iso_code)\n \n const dataCopy = JSON.parse( JSON.stringify( { children: fChildren } ) )\n\n return d36.hierarchy( dataCopy )\n .sum(d => d.value)\n .sort((a, b) => b.value - a.value)\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1563,"value":"dataEx4","pinned":false,"hidden":false,"mode":"ojs"},{"id":2246,"value":"$39","pinned":false,"hidden":false,"mode":"ojs"},{"id":1457,"value":"colorScale = d36.scaleOrdinal( d36.schemeSet2 )","pinned":false,"hidden":false,"mode":"ojs"},{"id":1459,"value":"treemap = d36.treemap()\n // set the size of the treemap render area\n .size([ width, 500 ])\n // set the padding between every rectangle in px\n .padding(2)\n // set the padding at the top of each group of rectangles\n // so that we can fit the country labels\n .paddingTop(10)\n // Set the generator to round pixel values to the nearest value\n // (makes things look better)\n .round(true)","pinned":false,"hidden":false,"mode":"ojs"},{"id":1463,"value":"root = treemap( hierarchy )","pinned":false,"hidden":false,"mode":"ojs"},{"id":3291,"value":"oilContriesTables = co2_total_and_oil\n .filter(c => c.year === 2021 && oil_countries.includes(c.iso_code))\n .map(function(c) { \n return {\n iso_code: c.iso_code,\n name: c.country\n }\n })","pinned":false,"hidden":false,"mode":"ojs"},{"id":3298,"value":"nonOilContriesTables = co2_total_and_oil\n .filter(c => c.year === 2021 && !oil_countries.includes(c.iso_code))\n .map(function(c) { \n return {\n iso_code: c.iso_code,\n name: c.country\n }\n })","pinned":false,"hidden":false,"mode":"ojs"},{"id":3294,"value":"tablesSortFn = function(a, b) {\n if (a.name < b.name)\n return -1\n if (b.name < a.name)\n return 1\n return 0\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1282,"value":"#### Comparision between countries bar plot\n##### Plan","pinned":false,"hidden":false,"mode":"md"},{"id":376,"value":"![imagen@4.png](${await FileAttachment(\"imagen@4.png\").url()})","pinned":false,"hidden":false,"mode":"md"},{"id":1673,"value":"#### Evolution of CO2 emissions and CDP\n##### Plan","pinned":false,"hidden":false,"mode":"md"},{"id":396,"value":"![imagen@6.png](${await FileAttachment(\"imagen@6.png\").url()})\n","pinned":false,"hidden":false,"mode":"md"},{"id":2867,"value":"##### Functions\n","pinned":false,"hidden":false,"mode":"md"},{"id":2729,"value":"maxCO2perCapitafromOil = 20","pinned":false,"hidden":false,"mode":"ojs"},{"id":2779,"value":"minGDP = Math.min(...dataEx8.map(e => e.gdp))","pinned":false,"hidden":false,"mode":"ojs"},{"id":2741,"value":"maxGDP = Math.max(...dataEx8.map(e => e.gdp))","pinned":false,"hidden":false,"mode":"ojs"},{"id":2724,"value":"dataEx8 = co2_total_and_oil.filter(function(c) {\n const base = oil_countries.includes(c.iso_code) \n && c.oil_co2_per_capita > 0 \n && c.gdp > 0 \n && c.population > 1000000\n && parseInt(c.year) >= 1877\n && parseInt(c.year) <= 2018\n if (c.country === \"Kuwait\") return base && parseInt(c.year) !== 1991\n else return base\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":3061,"value":"trail = dataEx8\n .filter(e => trailed.includes(e.country))\n .sort((a, b) => a.year - b.year)\n .filter(e => e.year >= yearValueForG7 - 20 && e.year <= yearValueForG7)","pinned":true,"hidden":false,"mode":"ojs"},{"id":3111,"value":"#### Renewable energies\n##### Functions","pinned":false,"hidden":false,"mode":"md"},{"id":3118,"value":"renewable_energy = FileAttachment(\"renewable-share-energy.csv\").csv({typed: true})","pinned":false,"hidden":false,"mode":"ojs"},{"id":3114,"value":"renewable_energy_countries = renewable_energy.filter(entry => entry.Code != null && entry.Year == 2021).map(x => {\n return {\n country: x.Entity,\n iso_code: x.Code,\n renewable: x[\"Renewables (% equivalent primary energy)\"],\n is_oil_country: oil_countries.includes(x.Code)\n }\n}).sort((a, b) => a.renewable < b.renewable ? 1 : -1).slice(0, 20)","pinned":true,"hidden":false,"mode":"ojs"},{"id":2574,"value":"### Variables","pinned":false,"hidden":false,"mode":"md"},{"id":1807,"value":"last_year_with_data = 2021","pinned":false,"hidden":false,"mode":"ojs"},{"id":790,"value":"TOP_N_CO2 = 10","pinned":false,"hidden":false,"mode":"ojs"},{"id":1232,"value":"oil_countries = [\"QAT\",\"BHR\",\"KWT\",\"TTO\",\"ARE\",\"SAU\",\"OMN\",\"AUS\",\"MNG\",\"USA\",\"KAZ\",\"CAN\",\"TKM\",\"RUS\",\"LBY\",\"BRN\",\"GUY\",\"IRQ\",\"IRN\",\"CHN\"]\n //,\"NOR\",\"GNQ\",\"GAB\",\"AZE\",\"COG\",\"AGO\",\"ECU\",\"DZA\",\"SUR\",\"VEN\",\"MYS\",\"COL\",\"MEX\",\"BRA\",\"NGA\"]","pinned":false,"hidden":false,"mode":"ojs"},{"id":2546,"value":"### Reusable functions","pinned":false,"hidden":false,"mode":"md"},{"id":2548,"value":"$3a","pinned":false,"hidden":false,"mode":"ojs"},{"id":2039,"value":"function stringToColour(str) {\n var hash = 0;\n for (var i = 0; i < str.length; i++) {\n hash = str.charCodeAt(i) + ((hash << 5) - hash);\n }\n var colour = '#';\n for (var i = 0; i < 3; i++) {\n var value = (hash >> (i * 8)) & 0xFF;\n colour += ('00' + value.toString(16)).substr(-2);\n }\n return colour;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":2190,"value":"$3b","pinned":false,"hidden":false,"mode":"ojs"},{"id":2840,"value":"$3c","pinned":false,"hidden":false,"mode":"ojs"},{"id":1259,"value":"### Discarded graphics","pinned":false,"hidden":false,"mode":"md"},{"id":1893,"value":"total_co2_separated_sources_last_year = total_co2_separated_sources_by_year.filter(c => c.year === last_year_with_data)","pinned":false,"hidden":false,"mode":"ojs"},{"id":1827,"value":"$3d","pinned":false,"hidden":false,"mode":"ojs"},{"id":2578,"value":"#### Pie Chart with totals of all CO2 emissions ","pinned":false,"hidden":false,"mode":"md"},{"id":1148,"value":"chart2 = DonutChart(\n total_co2_separated_sources_last_year.filter(c => c.co2 > 0), \n {\n name: d => d.name,\n value: d => d.co2,\n width,\n height: 500\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":2828,"value":"#### CO2 from oil emissions - All countries through years","pinned":false,"hidden":false,"mode":"md"},{"id":2831,"value":"viewof fromOilYearY = Scrubber(d3.range(1877, 2021), {loop: false, delay: 350})","pinned":false,"hidden":false,"mode":"ojs"},{"id":2825,"value":"chartY()","pinned":false,"hidden":false,"mode":"ojs"},{"id":2581,"value":"#### Plots with evolution of CO2 oil emissions and GDP ","pinned":false,"hidden":false,"mode":"md"},{"id":2479,"value":"viewof selectedCountryEx5 = Inputs.select(data\n .filter(c => c.year === \"2021\" && c.iso_code !== \"\" && oil_countries.includes(c.iso_code))\n .map(function(c) {\n return {\n iso_code: c.iso_code,\n name: c.country\n }\n }), \n {\n label: \"Select the desired oil country\", \n format: x => x.name\n })","pinned":false,"hidden":false,"mode":"ojs"},{"id":2427,"value":"Plot.plot({\n marginLeft: 50,\n width: 1000, \n height: 250,\n marks: [\n Plot.line(co2_total_and_oil.filter(c => c.iso_code === selectedCountryEx5.iso_code && c.gdp > 0 ).sort((a,b) => a.year - b.year)\n .map(c => ({year: parseInt(c.year),gdp: c.gdp})), \n {\n x: \"year\",\n y: \"gdp\",\n stroke: \"blue\"\n })\n ]\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":2497,"value":"Plot.plot({\n marginLeft: 50,\n width: 1000, \n height: 250,\n marks: [\n Plot.line(co2_total_and_oil.filter(c => c.iso_code === selectedCountryEx5.iso_code && c.gdp > 0).sort((a,b) => a.year - b.year)\n .map(c => ({year: parseInt(c.year),oil_co2_per_capita: c.oil_co2_per_capita * 4000 })), \n {\n x: \"year\",\n y: \"oil_co2_per_capita\",\n stroke: \"red\"\n })\n ]\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":2505,"value":"Plot.plot({\n marginLeft: 50,\n width: 1000, \n height: 500,\n marks: [\n Plot.line(co2_total_and_oil.filter(c => c.iso_code === selectedCountryEx5.iso_code && c.gdp > 0 ).sort((a,b) => a.year - b.year)\n .map(c => ({year: parseInt(c.year),gdp: c.gdp/c.population})), \n {\n x: \"year\",\n y: \"gdp\",\n stroke: \"blue\"\n }),\n Plot.line(co2_total_and_oil.filter(c => c.iso_code === selectedCountryEx5.iso_code && c.gdp > 0).sort((a,b) => a.year - b.year)\n .map(c => ({year: parseInt(c.year),oil_co2_per_capita: c.oil_co2_per_capita * 4000 })), \n {\n x: \"year\",\n y: \"oil_co2_per_capita\",\n stroke: \"red\"\n })\n ]\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":2583,"value":"## References","pinned":false,"hidden":false,"mode":"md"},{"id":2588,"value":"** DW Insights - (November 19, 2022).** *The Five Biggest Oil Producers* https://www.dwenergygroup.com/the-five-biggest-oil-producers-updated-2022/","pinned":false,"hidden":false,"mode":"md"},{"id":2684,"value":"** Vedantu - (January 4, 2023).** *Uses of petroleum* \nhttps://www.vedantu.com/chemistry/uses-of-petroleum","pinned":false,"hidden":false,"mode":"md"},{"id":2688,"value":"** Sarah Fecht - (February 25, 2021).** *How Exactly Does Carbon Dioxide Cause Global Warming?* \nhttps://news.climate.columbia.edu/2021/02/25/carbon-dioxide-cause-global-warming/","pinned":false,"hidden":false,"mode":"md"},{"id":2682,"value":"** Wikipedia. ** *List of countries by oil production* https://en.wikipedia.org/wiki/List_of_countries_by_oil_production","pinned":false,"hidden":false,"mode":"md"},{"id":3228,"value":"** The Canadian Association of Petroleum Producers (CAPP). ** *Markets* https://www.capp.ca/energy/markets/","pinned":false,"hidden":false,"mode":"md"},{"id":3230,"value":"** The International Trade Administration ** *Canada - Renewable Energy*\nhttps://www.trade.gov/energy-resource-guide-canada-renewable-energy","pinned":false,"hidden":false,"mode":"md"}],"files":"$W3e","stdlib":"1","titling":"auto"}