2f:T541,The Kyoto Protocol is an international agreement adopted at the third session of the conference of the parties to the United Nations Framework Convention on Climate Change (UNFCCC) on December 11, 1997. It consists of reducing the emission of main 6 polluting gases (carbon dioxide (CO2), methane (CH4), nitrous oxide (N2O), and the so-called F-gases (hydrofluorocarbons and perfluorocarbons) and sulphur hexafluoride (SF6)). It was established to **reduce by 5%** for a period of 2008 - 2012 compared to 1990, and then extended until 2020. It was established in the EU on April 29, 1998. It implies the commitment of numerous countries to address climate change. Participating nations adopted targets to reduce GHG emissions during specific commitment periods. These periods, known as the **First Commitment Period (2008-2012)** and **Second Commitment Period (2013-2020)**, were aimed at collectively slowing global warming. The primary aim of this report is to evaluate the degree to which individual nations within the EU27 have adhered to their respective commitments outlined in the Kyoto Protocol. By meticulously examining each country and its specific obligations, this analysis seeks to provide a comprehensive overview of how the protocol has influenced greenhouse gas (GHG) emissions in each country during both commitment periods.30:T4b3,--- ### Performance of EU countries against the GHG emission targets during the Kyoto Protocol commitment periods - The objective on GHG reduction for the **first commitment period (2008-2012)** globally was 5% but the **EU** committed to a **reduction of 8%**. However, not all EU member countries had this reduction set, since depending on factors such as economic and environmental, 14 of them had a greater or lesser reduction, or even some of them could increase their percentage compared to 1990. Also known as **Burden Sharing** - For the **second commitment period (2013-2020)** it was established that all EU member countries should have a **20% reduction**. **Which countries have achieved the desired objectives?** To answer this question, it is necessary to see the following plot, in **green**, all the countries that achieved the goal are represented; in **red**, those that did not meet their individual objective and in **gray** the EU27 objective. Additionally, each **black dot** represents the "Burden Sharing" for each country. A negative objective means that the country had to reduce that percentage of emissions, while, a positive objective allowed it to set that maximum limit.31:T57b,Plot.plot({ height: 780, width: 1000, marginLeft: 100, grid: true, x: { axis: "top", round: true, label: `Avg GHG (%) ${option}`, labelAnchor: "center", type: "linear", }, y: { label: null, }, marks: [ Plot.barX(Informacion_plot1, { y: "Country", x: x_b, sort: { y: "-x" }, fill: d => { if (d.Country === "European Union (27)") {return "#a2a2a2"} else if (d[x_b] >= 0) { return (d[x_b]) >= (d[x_d]) ? "#cc0605" : "#0e813c"; } else { return Math.abs(d[x_b]) < Math.abs(d[x_d]) ? "#cc0605" : "#0e813c"; } }, channels: {'GHG 1990': "ghg_1990", 'GHG Avg Over Time Period': Selec, 'Goal (%)': x_d}, tip: { format: { y: true, 'Goal (%)': true, x: true, 'GHG 1990': true, 'GHG Avg Over Time Period': true, fill: false, }, } }), Plot.dot(Informacion_plot1, { y: "Country", x: x_d, fill: "currentColor", color: "black", size: 6, }), Plot.text(Informacion_plot1.filter(d => d.Country == "European Union (27)"), {x: x_b, y: "Country", text: (d) => '· The EU had a ' + -(d[getCommitmentPeriodAttribute]) + '% improvement on the ' + getCommitmentPeriodLabel, lineAnchor: "bottom", dx: 390, dy: 5, fontSize: 15, fontWeight: "bold"}), Plot.ruleX([0]), ], });32:T4b9,--- ### How do countries compare in terms of Greenhouse gases emissions? It is hard to imagine the difference that exists between the emissions of each country when we talk about **millions of tons** of CO2 equivalents. This plot aims to give an impression of this comparison. You might find it **unsettling** to try to read the words in this plot, but that is the objective (it would be difficult to **breath** on a **polluted environment**). The size of each circle represents the part that the country had on that year's total GHG emissions. When the slider is in **1990**, the words will be hard to read. As the slider moves towards 2020, the circles sizes will change corresponding to the change in emissions on that year. The selected country will be **highlighted**. The **color** of the highlighted circle represents how well that country is doing, based on the emissions on 1990. We can see that **Germany** will be, most of the times, the responsible for not being able to read the words. For some of the countries like **Cyprus** and **Malta**, the circles will be really tiny. This gives us an impression on the difference between each country from the rest. **So, how big is your country?**33:T61d,canvas4 = { var c = this ? this.getContext('2d') : DOM.context2d(width, BP_height); var canvas = c.canvas; var i = this && this.i || 0; while (playing) { c.fillStyle = BP_Params.backgroundColor; c.fillRect(0, 0, width - 0 * 2, BP_height - 0 * 2); c.fillStyle = "grey"; c.font = '25px Verdana'; var countryTextWidth = c.measureText(selectedCountryName).width c.fillText("In " , (canvas.width/2) - 410, BP_height/2 - 80); c.fillText("emitted" , (canvas.width/2) - 410, BP_height/2); c.fillText("Million tonnes of CO2 equivalent gases" , (canvas.width/2) - 410, BP_height/2 + 40); c.fillText("That represents a " , (canvas.width/2) - 410, BP_height/2 + 80); c.fillText("of the year's GhG emissions in the EU " , (canvas.width/2) - 40, BP_height/2 + 80); meshes.forEach((mesh) => { mesh.update(c, width, BP_height); }); c.beginPath(); c.fillStyle = "#EB84AE"; c.font = 'bold 30px Verdana'; var textYearString = selectedYear, textYearWidth = c.measureText(textYearString).width; c.fillText(textYearString , (canvas.width/2) - 360, BP_height/2 - 80); c.fillText(selectedCountryName , (canvas.width/2) - 410, BP_height/2 - 40); c.fillStyle = "#DF5D91"; c.fillText(yearCountryEmissions.toFixed(2), (canvas.width/2) - 290, BP_height/2); c.fillText(countryPartForYear + '%', (canvas.width/2) - 180, BP_height/2 + 80); c.restore(); yield canvas; } yield canvas; } 34:T4ea,--- ### Data exploration: How do emissions compare before and after the first commitment period started? #### Emissions of Greenhouse gases (measured in tonnes per capita) and improvement from 1990 for EU countries. - Regarding the GHG emissions per capita, with the normalized data we can observe an overall **descent**, more noticeable after the first commitement period started. The majority of countries have the lowest values at the right side of the 2008 mark. If we observe the data on its original state, it is very clear that **Luxembourg** (a very industrialized country) has the highest values, followed by Ireland, Estonia and the Czech Republic. - About the difference in percentage from 1990 emissions, with the normalized data we see that the most amount of **improvement** has been done after the first commitment period started. Most of the red cells, which represent negative values, are grouped just before the 2008 mark. If we analize the data in its original form, the countries that improved **(Latvia, Bulgaria, Lituania, Estonia)** or worsened **(Slovenia, Spain, Cyprus)** stand out from the rest. - The line plot below lets us see the same information on a higher precision, and compare every value to the overall **EU mean**. 35:T1b4d,viewof heatmapPlot = { // Declare the chart dimensions and margins. const marginTop = 20; const marginRight = 1; const marginBottom = 40; const marginLeft = 40; const rowHeight = 15; const width = 1200; const height = rowHeight * plotData.names.length + marginTop + marginBottom; const color = (d) => { return heatmapColorScale(d, heatmapMode); }; const opacity = (d) => { return getOpacity(d, heatmapMode); }; const format = (d) => { return accessHeatMapValue(d); }; // Create the SVG container. const svg = d3 .create("svg") .attr("aria-label", "svgContainer") .attr("viewBox", [0, 0, width, height]) .attr("viewBox", [0, 0, width, height]) .attr("width", width) .attr("height", height) .attr("style", "max-width: 100%; height: auto;"); // if(heatmapMode == "Total emissions") { // svg.append("rect") // .attr("transform", "translate(" + (marginLeft - 50) + "," + marginTop + ")") // .attr("width", "100%") // .attr("height", "100%") // .attr("fill", "#73d7ff"); // } svg .append("g") .attr("transform", "translate(" + marginLeft + "," + marginTop + ")"); // Create the scales. const x = d3 .scaleLinear() .domain([d3.min(plotData.years), d3.max(plotData.years) + 1]) .rangeRound([marginLeft, width - marginRight]); const y = d3 .scaleBand() .domain(plotData.names) .rangeRound([marginTop, height - marginBottom]); svg .append("g") .attr("transform", `translate(${marginLeft - 10},0)`) .call(d3.axisLeft(y).tickSize(0)) .call((g) => g.select(".domain").remove()); // Create a cell for each (state, year) value. const f = d3.format(",d"); const index = d3.local(); svg .append("g") .selectAll("g") .data(plotData.values) .join("g") .attr("aria-label", "cellContainer") .attr("transform", (d, i) => `translate(0,${y(plotData.names[i])})`) .selectAll("rect") .data((d) => d) .join("rect") .attr("x", (d, i) => x(plotData.years[i]) + 1) // .attr("cx", (d, i) => x(plotData.years[i])) // .attr("cy", y.bandwidth() - 8) .attr("height", y.bandwidth() - 1) //.attr("r", 12) .attr("width", (d, i) => x(plotData.years[i] + 1) - x(plotData.years[i]) - 1) .attr("fill", (d) => (index == 0 ? "black" : d === 0 ? "#339cff" : color(d))) // .attr("fill-opacity", d => opacity(d)) // .attr("stroke", "black") // .attr("stroke-opacity", 0.2) // .attr("stroke-dasharray", 0.5) // .on("mouseover", function() { // d3.select(this).style("fill", "#222"); // }).on("mouseout", function(d) { // d3.select(this).style("fill", d.fill); // }) .append("title") .text((d, i) => `${format(d)} in ${plotData.years[i]}`); // Append the axes. svg .append("g") .call((g) => g .append("g") .attr("transform", `translate(0,${marginTop})`) .call(d3.axisTop(x).ticks(null, "d")) .call((g) => g.select(".domain").remove()) ) .call((g) => g .append("g") .attr("aria-label", "xAxis") .attr("transform", `translate(0,${height - marginBottom + 10})`) .call( d3 .axisBottom(x) .tickValues([plotData.year]) .tickFormat((x) => x) .tickSize(marginTop + marginBottom - height - 10) ) .call((g) => g .select(".tick text") .clone() .attr("dy", "2em") .style("font-weight", "bold") .style("font-size", "12") .text("First commitment period started") ) .call((g) => g.select(".domain").remove()) ); const xAxis = svg.selectAll("[aria-label*='xAxis']"); const line = d3.select(xAxis.selectChild().selectChild().nodes()[0]); line .attr("stroke", "black") .attr("stroke-width", "3") let timeout, focus = null; let returnColor, initialColor; let justExited = false; const svgNode = svg.node(); //const plotMap = d3.selectAll("[aria-label*='svgContainer']"); const rect = svg.selectAll("[aria-label*='cellContainer']"); svg .on("pointerover", highlight) .on("pointerout", restore) .on("click", handleClick) .on("pointerdown", handlePointerDown) .on("pointerup", handlePointerUp) .style("cursor", "default"); const map = html`

