2f:T4c3,**Links** - [Datos y visulaizaciones oficiales de emisión de gases para los estados participantes en la Climate Change Convention](https://unfccc.int/topics/mitigation/resources/registry-and-data/ghg-data-from-unfccc?gclid=CjwKCAiAnL-sBhBnEiwAJRGigiAKapCRCS3k7EC_XIZW2a50mVin4jdmtrRFlNkyzaNCC72w_ItwlBoCE38QAvD_BwE) - [Datos y muchos ejemplos de visualizaciones en tópicos parecidos](https://www.iea.org/data-and-statistics/) - [Bar chart resultados primer período](https://www.eea.europa.eu/data-and-maps/daviz/total-ghg-emissions-and-kyoto#tab-chart_3) - https://unfccc.int/news/kyoto-protocol-paves-the-way-for-greater-ambition-under-paris-agreement - https://www.europarl.europa.eu/RegData/etudes/BRIE/2021/696185/EPRS_BRI(2021)696185_EN.pdf (Single country analysis) - [Dataset oficial UNFCCC (Dataset 3)](https://www.eea.europa.eu/en/datahub/datahubitem-view/3b7fe76c-524a-439a-bfd2-a6e4046302a2) - [Visualitzador de les dades amb les que treballem](https://www.eea.europa.eu/data-and-maps/data/data-viewers/greenhouse-gases-viewer) - [Extreure datasets de les dades amb les que treballem (Dataset 2)](https://di.unfccc.int/time_series) - [Anàlisis d'un país](https://ourworldindata.org/co2/country/latvia)30:T8cf,- **Visualization 1**: Visualize the fact that the Kyoto Protocol recognized: 'developed countries are principally responsible for the high levels of GHG emissions in the atmosphere as a result of more than 150 years of industrial activity' (use this to compare the % of emissions on developed countries vs non developed countries, and visualize the past years on the countries that we are going to analyze ) - **Visualization 2 (2-3 plots)**: How have the emissions on Europe countries evolved after the appliance of the Kyoto Protocol? - First and second plot: The First plot will be a 'Interactive Heatmap'. Each row will be a Country, each column a year. The cell will have a red tone if the year has been worse than the year before. It will have a green tone on the contrary. Each cell will be clickable and will change the view on the second plot. - Second plot: Density line chart that changes when interacting. It will ahve two inputs: Year and Country. - Third plot (optional) : - Diverging 'bar plot' with circles instead of bars. Each circle will start at the middle point (0 on Y) and start fluctuating depending on if the emissions have lowered or not. The objective on emissions will also be represnted according to the document on 15 december 2010. The size of the circle will encode the percentage on emissions of each country during the time. - (Another option) : Encontramos en el pasado una reducción en las emisiones a nivel Europeo/Global del mismo nivel que el conseguido mediante el tratado de Kyoto? - **Volem poder tenir conclusions com:** 'Romania generates 3 % of the EU-27's total greenhouse gas (GHG) emissions and reduced emissions faster than the EU average between 2005 and 2019. With several energy-intensive industries present in Romania, the country's carbon intensity is much higher than the EU average, but decreasing rapidly.' - **Visualization 3**: Multiple detail visualizations to treat (some of) these questions: - Economic recession - Milder winters - Switch from coal to gas - Increase on use of renewable energies - Increase on number of sustainability policies - - **Visualization 4** : Interactive plot with multi-select to have freedom to search through the data. 31:T4d7,// Afegir ordre aquí si es vol ordenar el Heatmap 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; }32:T1a63,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("transform", `translate(0,${height - marginBottom + 4})`) .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") .text("First commitment period started") ) .call((g) => g.select(".domain").remove()) ); 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']"); console.log(rect) svg .on("pointerover", highlight) .on("pointerout", restore) .on("click", handleClick) .on("pointerdown", handlePointerDown) .on("pointerup", handlePointerUp) .style("cursor", "default"); const map = html`

Lorem Ipsum DESRIPTION.

Hover over the map to see state numbers. Click on a cell to focus; click on focused cell or empty space 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")); } }33:T81e,lineChart = Plot.plot({ marginRight: 35, width: 1200, height: 420, y: { grid: true, label: heatmapChosenData, }, x: { label: "Year", tickFormat: Plot.formatYear , }, color: { legend: true, label: "Improvement from 1990", scheme: getColorSchemeLinePlot(), reverse: true }, marks: [ Plot.ruleY([0], {strokeOpacity: 0.6}), Plot.ruleX([2008], {strokeOpacity: 0.6}), 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", 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.05, // 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.line(monthlyMeanRevenues, { // x: "date", // y: "meanRevenue", // stroke: "black", // }), Plot.text( eu_27_data, Plot.selectLast({ x: "year", y: heatmapChosenData, text: () => "EU27 mean", lineAnchor: "middle", fontSize: 14, fontWeight: "bold", dx: -40, dy: -10, }) ), ], });34:T68c,- **Tipo overview + detalles** - Visualización general de la evolución de cada país a partir del 1990. Tendria que ser interactivo para poder ver detalles concretos de la visualización (slider de tiempo?) **(plot 1)**. Acompañado de un plot que vaya acumulando los puntos conforme pasan los años **(plot 2)**. (Lo mismo que el pot 3 del tipo historia - Alternativa: Grid de plots que muestran la evolución de cada país + un área que muestre la rapidez con que llegaron a las emisiones acordadas. - Alternativa: tenim un cercle (buit) per a cada país. A mesura que passa el temps, emplenem els cercles en el moment en que un país arribi a les emissions acordades. Al final tenim uns quants cercles buits (o no). Si n’hi han, podem investigar aquests casos. Al clicar cada cercle, podem veure el gràfic d’emissions per aquest (mirar esquema abajo) - Alternativa: Mapa donde salgan los países que firmaron. El color codifica las emisiones totales. Un plot muestra los datos durante el primer período. Otro plot muestra los del segundo período. - **Alternativa**: Grid de puntos/cells. Las filas son los países y las columnas los años. El punto se pondrà de color rojo si el país aún no ha llegado a los valores acordados ese año (se pone un rojo más suave a medida que se acerque). El punto se pone verde cuando el país ha llegado al valor acordado. Éste podria ser una especie de 'heatmap' para poner en detalle qué países llegan a los valores acordados durante cada período (serian 2 heatmaps) y lo rápido que lo hacen). Al pulsar uno de los puntos/cells, un plot inferior muestra los datos de ese país por ese año. 35:[{"id":"9e051037ff9e3d7d1ed2ad8b2875be2edb2a356d915caf2ef591341321a973b8b62cf494feaf43a79b86cc5ee67f06b9480209307d9263ca4c5d85cf1cb4e0ac","href":"https://static.observableusercontent.com/files/9e051037ff9e3d7d1ed2ad8b2875be2edb2a356d915caf2ef591341321a973b8b62cf494feaf43a79b86cc5ee67f06b9480209307d9263ca4c5d85cf1cb4e0ac","name":"079 Trends and drivers-Ricardo TH-AL-20-011-EN-N.pdf","type":"application/pdf","lastModified":1704751034685.003,"size":9927474},{"id":"2c2591f88b37fd7019a88b3824ed9d66e5314350dcc407eae0270a46a1e90175e793549c7ab700aae5c09856639197ff01e7b919591c0d50b09238b78f81f065","href":"https://static.observableusercontent.com/files/2c2591f88b37fd7019a88b3824ed9d66e5314350dcc407eae0270a46a1e90175e793549c7ab700aae5c09856639197ff01e7b919591c0d50b09238b78f81f065","name":"UNFCCC_emissions.xlsx","type":"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet","lastModified":1704731748783.627,"size":39634},{"id":"10104ac18f1129a1bc055f69b6206b0150eb62e7d67ad3d6e2a911340c3d8901f30519d59b8d58b0c167ccd307703bf5aad265ff82dc4ba3df030f42dea9a1fc","href":"https://static.observableusercontent.com/files/10104ac18f1129a1bc055f69b6206b0150eb62e7d67ad3d6e2a911340c3d8901f30519d59b8d58b0c167ccd307703bf5aad265ff82dc4ba3df030f42dea9a1fc","name":"Time Series - GHG total with LULUCF, in kt CO₂ equivalent@4.xlsx","type":"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet","lastModified":1704731748783.627,"size":31581},{"id":"ba4a96dc7973db3c27d8b5a3ad2fbd389ae7c95fac682e53d08faa6c6459b37c7775aebd6aa0c7ffd2bc52aaa696250b5325112fe3162b301e029b0ca02fc237","href":"https://static.observableusercontent.com/files/ba4a96dc7973db3c27d8b5a3ad2fbd389ae7c95fac682e53d08faa6c6459b37c7775aebd6aa0c7ffd2bc52aaa696250b5325112fe3162b301e029b0ca02fc237","name":"image.png","type":"image/png","lastModified":1704731748783.627,"size":37807},{"id":"2d8da64dbc72f78c701bcd41ed20cb0a6ac3ce8a0ff1a3d59fe05a94a836a7d42d30b024e504d4383d0501da0797ea346452cb56f18a5fec44cdc48d74a2fce1","href":"https://static.observableusercontent.com/files/2d8da64dbc72f78c701bcd41ed20cb0a6ac3ce8a0ff1a3d59fe05a94a836a7d42d30b024e504d4383d0501da0797ea346452cb56f18a5fec44cdc48d74a2fce1","name":"g2324.png","type":"image/png","lastModified":1704731748783.627,"size":257971},{"id":"c84a90db19c1a63739b4b92badbdfcd49fffaa0b3d3c64a203efcd15ee703310565793e20a3c06675fa67224b288fcffc7295265c685cd56df5cec65e6dc4cf4","href":"https://static.observableusercontent.com/files/c84a90db19c1a63739b4b92badbdfcd49fffaa0b3d3c64a203efcd15ee703310565793e20a3c06675fa67224b288fcffc7295265c685cd56df5cec65e6dc4cf4","name":"Captura2.PNG","type":"image/png","lastModified":1704731748783.627,"size":134588},{"id":"8818a9c7b214afbfd9685f88a8115e463e1239fbfc8b740b02bf138eccbf709334482f726ddbeb5be891f6e6c711e119c6b3a9d89259f483b5ce9c3dcfe4afbe","href":"https://static.observableusercontent.com/files/8818a9c7b214afbfd9685f88a8115e463e1239fbfc8b740b02bf138eccbf709334482f726ddbeb5be891f6e6c711e119c6b3a9d89259f483b5ce9c3dcfe4afbe","name":"Captura3.PNG","type":"image/png","lastModified":1704731748783.627,"size":151521},{"id":"1a580b20888187ce218d3256dfc376ee1d73a671989491af4de005abdbbcaa8364d0d5d61427dbfcacb1052f7b1df95bd74671249f258e03a8d1857bc7fbcddb","href":"https://static.observableusercontent.com/files/1a580b20888187ce218d3256dfc376ee1d73a671989491af4de005abdbbcaa8364d0d5d61427dbfcacb1052f7b1df95bd74671249f258e03a8d1857bc7fbcddb","name":"owid-co2-data.csv","type":"text/csv","lastModified":1704731748783.627,"size":13516864},{"id":"351c087fe75394298ee15e59ab5e069712f1944a2c04ac775a912cf1cc509965e2681c4c1d31f728fe8b325ff2d57ce7403dc4343c15727a1ff3676d64237e9a","href":"https://static.observableusercontent.com/files/351c087fe75394298ee15e59ab5e069712f1944a2c04ac775a912cf1cc509965e2681c4c1d31f728fe8b325ff2d57ce7403dc4343c15727a1ff3676d64237e9a","name":"countries@1.csv","type":"text/csv","lastModified":1705084666810.614,"size":5672},{"id":"dbfe939a054516241b3289fc6d19c31db0edba2c9016bcd9ca8d236027786bdd81055e605eb3aa9a34137c3d40f34909cfeb80008c143d7388350a69f9653d50","href":"https://static.observableusercontent.com/files/dbfe939a054516241b3289fc6d19c31db0edba2c9016bcd9ca8d236027786bdd81055e605eb3aa9a34137c3d40f34909cfeb80008c143d7388350a69f9653d50","name":"image@2.png","type":"image/png","lastModified":1705271937975.316,"size":548037}] 2d:{"title":"Final exercise (pol)","cells":[{"id":0,"value":"# Final exercise (pol)","pinned":false,"hidden":false,"mode":"md"},{"id":100,"value":"Clara, Armando, Pol","pinned":false,"hidden":false,"mode":"md"},{"id":11,"value":"[Data codebook](https://github.com/owid/co2-data/blob/master/owid-co2-codebook.csv)","pinned":false,"hidden":false,"mode":"md"},{"id":400,"value":"**POSIBLES PREGUNTAS**\n\n- Han cumplido los países con los objetivos propuestos durante los dos períodos de commitment?\n- Encontramos en el pasado una reducción en las emisiones a nivel Europeo/Global del mismo nivel que el conseguido mediante el tratado de Kyoto?\n- Qué porcentage de emisiones nivel global representan los países que participaron en el tratado? (Son considerable a nivel global las mejoras en emision conseguidas?)","pinned":false,"hidden":false,"mode":"md"},{"id":405,"value":"$2f","pinned":false,"hidden":false,"mode":"md"},{"id":976,"value":"#### Facts\n- The EU and its Member States have met their international climate commitment under the UNFCCC to reduce GHG emissions by 20% compared to 1990 levels by 2020.","pinned":false,"hidden":false,"mode":"md"},{"id":419,"value":"## Intro\nThe Kyoto Protocol recognized that** developed countries are principally responsible for the high levels of GHG emissions in the atmosphere as a result of more than 150 years of industrial activity**\nMy analitical goal...","pinned":false,"hidden":false,"mode":"md"},{"id":421,"value":"---\n## Summary","pinned":false,"hidden":false,"mode":"md"},{"id":450,"value":"$30","pinned":false,"hidden":false,"mode":"md"},{"id":152,"value":"## VISUALIZATIONS","pinned":false,"hidden":false,"mode":"md"},{"id":149,"value":"## DATA TRANSFORMATIONS","pinned":false,"hidden":false,"mode":"md"},{"id":501,"value":"### Data transformations for heatmap","pinned":false,"hidden":false,"mode":"md"},{"id":1912,"value":"- Array dels noms de país","pinned":false,"hidden":false,"mode":"md"},{"id":547,"value":"ue_countries = countries_csv.filter(d => d.UE === \"Yes\").map(d => {return d.country})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1914,"value":"- Assignar dataset segons el que haguem sel·leccionat","pinned":false,"hidden":false,"mode":"md"},{"id":1144,"value":"emissionsDataset = {\n switch(emissionsHeatmapDatasetString) {\n case(\"emissions_raw\"): return emissions_raw;\n case(\"ghg_emissions_formatted\"): return ghg_emissions_formatted;\n case(\"unfccc_emissions_formatted\"): return unfccc_emissions_formatted;\n }\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1916,"value":"- Dataset inicial filtrat per any > 1990","pinned":false,"hidden":false,"mode":"md"},{"id":506,"value":"emissions = emissionsDataset\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":true,"hidden":false,"mode":"ojs"},{"id":1923,"value":"- Afegir diferència amb l'any 1990 a cada registre","pinned":false,"hidden":false,"mode":"md"},{"id":2321,"value":"emissions_ext.filter(d => d.country == 'Spain')[0].total_ghg","pinned":false,"hidden":false,"mode":"ojs"},{"id":1767,"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":true,"hidden":false,"mode":"ojs"},{"id":2028,"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":1926,"value":"- **Ordenar** codis de països segons el tipus de dades sel·leccionades","pinned":false,"hidden":false,"mode":"md"},{"id":1181,"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":1928,"value":"- Re formatar els codis","pinned":false,"hidden":false,"mode":"md"},{"id":694,"value":"isoCodes = {\n const codes = Object.keys(sortedCountryCodes)\n return codes.filter((str) => str !== '');\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1932,"value":"- Ordenar el dataset segons l'ordre amb el que estan els codis","pinned":false,"hidden":false,"mode":"md"},{"id":1247,"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":1935,"value":"- Agrupar per país","pinned":false,"hidden":false,"mode":"md"},{"id":49,"value":"sortedEmissionsByCountry = d3.group(sortedEmissions, d => d.country)","pinned":false,"hidden":false,"mode":"ojs"},{"id":1949,"value":"- Afegir dades i formatar","pinned":false,"hidden":false,"mode":"md"},{"id":470,"value":"$31","pinned":true,"hidden":false,"mode":"ojs"},{"id":1951,"value":"- Muntar estructura de valors per accedir-hi des del plot","pinned":false,"hidden":false,"mode":"md"},{"id":1389,"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":true,"hidden":false,"mode":"ojs"},{"id":1962,"value":"- Estructura de índex per a poder accedir als valors","pinned":false,"hidden":false,"mode":"md"},{"id":1419,"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":1967,"value":"- Últim format de dades pel plot","pinned":false,"hidden":false,"mode":"md"},{"id":1449,"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":1937,"value":"**Funcions**","pinned":false,"hidden":false,"mode":"md"},{"id":571,"value":"function percentageDecrease(initial, final) {\n return - ((initial - final) / initial) * 100\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":867,"value":"function normalizeArray(array) {\n //normalized = np.where(r>0,r/r.max(),np.where(r<0,-r/r.min(),r))\n let min = d3.min(array);\n let max = d3.max(array);\n\n if (heatmapMode === \"Total emissions\") {\n return array.map(d => (d - min) / (max - min));\n }\n else {\n return array.map(d => d > 0 ? d / max : d < 0 ? -d / min : d)\n }\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1493,"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":true,"hidden":false,"mode":"ojs"},{"id":1382,"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":1691,"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":1430,"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":1981,"value":"**Constants**","pinned":false,"hidden":false,"mode":"md"},{"id":1366,"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":1906,"value":"---\n**Dades pel Line plot**","pinned":false,"hidden":false,"mode":"md"},{"id":1826,"value":"ungroupedHeatmapValuesStruct = {\n const dataZ = [];\n heatMapValuesStruct.forEach((countryData, countryIdx) => {\n countryData.forEach((yearData, yearIdx) => {\n dataZ.push({\n country: countryIdx,\n year: 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":1991,"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.interpolateGreys;\n break;\n }\n return colorScheme;\n}\n ","pinned":false,"hidden":false,"mode":"ojs"},{"id":1989,"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 = \"Greys\";\n break;\n }\n return colorScheme;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1624,"value":"---\n## Visualization: Line chart for the evolution of co2 emissions","pinned":false,"hidden":false,"mode":"md"},{"id":609,"value":"### Visualization 1: Interactive heatmap","pinned":false,"hidden":false,"mode":"md"},{"id":1497,"value":"[{year: 1990, yearly_change: 0, diff_from_base: 0, ghg: 1096.99, ghg_per_cap: \"13.821\"}]","pinned":false,"hidden":false,"mode":"md"},{"id":53,"value":"viewof country = Inputs.select(sortedEmissionsByCountry, {label: \"Country:\"})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1080,"value":"viewof emissionsHeatmapDatasetString = Inputs.select([\"emissions_raw\", \"ghg_emissions_formatted\", \"unfccc_emissions_formatted\"], {label: \"Dataset (RECORDAR ELIMINAR)\"})","pinned":false,"hidden":false,"mode":"ojs"},{"id":55,"value":"\nPlot.plot({\n //title: \"Kyoto Protocol Timeline\",\n width,\n y: {\n label: \"Europe GHG Emissions\",\n grid: true\n },\n marks: [\n Plot.ruleX(country.filter(d => d.year > 1970), {x: \"year\", y: (d) => d.total_ghg == '' ? NaN : Number(d.total_ghg), strokeWidth: (d) => getLollipopWidth(d.year), stroke: d => getLollipopColor(d.year)}),\n Plot.dot(country.filter(d => d.year > 1970), {x: \"year\", y: d => d.total_ghg == '' ? NaN : Number(d.total_ghg), fill: d => getLollipopColor(d.year), r: d => getLollipopRadius(d.year)})\n ]\n})\n","pinned":false,"hidden":false,"mode":"ojs"},{"id":2355,"value":"function getLollipopWidth(year) {\n debugger\n if (year == 1998 || year == 2005 || year == 2008 || year == 2013) {\n return 6;\n }\n else {\n return 2;\n }\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":2357,"value":"function getLollipopRadius(year) {\n if (year == 1998 || year == 2005 || year == 2008 || year == 2013) {\n return 24;\n }\n else {\n return 4;\n }\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":2359,"value":"function getLollipopColor(year) {\n if (year == 1998 || year == 2005 || year == 2008 || year == 2013) {\n return \"rgb(243, 105, 163)\";\n }\n else {\n return \"black\";\n }\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":863,"value":"viewof dataMode = Inputs.select([\"Normalize\", \"Normal\"], {label: \"Mode\"})","pinned":false,"hidden":false,"mode":"ojs"},{"id":932,"value":"viewof heatmapMode = Inputs.select([ \"Change from 1990\", \"Total emissions\", \"Ghg per capita\"], {label: \"Data\"})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1843,"value":"selectedCountry = 2","pinned":false,"hidden":false,"mode":"ojs"},{"id":717,"value":"$32","pinned":false,"hidden":false,"mode":"ojs"},{"id":1815,"value":"$33","pinned":false,"hidden":false,"mode":"ojs"},{"id":2247,"value":"Coses importants:\n- Afegir, pel plot de diferència amb l'any base, si es tracta d'un % de millora\n- ","pinned":false,"hidden":false,"mode":"md"},{"id":2194,"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":104,"value":"data1 = FileAttachment(\"countries@1.csv\").csv()","pinned":false,"hidden":false,"mode":"ojs"},{"id":106,"value":"data2 = data1","pinned":true,"hidden":false,"mode":"ojs"},{"id":119,"value":"Transformaciones para representar los paises de la UE que firmaron el acuerdo, la reduccion a la que tenian que llegar y donde llegaron","pinned":false,"hidden":false,"mode":"md"},{"id":1573,"value":"data_UE_World = {\nconst countriesInData4 = data2.map(item => item.country);\n\nconst filteredData4 = emissionsDataset .filter(item => countriesInData4.includes(item.country));\n\nreturn filteredData4;\n}\n","pinned":true,"hidden":false,"mode":"ojs"},{"id":1620,"value":"select country,year,sum(co2) from data_UE_World\ngroup by country,year","pinned":true,"hidden":false,"mode":"sql","output":"group_data_UE_World","database":"var:data_UE_World"},{"id":127,"value":"data_UE = {\nconst countriesInData2 = data2.map(item => item.country);\n\nconst filteredData = emissions.filter(item => countriesInData2.includes(item.country));\nconsole.log(filteredData);\n\nreturn filteredData;\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":117,"value":"SELECT\n YEAR,\n COUNTRY,\n CO2,\n CO2_1990::DOUBLE AS CO2_1990,\n CO2_1990*0.95 AS REDUCTION_CO2_1990 \nFROM\n (SELECT \n year,\n country,\n co2::DOUBLE AS CO2,\n (SELECT co2::double FROM data_UE t2 WHERE t2.country = t1.country AND t2.year = 1990) AS co2_1990\n FROM \n data_UE t1\n where co2 <> '')\n\n--WHERE country = 'Austria'","pinned":true,"hidden":false,"mode":"sql","output":"kioto_UE","database":"var:data_UE"},{"id":168,"value":"kioto_UE","pinned":true,"hidden":false,"mode":"ojs"},{"id":170,"value":"CO2_1990 = data_UE.filter(d => d.year === \"1990\")\n .map((d) => {\n return {\n country: d.country,\n co2_1990: d.co2,\n reduction_co2_1990: d.co2 * 0.95\n }\n });\n","pinned":true,"hidden":false,"mode":"ojs"},{"id":194,"value":"kioto_UE_2 = {\n const dataZ = [];\n kioto_UE\n .forEach((yearData) => {\n const year = parseInt(yearData.year);\n const quinquennium = year + (5 - year % 5);\n dataZ.push({\n country: yearData.country,\n year: year,\n quinquennium: quinquennium,\n co2: yearData.CO2,\n co2_1990: yearData.CO2_1990,\n red_co2_1990: yearData.REDUCTION_CO2_1990\n });\n });\n return dataZ;\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":230,"value":"countries_data = d3.group(kioto_UE_2, d => d.country)","pinned":true,"hidden":false,"mode":"ojs"},{"id":236,"value":"viewof country_data = Inputs.select(countries_data, {label: \"Country:\"})","pinned":false,"hidden":false,"mode":"ojs"},{"id":297,"value":"\n// Faltaria normalitzar el punt de l'eix de les X\n\nPlot.plot({\n width: 600,\n height: 400,\n marginBottom: 100,\n x: {label: null, tickRotate: 90},\n y: {grid: true},\n color: {\n type: \"threshold\",\n scheme: \"tableau10\",\n domain: [country_data[0].co2_1990 * 0.8, country_data[0].red_co2_1990, country_data[0].co2_1990 * 1.14],\n range: [\n \"#539430\",\n \"#79B758\",\n \"#ff8389\",\n \"#da1e28\",\n ],\n legend: true\n },\n marks: [\n // Plot.barY(kioto_UE_Austria, Plot.groupX({y: \"sum\"}, {x: \"quinquennium\", y: \"co2\"})),\n Plot.dot(country_data.filter(d => d.year <= 2005 && d.year > 1950), {x: \"year\", y:\"co2\", fill:\"grey\", opacity: \"co2\"}),\n Plot.dot(country_data.filter(d => d.year > 2005), {x: \"year\", y:\"co2\", fill:\"co2\"}),\n Plot.ruleX([2008], {strokeDasharray: 2}),\n Plot.ruleX([2012], {strokeDasharray: 2}),\n Plot.ruleX([2013], {strokeDasharray: 2}),\n Plot.ruleX([2022], {strokeDasharray: 2}),\n Plot.ruleY([0])\n ]\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":316,"value":"![g2324.png](${await FileAttachment(\"g2324.png\").url()})","pinned":false,"hidden":false,"mode":"md"},{"id":300,"value":" La idea con este plot seria hacer una grid con plots de este tipo (uno por cada país) por una banda, y por la otra tener un plot que vaya \n apilando o agrupando los puntos rojos y azules para poder ver la situación en general y la evolución. Responderia a la pregunta\n 'Han cumplido los países? Y cuanto han tardado? (Deberia de ser una paleta sequencial)**(plot 4)**\n - Situación concreta 1 / Plot para ver la rapidez con que cada país llegó a las emisiones acordadas. (carrera)\n - Situació concreta 2 / Plot para ver que passó con los que no llegaron a las emisiones acordadas (si n’hi ha algun) (mapa interactiu) categoritzar per tipus de govern/zona… / plot para ver el impacto a nivel mundial de este tratado (poner los datos que hemos estado tratando a un contexto más general).\n","pinned":false,"hidden":false,"mode":"md"},{"id":304,"value":"$34","pinned":false,"hidden":false,"mode":"md"},{"id":282,"value":"![image.png](${await FileAttachment(\"image.png\").url()})","pinned":false,"hidden":false,"mode":"md"},{"id":323,"value":" - Detalle de la primera visualización para cada país a partir del 1990. La línea 0 seria el número de emisiones a las que debe llegar, o bien la diferencia de emisiones con el 1990. Ejemplo: **(plot 3)**\n![Captura2.PNG](${await FileAttachment(\"Captura2.PNG\").url()})","pinned":false,"hidden":false,"mode":"md"},{"id":329,"value":" - Detalle: desglosar las emisiones por alguna categoria (tipo de gas?) **(Plot 4 )**Ejemplo:\n ![Captura3.PNG](${await FileAttachment(\"Captura3.PNG\").url()})","pinned":false,"hidden":false,"mode":"md"},{"id":332,"value":"- Situación concreta 1 / Plot para ver la rapidez con que cada país llegó a las emisiones acordadas\n\n- Situació concreta 2 / Plot para ver que passó con los que no llegaron a las emisiones acordadas (si n’hi ha algun) / plot para ver el impacto a nivel mundial de este tratado (poner los datos que hemos estado tratando a un contexto más general).\n","pinned":false,"hidden":false,"mode":"md"},{"id":423,"value":"---\n#### Addendum: data, libraries, other ...","pinned":false,"hidden":false,"mode":"md"},{"id":1085,"value":"### Datasets","pinned":false,"hidden":false,"mode":"md"},{"id":1131,"value":"**EU countries**","pinned":false,"hidden":false,"mode":"md"},{"id":543,"value":"countries_csv = FileAttachment(\"countries@1.csv\").csv()","pinned":false,"hidden":false,"mode":"ojs"},{"id":1088,"value":"---\n**Emissions dataset 1 (original)**","pinned":false,"hidden":false,"mode":"md"},{"id":429,"value":"emissions_raw = FileAttachment(\"owid-co2-data.csv\").csv()","pinned":false,"hidden":false,"mode":"ojs"},{"id":2011,"value":"emissions_raw","pinned":false,"hidden":false,"mode":"ojs"},{"id":1090,"value":"**Emissions dataset 2 (time series)**","pinned":false,"hidden":false,"mode":"md"},{"id":1011,"value":"ghg_emissions_workbook = FileAttachment(\"Time Series - GHG total with LULUCF, in kt CO₂ equivalent@4.xlsx\").xlsx()","pinned":false,"hidden":false,"mode":"ojs"},{"id":1013,"value":"ghg_emissions = ghg_emissions_workbook.sheet(0, {\n headers: true,\n // range: \"A1:J10\"\n })","pinned":false,"hidden":false,"mode":"ojs"},{"id":1028,"value":"ghg_emissions_formatted = {\n const dataZ = [];\n ghg_emissions\n .forEach((countryData) => {\n for (let i = 1990; i < 2022; i++) {\n dataZ.push(\n {\n country: countryData.Party,\n iso_code: countryData.iso,\n year: i,\n total_ghg: countryData[i]\n }\n )\n }\n });\n return dataZ;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1092,"value":"**Emission dataset 3 (UNFCCC official)**","pinned":false,"hidden":false,"mode":"md"},{"id":1094,"value":"unfccc_emissions_workbook = FileAttachment(\"UNFCCC_emissions.xlsx\").xlsx()","pinned":false,"hidden":false,"mode":"ojs"},{"id":1096,"value":"unfccc_emissions = unfccc_emissions_workbook.sheet(0, {\n headers: true,\n // range: \"A1:J10\"\n })","pinned":false,"hidden":false,"mode":"ojs"},{"id":1116,"value":"unfccc_emissions_formatted = {\n const dataZ = [];\n unfccc_emissions\n .forEach((yearData) => {\n dataZ.push(\n {\n country: yearData.Country,\n iso_code: yearData.Country_code,\n year: yearData.Year,\n total_ghg: yearData.emissions\n }\n )\n });\n \n return dataZ.sort(function(a, b) {\n if(a.country > b.country) return 1\n else if (a.country == b.country) {\n if (a.year < b.year) return -1\n }\n else return -1;\n });\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1129,"value":"---\n**Imports**","pinned":false,"hidden":false,"mode":"md"},{"id":425,"value":"import { toc } from \"@nebrius/indented-toc\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":520,"value":"import {SummaryTable} from \"@observablehq/summary-table\"","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W35","stdlib":"1","titling":"auto"}