3e:null 3f:["$","title",null,{"children":"Barcelona Global–Ecological lens | gp's Workspace | Observable"}] 45:T691,html_struct = { return html `

`; }46:Tb2d,controls = ({ //mdb: null, timer: null, timerInterval: 1000, year: 2015, maxYear: 2015, chart: null, init: function(chart){ let Self = this; this.chart = chart; if (document.location.host === 'b157ec7df9b4fd70.static.observableusercontent.com') { d3.select('#main_block').attr("style", "min-height: " + width * 0.8 + "px; height: " + 800 + "px;"); } d3.select("#yearRange").on("input", function () { Self.year = this.value != 20 ? (this.value * 1) + 1996 : 2015; d3.select("#yearRangeNumber").text(Self.year); Self.chart.setYear(Self.year); }); d3.select("#playRange").on("click", function () { let button = this; button.disabled = true; d3.select("#yearRangeNumber").text(1996); d3.select("#yearRange").node().value = 0; Self.year = 1996; Self.chart.setYear(1996); Self.timer = d3.interval(function (duration) { let pos = 1996 + Math.floor(duration / Self.timerInterval)*4; if (pos > Self.year) { Self.year = pos; if (pos < Self.maxYear) { Self.chart.setYear(pos); } else { Self.chart.setYear(Self.maxYear); Self.timer.stop(); button.disabled = false; } d3.select("#yearRangeNumber").text(Self.year); d3.select("#yearRange").node().value = Self.year - 1996; } }, Self.timerInterval); }); }, fillPlacesDropdown: function(bcnData) { let Self = this; let placeList = bcnData.map(elem => ( { place: elem.place, placeCode: elem.placeCode } )); let list = d3.select("#country_dropdown .dropdown-menu") .selectAll(".dropdown-item") .data(placeList) .enter() .append("li") .attr("class", "dropdown-item") .append("div") .attr("class", "custom-control custom-radio"); list.append("input") .attr("type", "radio") .attr("class", "custom-control-input") .attr("id", d => "place_" + d.placeCode) .attr("name", "place") .attr("value", d => d.placeCode) ; list.insert("label") .attr("class", "custom-control-label") .attr("for", d => "place_" + d.placeCode) .text(d => d.place) ; $('#country_dropdown .dropdown-toggle').dropdown(); $('#country_dropdown input[type="radio"]') .on('input', function () { let key = $(this).val(); let name = $(this).next().text(); $('#country_dropdown .dropdown-toggle').text(name); Self.chart.setPlace(key); }); }, enablePanels: function() { $('#panels').removeClass('d-none'); $('#controls2').removeClass('d-none').addClass('d-flex'); $('#yearRange').removeAttr('disabled'); $('#playRange').removeAttr('disabled'); } });47:T204c,chart = ({ //mdb: null, controls: null, place: null, data: null, yearData: null, maxSequence: 5, sequence: 5, globalEcologicalSVG: null, bioIndexes: [ "cumCF", "PF", "NF", "H2O", "LUC", "EF", "MF" ], bioLabels: [ 'CO2 Emissions', 'Phosphorus', 'Nitrogen', 'Blue Water', 'Land-Use Change', 'Ecological Footprint', 'Material Footprint' ], bioUnits: { 'cumCF': 'cumulative megatonnes CO2', 'PF': 'kilograms P per capita', 'NF': 'kilograms N per capita', 'H2O': 'cubic metres H2O per capita', 'LUC': 'tonnes C per capita', 'EF': 'global hectares per capita', 'MF': 'tonnes per capita' }, coreRadius: 63, bioRadius: 132, ceilingScale: null, setControls(controls) { this.controls = controls; }, setPlace: function (placeCode) { function getByPlaceCode(arr, value) { for (var i=0, iLen=arr.length; i 1 ? 1 : d.data); } ) ; let arc_red = d3.arc() .innerRadius( function (d) { return Self.bioRadius + 16; } ) .outerRadius( function (d) { if (d.data === "1.00001") { return Self.ceilingScale(3.2); } else { return Self.ceilingScale(d.data > 1 ? d.data : 1) + 16; } } ) ; svg .append("g") .attr("stroke", "white") .attr("stroke-width", "1.2") .selectAll("path") .data(arcs) .join("path") .attr("fill", function (d) { if (d.data === 1.00001) { return "#E5E5E5"; } else { return "#a1d99b"; } }) .attr("d", arc_green) ; svg .append("g") .attr("stroke", "white") .attr("stroke-width", "1.2") .selectAll("path") .data(arcs) .join("path") .attr("fill", function(d) { if (d.data === 1.00001) { return "#E5E5E5"; } else { return "#d73027"; } }) .attr("d", arc_red) ; const radius = Self.bioRadius * 1.5; let arcLabel = d3.arc().innerRadius(radius).outerRadius(radius); svg .append("g") .selectAll("path") .data(arcs) .join("path") .attr("display", "none") .attr("fill", "#333") .attr("stroke", "#000") .attr("d", arcLabel) .attr("id", (d, i) => `arc_bio_${i}`) ; svg .append("g") .selectAll("text") .data(arcs) .join("text") .attr("dx", function(d, i) { return i < 2 || i > 4 ? -90 : 90; }) .attr("dy", function(d, i) { return i < 2 || i > 4 ? 100 : -90; }) .attr("font-size", "14px") .attr("fill", "#000") .append("textPath") .style("text-anchor", "middle") .attr("startOffset", "50%") .attr("xlink:href", (d, i) => `#arc_bio_${i}`) .text( d => (d.data === 1.00001 ? ' ?' : '')) ; svg .append("g") .selectAll("text") .data(arcs) .join("text") .attr("dy", function (d, i) { return i < 2 || i > 4 ? 7 : 0; }) .attr("dx", function (d, i) { return i < 2 || i > 4 ? -90 : 90; }) .attr("font-size", "14px") .attr("fill", function (d, i) { let r = Self.ceilingScale(d.data); return r > 187 ? "#fff" : "#000"; }) .append("textPath") .style("text-anchor", "middle") .attr("startOffset", "50%") .attr("xlink:href", (d, i) => `#arc_bio_${i}`) .text((d, i) => Self.bioLabels[i]) ; }, drawBoundaries: function (svg) { const Self = this; let pie_bio = d3.pie() .startAngle(-98 * Math.PI / 180) .endAngle(-98 * Math.PI / 180 + 2 * Math.PI) .value( function (d) { return d; }) .sort(null); const arcbio = d3.arc().innerRadius(Self.bioRadius).outerRadius(Self.bioRadius + 16); svg .selectAll("#bioboundaryarc") .data(function (d) { return pie_bio([Self.bioLabels.length]); }) .enter() .append("path") .attr("class", "arc") .attr("id", "bioboundaryarc") .attr("d", arcbio) .attr("fill", "#31a354") .style("stroke-width", 1.5) .style("stroke", "#252525") ; svg .selectAll("#bioarctext") .data(["Ecological Ceiling"]) .enter() .append("text") .attr("dx", 200) .attr("dy", 12) .attr("font-size", "14px") .attr("fill", "#fff") .append("textPath") .attr("xlink:href", "#bioboundaryarc") .text(function (d) { return d; }) ; } });48:[{"id":"7fc40f491d5676685e7cdac4e1e4d897e19987f6a878595bfffcce2ae45c753682aeba6f12616c9c94539ac0f5174284a940a8b14a38872ba69eda217167ac91","href":"https://static.observableusercontent.com/files/7fc40f491d5676685e7cdac4e1e4d897e19987f6a878595bfffcce2ae45c753682aeba6f12616c9c94539ac0f5174284a940a8b14a38872ba69eda217167ac91","name":"1_bcnData_globalEcological.json","type":"application/json","lastModified":1705083110431.368,"size":17055}] 43:{"id":"abfea97f8fdba4ec","slug":null,"title":"Barcelona Global–Ecological lens","thumbnail":"4fc1d310ef344c471d15b2f1d6c9378f99cde5bab5611c51d4eda5434a3f30cb","access_level":"public","create_time":"$D2024-01-12T18:11:50.431Z","update_time":"$D2024-01-12T18:11:50.431Z","view_time":null,"first_public_time":"$D2024-01-12T18:11:50.431Z","has_unpublished_edits":null,"fork":{"id":"736c1575a02e4764","slug":null,"title":"Barcelona Global–Ecological lens","owner":{"id":"8fcae82cb470ebd7","login":"deal","name":""}},"stars":0,"starred":false,"owner":{"type":"team","id":"b0ee87258e6a2283","login":"gp2-ws","name":"gp's Workspace","avatar_url":"https://avatars-next.observableusercontent.com/e1bab22c49ef32600428b888fd91682decd66c74b462fe00de115b94904e90fd","tier":"starter_2024","bio":"","following":false},"version":54,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"8418c7782491db77","login":"gp2","name":"gp","avatar_url":"https://avatars-next.observableusercontent.com/891f20c2964173559239e0d412beded489d861e799010d83c7d64510da419a46","tier":null,"bio":"Musician, Designer, Dataviz enthusiast trying to figure JS out.","following":false}],"members":[{"type":"individual","id":"8418c7782491db77","login":"gp2","name":"gp","avatar_url":"https://avatars-next.observableusercontent.com/891f20c2964173559239e0d412beded489d861e799010d83c7d64510da419a46","tier":null,"role":"editor"},{"type":"team","id":"b0ee87258e6a2283","login":"gp2-ws","name":"gp's Workspace","avatar_url":"https://avatars-next.observableusercontent.com/e1bab22c49ef32600428b888fd91682decd66c74b462fe00de115b94904e90fd","tier":"starter_2024","role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"titling":"auto","title":"Barcelona Global–Ecological lens","cells":[{"id":0,"value":"# Barcelona Global–Ecological lens","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":5,"value":"md`This notebook is a working draft visualisation of the consumption-based level of resource use of Barcelona and its neighbourhoods with respect to downscaled biophysical boundaries from 1996 to 2015.\n\nThe data has not been finalised and is subject to change. It has been collected and analysed by the Barcelona Doughnut Portrait team, a collaboration between the City of Barcelona's Office for Climate Emergency and Ecological Transition, the University of Barcelona, Barcelona Regional, and Doughnut Economics Action Lab. For more information, contact X Y (email).`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":7,"value":"$45","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":44,"value":"md`****IF YOU DON'T SEE A VISUALISATION**** -> Click on the code cell directly below, and press Shift+Enter on your keyboard (or click the arrow in the top-right corner of the cell directly below).`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":18,"value":"$$ = require('jquery').then(jquery => {\n window.jquery = jquery;\n // return require('popper@1.16.1/index.js').catch(() => jquery);\n require('bootstrap@4.0');\n return jquery;\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":9,"value":"play_chart = {\n $(document).ready(function() {\n chart.setControls(controls);\n \n controls.init(chart);\n controls.fillPlacesDropdown(bcnData);\n \n chart.setPlace('BCN');\n d3.select('#country_dropdown .dropdown-toggle').text('Barcelona');\n });\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":11,"value":"bcnData = FileAttachment(\"1_bcnData_globalEcological.json\").json()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":14,"value":"$46","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":16,"value":"$47","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":21,"value":"d3 = require(\"d3@7\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W48","stdlib":"1"}} 44:"$43:body"