Hover over the heatmap to visualize the data for every country/year. Click on a cell to focus; click anywhere else on the heatmap to cancel focus.

${svgNode}

`; //updateSelection(null); // const initialRectWidth = d3.select(rect.nodes()[0].childNodes[0]).attr("width"); // const initialRectHeight = d3.select(rect.nodes()[0].childNodes[0]).attr("height"); return map; function highlight(e) { d3.select(this).style("cursor", focus === null ? "pointer" : "default"); if (focus !== null) return; const index = getTargetIndex(e); fill(index, true, true); if (timeout) clearTimeout(timeout); timeout = setTimeout(() => { if (index >= 0) { updateSelection(index); } }, 25); } function restore(e) { if (focus !== null || justExited) { justExited = false; return; } const index = getTargetIndex(e); fill(index); } function fillType(color, darker) { if (darker) return d3.color(color).darker(darker); else return color; } function fill(index, highlight, firstEnter, darker, exit) { if (index >= 0) { const countryIdx = parseInt(index.slice(0, 2)); const yearIdx = parseInt(index.slice(-2)); var color = null; const rectNode = d3.select(rect.nodes()[countryIdx].childNodes[yearIdx]); if (highlight) { color = "red"; } else if (exit) { color = initialColor; justExited = true; } else { color = returnColor; } if (firstEnter) { initialColor = rectNode.attr("fill"); } if (highlight) { returnColor = rectNode.attr("fill"); } rectNode.attr("fill", fillType(color, darker)); } } function handleClick(e) { debugger; const index = getTargetIndex(e); if (focus === index) { focus = null; return; } if (focus !== null) { fill(focus, false, false, false, true); focus = null; return; } if (index >= 0) { fill(index, true); focus = index; updateSelection(index); } else { focus = null; updateSelection(null); } } function handlePointerDown(e) { const index = getTargetIndex(e); if (index >= 0) { if (focus === null) { fill(index, true, false, true); } } } function handlePointerUp(e) { const index = getTargetIndex(e); if (index >= 0) { if (focus === null) { fill(index, false, false); } } } function getTargetIndex(e) { let tar = e.target; // Plot 0.4.0 tspan var index = tar instanceof SVGRectElement ? tar.__data__ : -1; if (index > 0) { } return index; } function updateSelection(data) { map.value = data; map.dispatchEvent(new CustomEvent("input")); } }36:T7e9,lineChart = Plot.plot({ marginRight: 35, width: 1200, height: 420, y: { grid: true, label: heatmapChosenData, }, x: { label: "Year", tickFormat: Plot.formatYear , }, color: { legend: true, label: linePlotLabel, scheme: getColorSchemeLinePlot(), reverse: heatmapChosenData == 'ghg_per_capita' ? false : true, }, marks: [ Plot.ruleY([0], {strokeOpacity: 1}), Plot.ruleX([2008], {strokeOpacity: 1, strokeWidth: 3}), Plot.line(ungroupedHeatmapValuesStruct.filter(d => d.country == selectedData.selectedCountry), { x: "year", y: heatmapChosenData, opacity: 0.5, stroke: "black", curve: "natural", }), Plot.line(eu_27_data, { x: "year", y: heatmapChosenData, opacity: 1, stroke: "red", strokeWidth: 2, curve: "natural", marker: true }), Plot.ruleX( ungroupedHeatmapValuesStruct, Plot.groupX( { y1: "min", y2: "max" }, { x: "year", y: heatmapChosenData, strokeDasharray: 2, opacity: 0.3 } ) ), Plot.dot(ungroupedHeatmapValuesStruct, { x: "year", y: heatmapChosenData, r: 7, fill: "grey", stroke: "white", opacity: 0.1 // strokeWidth: 0.7, }), Plot.dot(ungroupedHeatmapValuesStruct.filter(d => d.country == selectedData.selectedCountry), { x: "year", y: heatmapChosenData, r: 7, fill: heatmapChosenData, // strokeWidth: 0.7, tip: "xy" }), Plot.dot(ungroupedHeatmapValuesStruct.filter(d => d.country == selectedData.selectedCountry && d.year == selectedData.selectedYear + 1990), { x: "year", y: heatmapChosenData, r: 12, stroke: "red" }), Plot.text( eu_27_data, Plot.selectLast({ x: "year", y: heatmapChosenData, text: () => "EU27 mean", lineAnchor: "middle", fontSize: 14, fontWeight: "bold", dx: -40, dy: -20, }) ), ], });37:T459,--- ## Final thoughts With this exploration we can conclude that the **EU has achieved the goals on GHG reduction** stablished in the Kyoto protocol. We have seen in detail how these emissions have evolved in every country, distinguishing between the ones that had an improvement and the ones that didn't. The reduction on GHG that the EU has achieved can seem like a tiny contribution to the global situation, but we think that the the essential take away message from our data exploration is that **we have been able to set and achieve goals towards a less emitting region**, and that can be seen as a **precedent for future similar purposes**. With that being said, the reduction on emissions that the EU has achieved is due to a lot of external factors. So that we could see a more detailed view on this subject, and to be able to obtain a precise conclusion, we would need to **search through more data**. We could have a look at the economic recession of 2008, at the tendency to have warmer winters (thus contributing to a lower fuel use for heating), at the increasing use of renewable energies, etc. 38:T417,class Mesh { constructor( width, height, nAgents, joinDist, color, size, boundaries, velocity, opacity, ) { this.agents = []; this.joinDist = joinDist; this.color = color; this.size = size; for (let i = 0; i < sizesArray.length; i++) { if(i == selectedCountry) continue; const x = util.random.range(0, width); const y = util.random.range(0, height); this.agents.push( new Agent(x, y, this.color, radiusScale(sizesArray[i]) * diffFromBaseYear, boundaries, velocity, opacity) ); } this.agents.push( new Agent(util.random.range(0, width),util.random.range(0, height), getBubbleColor, radiusScale(sizesArray[selectedCountry]) * diffFromBaseYear, boundaries, velocity, 1, true) ); } update(context, width, height) { this.agents.forEach((agent) => { agent.update(); agent.draw(context); agent.wrap(width, height); }); } }39:T735,class Agent { constructor(x, y, color, size, boundaries, velocity, opacity, selected = false) { this.pos = new Vector(x, y); this.vel = new Vector( util.random.range(-1, 1) * velocity, util.random.range(-1, 1) * velocity ); this.size = size; this.boundaries = boundaries; this.radius = this.size > 0 ? Math.abs(this.size) : 1; this.color = color; this.opacity = opacity; this.selected = selected; } bounce(width, height) { if (this.pos.x <= 0 || this.pos.x >= width) this.vel.x *= -1; if (this.pos.y <= 0 || this.pos.y >= height) this.vel.y *= -1; } wrap(width, height) { if (this.pos.x + this.radius <= this.boundaries[0]) this.pos.x = this.boundaries[2] + this.radius -2; else if (this.pos.x >= this.boundaries[2] + this.radius) this.pos.x = this.boundaries[0] - this.radius + 2; if (this.pos.y + this.radius <= this.boundaries[1]) this.pos.y = this.boundaries[3] + this.radius -2; else if (this.pos.y >= this.boundaries[3] + this.radius) this.pos.y = this.boundaries[1] - this.radius + 2; } update() { this.pos.x += this.vel.x; this.pos.y += this.vel.y; } draw(context) { context.save(); context.translate(this.pos.x, this.pos.y); context.lineWidth = 4 * this.size; context.beginPath(); context.globalAlpha = this.opacity; context.strokeStyle = this.color; context.arc(0, 0, this.radius, 0, Math.PI * 2); context.fillStyle = this.color; context.fill(); if (this.size < 10 && this.selected) { context.beginPath(); context.strokeStyle = "red"; context.lineWidth = 1; context.arc(0, 0, 60, 0, Math.PI * 2); context.stroke(); } context.restore(); } }3a:T4a3,enhancedSortedEmissionsByCountry = { const dataCountries = new Map(); var countryIdx = 0; sortedEmissionsByCountry.forEach((countryData, key, map) => { const dataYears = []; countryData.forEach((yearData, index) => { const ghgPercentageDecrease = index == 0 ? 0 : Math.round( (percentageDecrease( map.get(key)[index - 1].total_ghg, yearData.total_ghg ) + Number.EPSILON) * 100 ) / 100; dataYears.push({ index, country_idx: countryIdx, //isoCodes.indexOf(yearData.iso_code) iso_code: yearData.iso_code, year: yearData.year, total_ghg: yearData.total_ghg, // Emissions de ghg totals difference_from_base: yearData.diff_from_base, // Diferència amb l'any 1990 yearly_change: ghgPercentageDecrease, // Diferència amb l'any anterior ghg_increased: ghgPercentageDecrease >= 0 ? false : true, ghg_per_capita: parseFloat(yearData.ghg_per_capita) }); }); dataYears.push() dataCountries.set(key, dataYears); countryIdx += 1; }); return dataCountries; }3b:T40b,function calculateAnnualPercentageChange(dataArray) { const resultArray = []; const emission_1990 = dataArray.filter(d => d.year === 1990).map(item => item.total_ghg); for (let i = 1; i < dataArray.length; i++) { const currentYear = dataArray[i].year; const previousYear = dataArray[i - 1].year; const currentEmissions = dataArray[i].total_ghg; const previousEmissions = dataArray[i - 1].total_ghg; const country = dataArray[i].country; const index_development = (currentEmissions/emission_1990)*100; const change_from_1990 = (currentEmissions-emission_1990); const percentageChange = ((currentEmissions - previousEmissions) / previousEmissions) * 100; // Add the result to the new array resultArray.push({ year: currentYear, country: country, total_ghg: currentEmissions, annualPercentageChange: percentageChange, index_development: index_development, change_from_1990: change_from_1990 }); } return resultArray.filter(d => d.year >= 1989) }3c:T510,function calcularPromedioGHG1(data) { const promedioPorPais = {}; data.forEach(entry => { if (!promedioPorPais[entry.Country]) { promedioPorPais[entry.Country] = { total_08_12: 0, count_08_12: 0, total_13_20: 0, count_13_20: 0, ghg1990: 0, }; } if (entry.year === 1990) { promedioPorPais[entry.Country].ghg1990 = entry.ghg; } else if (entry.year >= 2008 && entry.year <= 2012) { promedioPorPais[entry.Country].total_08_12 += entry.ghg; promedioPorPais[entry.Country].count_08_12 += 1; } else if (entry.year >= 2013 && entry.year <= 2020) { promedioPorPais[entry.Country].total_13_20 += entry.ghg; promedioPorPais[entry.Country].count_13_20 += 1; } }); const resultados = Object.keys(promedioPorPais).map(pais => { const { total_08_12, count_08_12, total_13_20, count_13_20, ghg1990 } = promedioPorPais[pais]; const ghgPromedio_08_12 = count_08_12 > 0 ? total_08_12 / count_08_12 : 0; const ghgPromedio_13_20 = count_13_20 > 0 ? total_13_20 / count_13_20 : 0; return { Country: pais, ghg1990: ghg1990, ghgPromedio_08_12: ghgPromedio_08_12.toFixed(2), ghgPromedio_13_20: ghgPromedio_13_20.toFixed(2), }; }); return resultados; }3d:T478,function ramp(name) { let canvas; let colors; let dark; if (d3[`scheme${name}`] && d3[`scheme${name}`][n]) { colors = d3[`scheme${name}`][n]; dark = d3.lab(colors[0]).l < 50; } else { const interpolate = d3[`interpolate${name}`]; colors = []; dark = d3.lab(interpolate(0)).l < 50; for (let i = 0; i < n; ++i) { colors.push(d3.rgb(interpolate(i / (n - 1))).hex()); } } if (n < 128) { canvas = htl.svg`

${[AreaChart_1(),AreaChart_2()]}

`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1021,"value":"$30","pinned":false,"hidden":false,"mode":"md"},{"id":1047,"value":"md`Performance of EU countries against the GHG reduction of the Kyoto Protocol **(Commitment Period ${option})**`","pinned":false,"hidden":false,"mode":"ojs"},{"id":807,"value":"viewof option = Inputs.radio([\"2008 - 2012\",\"2013 - 2020\"], {label: \"Select Commitment Period\", value: \"2008 - 2012\"})","pinned":false,"hidden":false,"mode":"ojs"},{"id":819,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"},{"id":494,"value":"$32","pinned":false,"hidden":false,"mode":"md"},{"id":508,"value":"viewof selectedYear = Inputs.range([1990, 2020], {value: 1990, label: \"Year\", step: 1})","pinned":false,"hidden":false,"mode":"ojs"},{"id":513,"value":"viewof selectedCountryName = Inputs.select(ue_countries_BP, {label: \"Select country\"})","pinned":false,"hidden":false,"mode":"ojs"},{"id":527,"value":"viewof playButton = html``","pinned":false,"hidden":false,"mode":"ojs"},{"id":1453,"value":"Legend(bubbleColorScale, {\n title: \"Emission increase from 1990 (%)\",\n})\n//RdYlGn","pinned":false,"hidden":false,"mode":"ojs"},{"id":530,"value":"$33","pinned":false,"hidden":false,"mode":"ojs"},{"id":185,"value":"$34","pinned":false,"hidden":false,"mode":"md"},{"id":392,"value":"viewof heatmapMode = Inputs.select([\"Ghg per capita\", \"Change from 1990\"], {label: \"Data\"})","pinned":false,"hidden":false,"mode":"ojs"},{"id":466,"value":"viewof dataMode = Inputs.select([\"Normalize\", \"Normal\"], {label: \"Mode\"})","pinned":false,"hidden":false,"mode":"ojs"},{"id":470,"value":"$35","pinned":false,"hidden":false,"mode":"ojs"},{"id":473,"value":"$36","pinned":false,"hidden":false,"mode":"ojs"},{"id":944,"value":"---\n### Data exploration: How have the emissions, annual percentage change and index development changed since 1990 for each country?\n\nThis composition serves as a valuable tool for the individualized analysis of countries, offering insights into greenhouse gas emissions over time, annual percentage changes. The exploration enables us to extract significant information on each nation's environmental trajectory.\n\nParticularly significant is the final visualization, which facilitates a comparative assessment of emissions changes since 1990. This feature allows us to analyse whether European Union countries participating in the Kyoto Agreement have successfully reduced their emissions and met the stipulated targets for both commitment periods. The visual representation provides a clear mean of evaluating collective progress in reducing GHG emissions in respect to 1990.","pinned":false,"hidden":false,"mode":"md"},{"id":836,"value":"viewof select_contry = Inputs.select(ue_countries, {label: \"Select one country\"})","pinned":false,"hidden":false,"mode":"ojs"},{"id":930,"value":"miniPlots = html`\n\n

${[barChart_1()]}

\n ${[barChart_2(), barChart_4()]}\n

`\n","pinned":false,"hidden":false,"mode":"ojs"},{"id":21,"value":"$37","pinned":false,"hidden":false,"mode":"md"},{"id":209,"value":"---\n## Addendum: data, libraries, other ...","pinned":false,"hidden":false,"mode":"md"},{"id":1274,"value":"---\n**Data for other factors plot**","pinned":false,"hidden":false,"mode":"md"},{"id":1276,"value":"europe_renewable_share_sheet = FileAttachment(\"EuropeShare.xlsx\").xlsx()","pinned":false,"hidden":false,"mode":"ojs"},{"id":1280,"value":"europe_renewable_share = europe_renewable_share_sheet.sheet(0, { headers: true })","pinned":false,"hidden":false,"mode":"ojs"},{"id":1306,"value":"eu_ren_sh_filtered = europe_renewable_share.filter(d => d.Year >= 2005);","pinned":false,"hidden":false,"mode":"ojs"},{"id":1299,"value":"europe_renewable_improv = {\n const dataZ = [];\n const baseValue = eu_ren_sh_filtered.filter(d => d.Year == 2005)[0].Share;\n eu_ren_sh_filtered.forEach((d, i) => {\n dataZ.push({\n year: d.Year,\n growth: - percentageDecrease(d.Share, baseValue)\n })\n })\n return dataZ;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1284,"value":"eu_gdp_cap_sheet = FileAttachment(\"european-union-gdp-per-capita_2@1.xlsx\").xlsx()","pinned":false,"hidden":false,"mode":"ojs"},{"id":1289,"value":"eu_gdp_cap = eu_gdp_cap_sheet.sheet(0, { headers: true })","pinned":false,"hidden":false,"mode":"ojs"},{"id":1319,"value":"eu_gdp_cap_ext = {\n const dataZ = [];\n eu_gdp_cap.forEach((d, i) => {\n const date = new Date(d.date);\n dataZ.push({\n year: date.toLocaleString(undefined, {year: \"numeric\"}),\n growth: d.Growth\n })\n })\n return dataZ;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":502,"value":"---\n#### Data for bubble Plot","pinned":false,"hidden":false,"mode":"md"},{"id":659,"value":"ue_countries_BP = countries_csv.filter(d => d.UE === \"Yes\" && d.country != \"Romania\" && d.country != \"Finland\" && d.country != \"European Union (27)\").map(d => {return d.country})","pinned":false,"hidden":false,"mode":"ojs"},{"id":574,"value":"emissions_BP = emissions_raw\n .map((d) => {\n d.year = parseInt(d.year);\n d.total_ghg = parseFloat(d.total_ghg);\n return d;\n })\n .filter(\n (d) =>\n d.year >= 1990 &&\n (ue_countries_BP.indexOf(d.country) !== -1 || d.country == 'European Union (27)') && d.country != 'Romania' && d.country != 'Finland' &&\n !isNaN(d.total_ghg)\n);","pinned":false,"hidden":false,"mode":"ojs"},{"id":1006,"value":"emissions_BP_No_EU = emissions_BP.filter(d => d.country != 'European Union (27)');","pinned":false,"hidden":false,"mode":"ojs"},{"id":996,"value":"emissions_ext_BP.filter(d => d.country == 'Spain')[0].diff_from_base","pinned":false,"hidden":false,"mode":"ojs"},{"id":578,"value":"emissions_ext_BP = {\n const dataZ = [];\n emissions_BP_No_EU.forEach((d, i) => {\n if(d.country == 'Spain') {\n debugger;\n }\n const baseYearGhg = emissions_BP_No_EU.find((d) => d.country == emissions_BP_No_EU[i].country && d.year == 1990).total_ghg;\n dataZ.push(\n {\n country: d.country,\n year: d.year,\n total_ghg: d.total_ghg,\n diff_from_base: Math.round(((percentageDecrease(baseYearGhg, d.total_ghg)) + Number.EPSILON) * 100) / 100\n }\n )\n });\n \n return dataZ;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":504,"value":"BP_sortedEmissionsByCountry = d3.group(emissions_ext_BP, d => d.country)","pinned":false,"hidden":false,"mode":"ojs"},{"id":1191,"value":"currentYearGhg = d3.sum(emissions_ext_BP.filter(d => d.year == selectedYear), function(d) {\n return d.total_ghg;\n });","pinned":false,"hidden":false,"mode":"ojs"},{"id":1221,"value":"diffFromBaseYear = {\n const baseYearGhg = d3.sum(emissions_ext_BP.filter(d => d.year == 1990), function(d) {\n return d.total_ghg;\n });\n const percentage = (currentYearGhg / baseYearGhg)\n return percentage;\n}\n","pinned":false,"hidden":false,"mode":"ojs"},{"id":506,"value":"sizesArray = {\n // debugger\n const sizes = [];\n const yearData = emissions_ext_BP.filter(d => d.year == selectedYear);\n const totalGhg = d3.sum(yearData, function(d) {\n return d.total_ghg;\n });\n console.log(totalGhg);\n yearData.forEach((d, i) => {\n console.log(d.total_ghg);\n const percentage = (d.total_ghg / totalGhg) * 100;\n sizes.push((percentage / 100) * totalGhg); // x % of y : Divide x by 100. Multiply the previous result by y\n }) \n \n return sizes;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":511,"value":"yearCountryEmissions = emissions_ext.filter(d => d.country == selectedCountryName && d.year == selectedYear)[0].total_ghg","pinned":false,"hidden":false,"mode":"ojs"},{"id":970,"value":"bubbleColorScale = {\n debugger\n const country_emissions = emissions_ext_BP.filter(d => d.country == selectedCountryName).sort();\n const maxVal = d3.max(country_emissions, (d) => d.diff_from_base);\n const minVal = d3.min(country_emissions, (d) => d.diff_from_base);\n const absMaxValue = Math.max(Math.abs(minVal), Math.abs(maxVal));\n \n return d3.scaleDiverging()\n .domain([absMaxValue, 0, -absMaxValue])\n .interpolator(d3.interpolateRdYlGn)\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":1540,"value":"countryPartForYear = {\n const year_emissions = emissions_ext_BP.filter(d => d.year == selectedYear).sort();\n const sumVal = d3.sum(year_emissions, (d) => d.total_ghg);\n const countryPart = (year_emissions.filter(d => d.country == selectedCountryName)[0].total_ghg) / sumVal * 100\n\n return countryPart.toFixed(2);\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":1456,"value":"getBubbleColor = {\n return bubbleColorScale(emissions_ext_BP.filter(d => d.country == selectedCountryName && d.year == selectedYear)[0].diff_from_base)\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":519,"value":"selectedCountry = ue_countries_BP.indexOf(selectedCountryName)","pinned":false,"hidden":false,"mode":"ojs"},{"id":535,"value":"BP_height = Math.round(width / 2)","pinned":false,"hidden":false,"mode":"ojs"},{"id":533,"value":"BP_Params = {\n const vars = {\n nMeshes: 2,\n meshSizes: [6, 2, 1],\n meshNAgents: [Math.round(15 * 0.3), Math.round(20 * 0.3), Math.round(19 * 0.3)],\n meshVelocity: [2, 2, 0.5],\n meshOpacity: [0.9, 0.07, 1],\n meshColors: [\"#555555\", \"#998E8E\", \"#222222\"],\n backgroundColor: \"#ffffff\",\n offset: 0,\n boundaries: [0, 0, width, BP_height],\n meshes: [],\n }\n return vars\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":541,"value":"meshes = {\n const meshArray = [];\n \n for (let i = 0; i < BP_Params.nMeshes; i++) {\n if(i == 0) {\n const mesh = new Mesh(\n width,\n BP_height,\n BP_Params.meshNAgents[i],\n 100,\n BP_Params.meshColors[i],\n BP_Params.meshSizes[i],\n BP_Params.boundaries,\n BP_Params.meshVelocity[i],\n BP_Params.meshOpacity[i],\n );\n meshArray.push(mesh);\n }\n else {\n const mesh = new Mesh2(\n width,\n BP_height,\n BP_Params.meshNAgents[i],\n 100,\n BP_Params.meshColors[i],\n BP_Params.meshSizes[i],\n BP_Params.boundaries,\n BP_Params.meshVelocity[i],\n BP_Params.meshOpacity[i],\n );\n meshArray.push(mesh);\n }\n }\n return meshArray;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":545,"value":"$38","pinned":false,"hidden":false,"mode":"ojs"},{"id":1183,"value":"sizesArray","pinned":false,"hidden":false,"mode":"ojs"},{"id":1251,"value":"radiusArray = {\n const radius = [];\n for (let i = 0; i < sizesArray.length; i++) {\n radius.push(radiusScale(sizesArray[i]) * diffFromBaseYear);\n }\n return radius\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1181,"value":"d3.max(sizesArray)","pinned":false,"hidden":false,"mode":"ojs"},{"id":1168,"value":"radiusScale = d3.scaleSqrt().domain([d3.min(sizesArray),d3.max(sizesArray)]).range([1, 200]);","pinned":false,"hidden":false,"mode":"ojs"},{"id":1178,"value":"radiusScale(20)","pinned":false,"hidden":false,"mode":"ojs"},{"id":570,"value":"class Mesh2 {\n constructor(\n width,\n height,\n nAgents,\n joinDist,\n color,\n size,\n boundaries,\n velocity,\n opacity\n ) {\n this.agents = [];\n this.joinDist = joinDist;\n this.color = color;\n this.size = size;\n for (let i = 0; i < nAgents; i++) {\n const x = util.random.range(0, width);\n const y = util.random.range(0, height);\n \n this.agents.push(\n new Agent(x, y, this.color, this.size, boundaries, velocity, opacity)\n );\n }\n }\n \n update(context, width, height) {\n this.agents.forEach((agent) => {\n agent.update();\n agent.draw(context);\n agent.wrap(width, height);\n });\n }\n }","pinned":false,"hidden":false,"mode":"ojs"},{"id":547,"value":"$39","pinned":false,"hidden":false,"mode":"ojs"},{"id":551,"value":"class Vector {\n constructor(x, y) {\n this.x = x;\n this.y = y;\n }\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":562,"value":"playing = {\n playButton;\n return !this;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":339,"value":"---\n#### Data for interactive Heatmap + Line plot","pinned":false,"hidden":false,"mode":"md"},{"id":351,"value":"- Array dels noms de país","pinned":false,"hidden":false,"mode":"md"},{"id":273,"value":"ue_countries = countries_csv.filter(d => d.UE === \"Yes\" && d.country != \"European Union (27)\").map(d => {return d.country})","pinned":false,"hidden":false,"mode":"ojs"},{"id":353,"value":"- Dataset inicial filtrat per any > 1990","pinned":false,"hidden":false,"mode":"md"},{"id":355,"value":"emissions = emissions_raw\n .map((d) => {\n d.year = parseInt(d.year);\n d.total_ghg = parseFloat(d.total_ghg);\n return d;\n })\n .filter(\n (d) =>\n d.year >= 1990 &&\n (ue_countries.indexOf(d.country) !== -1 || d.country == 'European Union (27)') && d.country != 'Romania' && d.country != 'Finland' &&\n !isNaN(d.total_ghg)\n);","pinned":false,"hidden":false,"mode":"ojs"},{"id":362,"value":"- Afegir diferència amb l'any 1990 a cada registre","pinned":false,"hidden":false,"mode":"md"},{"id":364,"value":"emissions_ext = {\n const dataZ = [];\n emissions.forEach((d, i) => {\n const baseYearGhg = emissions.find((d) => d.country == emissions[i].country && d.year == 1990).total_ghg;\n dataZ.push(\n {\n ...d,\n diff_from_base: Math.round(((percentageDecrease(baseYearGhg, d.total_ghg)) + Number.EPSILON) * 100) / 100\n }\n )\n });\n \n return dataZ;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":376,"value":"- Dades només per EU 27","pinned":false,"hidden":false,"mode":"md"},{"id":372,"value":"eu_27_data = emissions_ext\n.filter(d => d.country == 'European Union (27)')\n.map(function(d) {\n d.ghg_per_capita = parseFloat(d.ghg_per_capita);\n return d;\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":379,"value":"- **Ordenar** codis de països segons el tipus de dades sel·leccionades","pinned":false,"hidden":false,"mode":"md"},{"id":381,"value":"sortedCountryCodes = d3\n .flatRollup(\n emissions_ext,\n (v) => d3.sum(v, (d) => d[heatmapChosenData]),\n (d) => d.iso_code)\n .map(([iso_code, chosen_data]) => ({\n iso_code,\n chosen_data,\n }))\n .sort(function(a, b) {\n if(heatmapChosenData == 'ghg_per_capita') {\n if(a.chosen_data > b.chosen_data) return -1;\n else return 1;\n }\n else {\n if(a.chosen_data < b.chosen_data) return -1;\n else return 1;\n } \n }).reduce(function(r, e, id) {\n r[e.iso_code] = id;\n return r;\n}, {});","pinned":false,"hidden":false,"mode":"ojs"},{"id":401,"value":"- Re formatar els codis","pinned":false,"hidden":false,"mode":"md"},{"id":403,"value":"isoCodes = {\n const codes = Object.keys(sortedCountryCodes)\n return codes.filter((str) => str !== '');\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":406,"value":"- Ordenar el dataset segons l'ordre amb el que estan els codis","pinned":false,"hidden":false,"mode":"md"},{"id":408,"value":"sortedEmissions = {\n return emissions_ext.filter(d => d.country != 'European Union (27)')\n .sort(function(a, b) {\n if(sortedCountryCodes[a.iso_code] < sortedCountryCodes[b.iso_code]) {\n return -1;\n }\n else if(sortedCountryCodes[a.iso_code] == sortedCountryCodes[b.iso_code]) {\n return a.year - b.year\n }\n else return 1;\n });\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":411,"value":"- Agrupar per país","pinned":false,"hidden":false,"mode":"md"},{"id":413,"value":"sortedEmissionsByCountry = d3.group(sortedEmissions, d => d.country)","pinned":false,"hidden":false,"mode":"ojs"},{"id":416,"value":"- Afegir dades i formatar","pinned":false,"hidden":false,"mode":"md"},{"id":418,"value":"$3a","pinned":false,"hidden":false,"mode":"ojs"},{"id":421,"value":"- Muntar estructura de valors per accedir-hi des del plot","pinned":false,"hidden":false,"mode":"md"},{"id":423,"value":"heatMapValuesStruct = {\n const struct = [];\n enhancedSortedEmissionsByCountry.forEach((countryData, key, map) => {\n // year, i, improvementValue, diffValue, ghg\n const countryArray = [];\n countryData.forEach((yearData, index) => {\n countryArray.push({\n year: yearData.year,\n yearly_change: yearData.yearly_change,\n diff_from_base: yearData.difference_from_base,\n total_ghg: yearData.total_ghg,\n ghg_per_capita: yearData.ghg_per_capita\n })\n })\n struct.push(countryArray);\n });\n\n return struct;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":426,"value":"- Estructura de índex per a poder accedir als valors","pinned":false,"hidden":false,"mode":"md"},{"id":428,"value":"indexingStruct = {\n const struct = [];\n for (let i = 0; i < heatMapValuesStruct.length; ++i) {\n const countryArray = [];\n for (let j = 0; j < heatMapValuesStruct[0].length; ++j) {\n countryArray.push(('0' + i).slice(-2) + ('0' + j).slice(-2));\n }\n struct.push(countryArray);\n }\n return struct;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":431,"value":"- Últim format de dades pel plot","pinned":false,"hidden":false,"mode":"md"},{"id":433,"value":"plotData = {\n const names = isoCodes;\n const values = indexingStruct;\n const year0 = d3.min(heatMapValuesStruct[0], (d) => d.year);\n const year1 = d3.max(heatMapValuesStruct[0], (d) => d.year);\n const years = d3.range(year0, year1 + 1);\n return {\n values,\n names,\n years,\n year: 2008,\n };\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":452,"value":"ungroupedHeatmapValuesStruct = {\n const dataZ = [];\n heatMapValuesStruct.forEach((countryData, countryIdx) => {\n countryData.forEach((yearData, yearIdx) => {\n dataZ.push({\n country: countryIdx,\n year: parseInt(yearData.year),\n yearly_change: yearData.yearly_change,\n diff_from_base: yearData.diff_from_base,\n total_ghg: yearData.total_ghg,\n ghg_per_capita: yearData.ghg_per_capita\n })\n })\n });\n return dataZ;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":829,"value":"#### Data for country selector","pinned":false,"hidden":false,"mode":"md"},{"id":834,"value":"emissions_ue_single_country = {\nconst emissions_1990 = emissions_raw.filter(item => select_contry.includes(item.country)).map(item => item.total_ghg)\n\nconst filtered_emissions = emissions_raw\n .filter(item => select_contry.includes(item.country))\n .map(item => ({\n ...item,\n year:parseInt(item.year),\n co2: parseFloat(item.co2), // Convert 'co2' to decimal\n total_ghg: parseFloat(item.total_ghg)\n \n}));\n\nreturn filtered_emissions\n \n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":839,"value":"$3b","pinned":false,"hidden":false,"mode":"ojs"},{"id":842,"value":"emissions_ue_single_country_percentage = calculateAnnualPercentageChange(emissions_ue_single_country)","pinned":false,"hidden":false,"mode":"ojs"},{"id":846,"value":"#### Charts for country exploration","pinned":false,"hidden":false,"mode":"md"},{"id":848,"value":"barChart_1 = () => {\nreturn Plot.plot({\n title: \"GHG Emissions\",\n width: 1200,\n height: 300,\n color: { scheme: \"PuRd\", legend: true, label: \"Million tonnes of CO2-equivalents\"},\n marks: [\n Plot.barY(\n emissions_ue_single_country_percentage.filter(d => d.year >= 1990),\n Plot.groupX({ y: \"sum\" }, { x: \"year\", y: \"total_ghg\", tip: true, fill:\"total_ghg\" })\n ),\n Plot.ruleY([0]),\n // Configure x-axis ticks\n Plot.axisX({anchor: \"bottom\", ticks: [1990,2000,2010,2020]}),\n Plot.axisY({ anchor: \"left\", label: \"ghg\" })\n ],\n\n});\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":900,"value":"barChart_2 = () => {\nreturn Plot.plot({\n title: \"Annual percentage change emissions\",\n color: { scheme: \"RdYlGn\", reverse: true, legend: true, label: 'Annual percentage change'},\n marks: [\n Plot.barY(\n emissions_ue_single_country_percentage.filter(d => d.year >= 1990),\n Plot.groupX({ y: \"sum\" }, { x: \"year\", y: \"annualPercentageChange\", tip: true, fill:\"annualPercentageChange\" })\n ),\n Plot.ruleY([0]),\n // Configure x-axis ticks\n Plot.axisX({anchor: \"bottom\", ticks: [1990,2000,2010,2020]}),\n Plot.axisY({ anchor: \"left\", label: \"% Var\" })\n ],\n\n});\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":902,"value":"barChart_3 = () => {\nreturn Plot.plot({\n color: { scheme: \"PuRd\"},\n title: \"Index development in emissions\",\n marks: [\n Plot.barY(\n emissions_ue_single_country_percentage.filter(d => d.year >= 1990),\n Plot.groupX({ y: \"sum\" }, { x: \"year\", y: \"index_development\", tip: true, fill:\"index_development\" })\n ),\n Plot.ruleY([0]),\n // Configure x-axis ticks\n Plot.axisX({anchor: \"bottom\", ticks: [1990,2000,2010,2020]}),\n Plot.axisY({ anchor: \"left\", label: \"index development\" })\n ],\n\n});\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":904,"value":"barChart_4 = () => {\nreturn Plot.plot({\n color: { scheme: \"RdYlGn\", reverse: true, label: 'Change in GHG emissions from 1990 (%)', legend: true},\n title: \"Change since 1990 in emissions\",\n marks: [\n Plot.barY(\n emissions_ue_single_country_percentage.filter(d => d.year >= 1990),\n Plot.groupX({ y: \"sum\" }, { x: \"year\", y: \"change_from_1990\", tip: true, fill:\"change_from_1990\" })\n ),\n Plot.ruleY([0]),\n // Configure x-axis ticks\n Plot.axisX({anchor: \"bottom\", ticks: [1990,2000,2010,2020]}),\n Plot.axisY({ anchor: \"left\", label: \"% Var\" })\n ],\n});\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1074,"value":"#### Data for area chart","pinned":false,"hidden":false,"mode":"md"},{"id":1076,"value":"emissions_ue_world = {\nconst countries = countries_csv\nconst countries_ue = countries.filter(country => (country.UE === 'Yes')&&(country.country != 'European Union (27)')).map(item => item.country)\ncountries_ue.push('World')\ncountries_ue.push('Asia')\ncountries_ue.push('Africa')\ncountries_ue.push('North America'); \n\nconst filtered_emissions = emissions_raw\n .filter(item => countries_ue.includes(item.country))\n .map(item => ({\n ...item,\n co2: parseFloat(item.co2) // Convert 'co2' to decimal\n}));\n\nconst filtered_emissions2 = filtered_emissions\n .filter(d => d.year >= 1950)\n .filter(d => d.year <= 2000)\n\nreturn filtered_emissions2\n \n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1081,"value":"select * from\n(select t1.year,t2.co2 - t1.co2 as co2, t1.region,'Rest of the World' as country from \n(SELECT year,sum(co2) as co2,'Rest of the World'as region\n FROM \"emissions_ue_world\"\nwhere country <> 'World'\ngroup by year)t1\nleft join\n(SELECT year,sum(co2) as co2,'World'as region\n FROM \"emissions_ue_world\"\nwhere country = 'World'\ngroup by year)t2\non t1.year = t2.year\nunion all\nselect year, co2, case when country <> 'World' \n and country <> 'Asia' \n and country <> 'Africa'\n and country <> 'North America'\n then 'European Union'\n else country end as region, country\n FROM \"emissions_ue_world\"\nwhere country <> 'World');","pinned":false,"hidden":false,"mode":"sql","output":"emissions_ue_world_formatted","database":"var:emissions_ue_world"},{"id":1087,"value":"select t1.*, case when coalesce(t2.order_eu,0) <21 then '' else t1.country end as country_formatted,\n coalesce(t2.order_eu,0) as order_eu,t3.order_region from\n(select * from \"emissions_ue_world_formatted\")t1\nleft join\n(select country, row_number() over (order by sum(co2) asc) as order_eu from \"emissions_ue_world_formatted\"\n where region = 'European Union'\n group by country)t2\non t1.country = t2.country\nleft join\n(select region, row_number() over (order by sum(co2) asc) as order_region from \"emissions_ue_world_formatted\"\n group by region)t3\non t1.region = t3.region\norder by year asc,order_region desc,order_eu asc","pinned":false,"hidden":false,"mode":"sql","output":"emissions_ue_world_sorted","database":"var:emissions_ue_world_formatted"},{"id":1091,"value":"select year,region,sum(co2) as co2,min(order_region) as order_region from emissions_ue_world_sorted\ngroup by year,region\norder by year asc,order_region asc","pinned":false,"hidden":false,"mode":"sql","output":"emissions_regions_groupped","database":"var:emissions_ue_world_sorted"},{"id":1095,"value":"#### Charts for area plot","pinned":false,"hidden":false,"mode":"md"},{"id":1097,"value":"AreaChart_1 = () => {\nreturn Plot.plot({\n title: \"CO2 Emissions between 1950 and 2000 \",\n color: { legend: false, scheme: \"PuRd\" , type: \"categorical\",className:\"Region\"},\n x: { type: \"linear\" },\n y: {},\n marks: [\n Plot.areaY(emissions_regions_groupped, \n {x: \"year\", y: \"co2\",z:\"region\" ,fill: \"order_region\",order:\"order_region\", \n tip: {format: {x:true,y:true,z:true,fill:false,order:false}}}),\n Plot.ruleY([0]),\n Plot.tip(\n [`EU 1990 Emissions`],\n {x: 1990, y: 4500}),\n Plot.text(\n emissions_regions_groupped,\n Plot.selectLast(\n Plot.stackY({filter: (d) => d.year < 1998,\n x: \"year\", y: \"co2\",z:\"region\" ,fill: \"order_region\",order:\"order_region\",\n text:\"region\",\n dx: -17,\n fill: \"#000\"\n }))\n )\n ]\n});\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1100,"value":"AreaChart_2 = () => {\n return Plot.plot({\n title: \"CO2 Emissions between 1950 and 2000 for countries in EU\",\n color: { legend: false, scheme: \"PuRd\" , type: \"categorical\",className:\"Region\"},\n x: { type: \"linear\" },\n y: {},\n marks: [\n Plot.areaY(emissions_ue_world_sorted.filter(d => d.region === 'European Union'), \n {x: \"year\", y: \"co2\",z:\"country\" ,fill: \"order_eu\",order:\"-order_eu\", \n tip: {format: {x:true,y:true,z:true,fill:false,stroke:false}}}),\n Plot.ruleY([0]),\n Plot.text(\n emissions_ue_world_sorted.filter(d => d.region === 'European Union'),\n Plot.selectLast(\n Plot.stackY({filter: (d) => (d.year < 1998),\n x: \"year\", y: \"co2\",z:\"country\" ,fill: \"order_eu\",order:\"-order_eu\", \n text:\"country_formatted\",\n dx: -17,\n fill: \"#FFF\"\n }))\n )\n ]\n \n})\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":475,"value":"selectedData = {\n const index = heatmapPlot;\n if(heatmapPlot != null) {\n const countryIdx = parseInt(index.slice(0, 2));\n const yearIdx = parseInt(index.slice(-2));\n return {\n selectedCountry: countryIdx,\n selectedYear: yearIdx\n }\n }\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":366,"value":"**Funcions**","pinned":false,"hidden":false,"mode":"md"},{"id":368,"value":"function percentageDecrease(initial, final) {\n return - ((initial - final) / initial) * 100\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":436,"value":"function getMinMaxValues(countryIdx) {\n var minVal = 0;\n var maxVal = 0;\n \n if (countryIdx === undefined) { // A nivell global\n maxVal = d3.max(heatMapValuesStruct, (d, i) => d3.max(heatMapValuesStruct[i], (d) => d[heatmapChosenData]));\n minVal = d3.min(heatMapValuesStruct, (d, i) => d3.min(heatMapValuesStruct[i], (d) => d[heatmapChosenData]));\n }\n else { // A nivell de país\n maxVal = d3.max(heatMapValuesStruct[countryIdx], (d) => d[heatmapChosenData]);\n minVal = d3.min(heatMapValuesStruct[countryIdx], (d) => d[heatmapChosenData]);\n }\n\n return {min: minVal, max: maxVal};\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":439,"value":"heatmapColorScale = (val) => {\n const value = accessHeatMapValue(val);\n const countryIdx = parseInt(val.slice(0, 2));\n const yearIdx = parseInt(val.slice(-2));\n var colorScale = null;\n const minMaxValues = dataMode == 'Normal' ? getMinMaxValues() : getMinMaxValues(countryIdx);\n const absMaxValue = Math.max(Math.abs(minMaxValues.min), Math.abs(minMaxValues.max));\n\n switch(heatmapMode) {\n case \"Change from 1990\": // Divergent\n var colorScale = d3.scaleDiverging()\n .domain([absMaxValue, 0, -absMaxValue])\n .interpolator(getColorScheme())\n break;\n case \"Total emissions\": // Seqüencial\n var colorScale = d3.scaleSequential(getColorScheme()).domain([minMaxValues.min, minMaxValues.max]);\n break;\n case \"Ghg per capita\": // Seqüencial\n var colorScale = d3.scaleSequential(getColorScheme()).domain([minMaxValues.min, minMaxValues.max]);\n break;\n } \n \n return colorScale(value);\n }","pinned":false,"hidden":false,"mode":"ojs"},{"id":441,"value":"function getColorScheme() {\n var colorScheme = null;\n switch(heatmapMode) {\n case \"Change from 1990\": // Divergent\n colorScheme = d3.interpolateRdYlGn;\n break;\n case \"Total emissions\": // Seqüencial\n colorScheme = d3.interpolateGreys;\n break;\n case \"Ghg per capita\": // Seqüencial\n colorScheme = d3.interpolatePuRd;\n break;\n }\n return colorScheme;\n}\n ","pinned":false,"hidden":false,"mode":"ojs"},{"id":455,"value":"function getColorSchemeLinePlot() {\n var colorScheme = null;\n switch(heatmapMode) {\n case \"Change from 1990\": // Divergent\n colorScheme = \"RdYlGn\";\n break;\n case \"Total emissions\": // Seqüencial\n colorScheme = \"Greys\";\n break;\n case \"Ghg per capita\": // Seqüencial\n colorScheme = \"PuRd\";\n break;\n }\n return colorScheme;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":444,"value":"function accessHeatMapValue(index) {\n const countryIdx = parseInt(index.slice(0, 2));\n const yearIdx = parseInt(index.slice(-2));\n\n return heatMapValuesStruct[countryIdx][yearIdx][heatmapChosenData];\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":448,"value":"function getOpacity(val, heatmapMode) {\n debugger\n const value = accessHeatMapValue(val);\n const countryIdx = parseInt(val.slice(0, 2));\n const yearIdx = parseInt(val.slice(-2));\n const minMaxValues = dataMode == 'Normal' ? getMinMaxValues() : getMinMaxValues(countryIdx);\n const maxValue = Math.max([Math.abs(minMaxValues.min), Math.abs(minMaxValues.max)]);\n \n switch(heatmapMode) {\n case \"Total emissions\": // Seqüencial\n var scale = d3.scaleLinear().domain([minMaxValues.min,minMaxValues.max]).range([0, 1]);\n break;\n default:\n var scale = d3.scaleLinear().domain([minMaxValues.min,minMaxValues.max]).range([1, 1]);\n } \n\n return scale(value); \n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":384,"value":"**Constants**","pinned":false,"hidden":false,"mode":"md"},{"id":386,"value":"heatmapChosenData = {\n switch(heatmapMode) {\n case \"Total emissions\":\n return \"total_ghg\";\n case \"Change from 1990\": // En %\n return \"diff_from_base\";\n case \"Ghg per capita\":\n return \"ghg_per_capita\";\n }\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":589,"value":"linePlotLabel = heatmapChosenData == \"ghg_per_capita\" ? \"Tonnes of CO2 equivalents per person\" : \"Change in GHG emissions from 1990 (%)\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":390,"value":"**Inputs**","pinned":false,"hidden":false,"mode":"md"},{"id":744,"value":"---\n#### Performance Countries","pinned":false,"hidden":false,"mode":"md"},{"id":1401,"value":"#### Datas","pinned":false,"hidden":false,"mode":"md"},{"id":1511,"value":"getCommitmentPeriodLabel = {\n return option == \"2008 - 2012\" ? \"First Period\" : \"Second Period\" \n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1515,"value":"getCommitmentPeriodAttribute = {\n return option == \"2008 - 2012\" ? \"percentage_08_12\" : \"percentage_13_20\" \n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":735,"value":"filteredResults_A = data1\n .filter(entry => entry.UE === 'Yes')","pinned":false,"hidden":false,"mode":"ojs"},{"id":1160,"value":"ue_countries_A = countries_csv.filter(d => d.UE === \"Yes\").map(d => {return d.country})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1141,"value":"emissions_1 = emissions_raw\n .map((d) => {\n d.year = parseInt(d.year);\n d.total_ghg = parseFloat(d.total_ghg);\n return d;\n })\n .filter(\n (d) =>\n d.year >= 1990 &&\n ue_countries_A.indexOf(d.country) !== -1 && d.country != 'Romania' && d.country != 'Finland' &&\n !isNaN(d.total_ghg)\n);","pinned":false,"hidden":false,"mode":"ojs"},{"id":1149,"value":"sortedCountryCodes_1 = d3\n .flatRollup(\n emissions_1,\n (v) => d3.sum(v, (d) => d.total_ghg),\n (d) => d.iso_code)\n .map(([iso_code, sumGhg]) => ({\n iso_code,\n sumGhg,\n })).sort(function(a, b) {\n if(a.sumGhg > b.sumGhg) return -1;\n else return 1;\n }).reduce(function(r, e, id) {\n r[e.iso_code] = id;\n return r;\n}, {});","pinned":false,"hidden":false,"mode":"ojs"},{"id":1137,"value":"sortedEmissions_1 = {\n return emissions_1.sort(function(a, b) {\n if(sortedCountryCodes_1[a.iso_code] < sortedCountryCodes_1[b.iso_code]) {\n return -1;\n }\n else if(sortedCountryCodes_1[a.iso_code] == sortedCountryCodes_1[b.iso_code]) {\n return a.year - b.year\n }\n else return 1;\n });\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1131,"value":"sortedEmissionsByCountry_1 = d3.group(sortedEmissions_1, d => d.country)","pinned":false,"hidden":false,"mode":"ojs"},{"id":787,"value":"entriesArray = Array.from(sortedEmissionsByCountry_1.entries())","pinned":false,"hidden":false,"mode":"ojs"},{"id":738,"value":"anos1= entriesArray.flatMap(([key, values]) => values.filter(entry => entry.year === 1990 || (entry.year >= 2008 && entry.year <= 2020)))","pinned":false,"hidden":false,"mode":"ojs"},{"id":799,"value":"Country_90_promedio1 = calcularPromedioGHG1(transformedData_all1)","pinned":false,"hidden":false,"mode":"ojs"},{"id":794,"value":"transformedData_all1 = anos1.map(entry => {\n return {\n Country: entry.country,\n year: entry.year,\n ghg: entry.total_ghg,\n }\n })","pinned":false,"hidden":false,"mode":"ojs"},{"id":804,"value":"Informacion_plot1= Country_90_promedio1.map(entry => {\n const { Country, ghg1990, ghgPromedio_08_12, ghgPromedio_13_20 } = entry;\n const porcentajeReduccion_08_12 = ghg1990 !== 0\n ? ((ghgPromedio_08_12 - ghg1990) / ghg1990) * 100\n : 0;\n const porcentajeReduccion_13_20 = ghg1990 !== 0\n ? ((ghgPromedio_13_20 - ghg1990) / ghg1990) * 100\n : 0;\n const matchingEntry = filteredResults_A.find(filteredEntry => filteredEntry.country === Country);\n\n const burdenSharingPercentage = matchingEntry ? matchingEntry['Burden_Sharing(%)'] : null;\n const burdenSharingPercentage_1 = matchingEntry ? matchingEntry['Goal_2020(%)'] : null;\n\n return {\n Country: Country,\n ghg_1990: ghg1990,\n ghgAverage_2008_2012: ghgPromedio_08_12,\n percentage_08_12: porcentajeReduccion_08_12.toFixed(2),\n ghgAverage_2013_2020: ghgPromedio_13_20,\n percentage_13_20: porcentajeReduccion_13_20.toFixed(2),\n 'Burden_Sharing(%)': burdenSharingPercentage,\n 'Goal_2020(%)': burdenSharingPercentage_1,\n };\n});","pinned":false,"hidden":false,"mode":"ojs"},{"id":1406,"value":"#### Functions","pinned":false,"hidden":false,"mode":"md"},{"id":797,"value":"$3c","pinned":false,"hidden":false,"mode":"ojs"},{"id":1408,"value":"#### Inputs","pinned":false,"hidden":false,"mode":"md"},{"id":809,"value":"x_b = option === \"2008 - 2012\" ? \"percentage_08_12\" : (option === \"2013 - 2020\" ? \"percentage_13_20\" : null)","pinned":false,"hidden":false,"mode":"ojs"},{"id":810,"value":"x_d = option === \"2008 - 2012\" ? \"Burden_Sharing(%)\" : (option === \"2013 - 2020\" ? \"Goal_2020(%)\" : null)","pinned":false,"hidden":false,"mode":"ojs"},{"id":813,"value":"Selec = option === \"2008 - 2012\" ? \"ghgAverage_2008_2012\" : (option === \"2013 - 2020\" ? \"ghgAverage_2013_2020\" : null)","pinned":false,"hidden":false,"mode":"ojs"},{"id":348,"value":"## Imports and Datasets","pinned":false,"hidden":false,"mode":"md"},{"id":19,"value":"import { toc } from \"@nebrius/indented-toc\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":731,"value":"import {select, slider} from \"@jashkenas/inputs\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":345,"value":"countries_csv = await FileAttachment(\"countries@2.csv\").csv({typed: \"auto\"})","pinned":false,"hidden":false,"mode":"ojs"},{"id":726,"value":"data1 = FileAttachment(\"countries@2.csv\").csv()","pinned":false,"hidden":false,"mode":"ojs"},{"id":359,"value":"emissions_raw = FileAttachment(\"owid-co2-data.csv\").csv()","pinned":false,"hidden":false,"mode":"ojs"},{"id":487,"value":"$3d","pinned":false,"hidden":false,"mode":"ojs"},{"id":490,"value":"viewof n = Inputs.select(new Map([\n [\"continuous\", 256],\n ...d3.range(11, 2, -1).map(n => [`discrete (${n})`, n])\n]), {label: \"Scheme size\"})","pinned":false,"hidden":false,"mode":"ojs"},{"id":549,"value":"util = import('https://cdn.skypack.dev/canvas-sketch-util@1.10.0?min')","pinned":false,"hidden":false,"mode":"ojs"},{"id":1450,"value":"import {Legend} from \"@d3/color-legend\"","pinned":true,"hidden":false,"mode":"ojs"}],"files":"$W3e","stdlib":"1","titling":"auto"}