3e:null 3f:["$","title",null,{"children":"Responsibility for Ecological Breakdown | Goodlife4all WithinPBs | Observable"}] 45:T415,html_struct = { return html `

`; }46:T76fd,chart = ({ controls: null, country1: null, country2:null, data1: null, data2: null, yMax: null, yearData: null, maxSequence: 47, sequence: 47, biophysicalSVG1: null, biophysicalSVG2: null, bioIndexes: [ "MF" ], bioLabels: [ 'Resource Use' ], bioUnits: { 'MF': 'million tonnes' }, bioEnabled: { "MF": false }, bioColors: { MF: "purple" }, lineUnityLabels: { 'biophysical': 'Fair Share' }, setControls(controls) { this.controls = controls; }, setCountry1: function (iso3c) { function getByISO(arr, value) { for (var i=0, iLen=arr.length; i= 0) { x = Math.round(ptx / xStep); if (x > Self.maxSequence) { x = Self.maxSequence; } if (ptx <= xStep * Self.maxSequence) { showTooltip = true; } } d3 .select(`#${domain}_vertical_line1`) .style("display", "none") ; d3 .select(`#${domain}_vertical_line1`) .selectAll('circle') .remove() ; if (showTooltip) { d3 .select(`#${domain}_vertical_line1`) .attr("transform", `translate(${xScale(x)},0)`) .style("display", "block") ; d3 .select(`#${domain}_vertical_line1`) .selectAll('circle') //.data(Self.computeVisibleIndexes(domain, indexes, x, enabled)) .data(Self.data1[domain].ratio) .enter() .append("circle") .attr("cx", 0) .attr("cy", function (d) { return yScale(Self.data1[domain].ratio[d][x]); }) .attr("r", 5) .attr("stroke", d => palette[d]) .attr("fill", d => palette[d]) // .style("opacity", 0.8) ; d3 .select(`#${domain}_vertical_line1`) .append('circle') .attr("cx", 0) .attr("cy", yScale(1)) .attr("r", 5) .attr("stroke", "green") .attr("fill", "green") .style("opacity", 0.8) ; d3 .select(`#${domain}_chart1 div`) .remove() ; let table1 = ``; table1 += ''; for (let i in indexes) { const id = indexes[i]; if (id !== 'H2OfootPerCap') { let v = id !== 'CO2footCum' ? Math.round(Self.data1[domain].value[id][x] / 1000000) : Math.round(Self.data1[domain].value[id][x] / 1000); v = (v !== -1 ? v : ''); let t = id !== 'CO2footCum' ? Math.round(Self.data1[domain].fairShare[id][x] / 1000000) : Math.round(Self.data1[domain].fairShare[id][x] / 1000); t = (t !== -1 ? t : ''); table1 += ``; } } table1 += ''; table1 += '

${x + 1970}	Value	Fair Share	Unit
${labels[i]}	${v.toLocaleString()}	${t.toLocaleString()}	${units[id]}

'; d3 .select(`#${domain}_chart1`) .append('div') .style("position", "absolute") //.style("left", `${rx}px`) .style("top", `${ry + 10}px`) .style("z-Index", "10000") .html(table1) ; d3 .select(`#${domain}_chart1 div table`) .selectAll('td, th') .each(function () { d3 .select(this) .style('padding-left', '4px') .style('padding-right', '4px') .style('padding-top', '0') .style('padding-bottom', '0') .style('margin', '0') ; }) ; const bounds3 = d3.select(`#${domain}_chart1 div table`).node().getBoundingClientRect(); if (rx + bounds3.width > bounds2.width) { d3 .select(`#${domain}_chart1 div`) .style('left', `${bounds2.width - bounds3.width}px`) .style('width', `${bounds3.width}px`) ; d3 .select(`#${domain}_chart1 div table`) .style('width', `${bounds3.width}px`) ; } else { d3 .select(`#${domain}_chart1 div`) .style("left", `${rx}px`) ; } } }) .on("mouseout", function (d) { d3.select(`#${domain}_vertical_line1`).style("display", " none"); d3.select(`#${domain}_chart1 div`).remove(); }) ; const xAxis = d3.axisBottom().tickFormat(x => `${(x + 1970)}`).tickValues([5, 15, 25, 35, 45]).scale(xScale); svg .append("g") .style("font-family", "sans-serif") .style("font-size", "1em") .attr("class", "axis") .attr("transform", "translate(0," + height + ")") .call(xAxis) .append("text") .attr("x", (width / 2) + "px") .attr("y", 60) .style("fill", "#333") .style("shape-rendering", "crispEdges") .style("font-family", "sans-serif") .style("font-size", "1.5em") .style("line-height", "100%") .style("text-anchor", "middle") .text("Year") ; const yAxis = d3.axisLeft().scale(yScale); svg .append("g") .style("font-family", "sans-serif") .style("font-size", "1em") .attr("class", "axis") .call(yAxis); const labelPositions = this.calculateLineLabelPositions1(this.data1[domain].ratio, yScale, null, enabled); let lines = svg .append("g") .attr("id", "path_" + domain + "_group") ; for (let label in labelPositions) { const i = labelPositions[label].id; const id = "path_" + domain + "_" + i; lines .selectAll("#" + id) .data([i]) .enter() .append("g") .attr("id", id) .attr("data-stroke", i === 'threshold' ? 'green' : palette[i]) .on('mouseover', function (d, e) { const g = this; d3 .select(this.parentElement) .selectAll("g:not(#path_social_threshold):not(#path_biophysical_threshold)") .each(function () { const g2 = this; d3.select(this) .selectAll("*") .each(function () { const color = g !== g2 ? "#e0e0e0" : d3.select(g2).attr("data-stroke"); const opa = g !== g2 ? 0.4 : 0.8; d3 .select(this) .style("stroke", color) .style("opacity", opa); }) }) }) .on('mouseout', function (d, e) { const g = this; d3 .select(this.parentElement) .selectAll("g") .each(function () { const g2 = this; d3.select(this) .selectAll("*") .each(function () { const color = d3.select(g2).attr("data-stroke"); d3 .select(this) .style("stroke", color) .style("opacity", 0.8); ; }) }) }) .append("path") .attr("stroke-linejoin", "bevel") .attr("stroke-linecap", "round") .style("fill", "none") .style("stroke", i === 'threshold' ? 'green' : palette[i]) .style("stroke-width", 4) .style("opacity", 0.8) .style("cursor", "pointer") .attr("d", function (d) { let path = d3.path(); if (i !== 'threshold') { let moved = false; if (Self.data1[domain].ratio[d][0] !== 1.00001) { path.moveTo( xScale(0), yScale(Self.data1[domain].ratio[d][0]) ); moved = true; } for (let i = 1; i <= Self.maxSequence; i++) { if (Self.data1[domain].ratio[d][i] !== 1.00001) { if (moved) { path.lineTo( xScale(i), yScale(Self.data1[domain].ratio[d][i]) ); } else { path.moveTo( xScale(i), yScale(Self.data1[domain].ratio[d][i]) ); moved = true; } } } } else { path.moveTo(xScale(0), yScale(1)); path.lineTo(xScale(Self.maxSequence), yScale(1)); } return path; }) .each(function () { const posData = labelPositions[label]; const posX = xScale(Self.maxSequence); d3 .select(this.parentElement) .append("path") .attr("stroke", d => i === 'threshold' ? 'green' : palette[i]) .attr("stroke-width", 1) .attr("d", `M${posX + 4},${posData.origin},${posX + 25},${posData.y - 5}`) .style("cursor", "pointer") ; d3 .select(this.parentElement) .append("text") .attr("x", posX + 28) .attr("y", posData.y) .attr("stroke", i === 'threshold' ? 'green' : palette[i]) .style("vertical-align", "middle") .style("cursor", "pointer") .text(i === 'threshold' ? Self.lineUnityLabels[domain] : labels[indexes.indexOf(i)]) ; }) ; } svg .append("g") .attr("id", domain + "_vertical_line1") .attr("transform", `translate(${xScale(12)}, 0)`) .style("display", "none") .append("path") .attr("stroke-width", 2) .attr("stroke-dasharray", "4 4") .attr("stroke", "#aaa") .attr("d", `M0,0,0,${height}`) ; }, plotLine2: function (svg, domain, palette, indexes, labels, units, enabled) { const Self = this; const adj = 90; let parent = svg.node().parentElement; let bounds = parent.getBoundingClientRect(); const width = bounds.width; const height = bounds.width; const xScale = d3.scaleLinear([0, width]); xScale.domain([0, this.maxSequence]); const yScale = d3.scaleLinear([height, 0]); //yScale.domain([Math.min(0, this.data2[domain].min), this.data2[domain].max]); yScale.domain([0, this.yMax]); const xStep = xScale(1); const pt = svg.node().createSVGPoint(); svg .attr("preserveAspectRatio", "xMinYMin meet") .attr("viewBox", "-" + (adj / 2) + " -" + (adj / 2) + " " + (width + (adj * 3)) + " " + (height + (adj * 2))) ; d3.select(svg.node().parentElement) .on("mousemove", function (d) { const bounds2 = svg.node().parentElement.getBoundingClientRect(); let rx = d.pageX - window.scrollX - bounds2.left; let ry = d.pageY - window.scrollY - bounds2.top; pt.x = d.clientX; pt.y = d.clientY; let showTooltip = false; let x = 0; let ptx = pt.matrixTransform(svg.node().getScreenCTM().inverse()).x; if (ptx >= 0) { x = Math.round(ptx / xStep); if (x > Self.maxSequence) { x = Self.maxSequence; } if (ptx <= xStep * Self.maxSequence) { showTooltip = true; } } d3 .select(`#${domain}_vertical_line2`) .style("display", "none") ; d3 .select(`#${domain}_vertical_line2`) .selectAll('circle') .remove() ; if (showTooltip) { d3 .select(`#${domain}_vertical_line2`) .attr("transform", `translate(${xScale(x)},0)`) .style("display", "block") ; d3 .select(`#${domain}_vertical_line2`) .selectAll('circle') //.data(Self.computeVisibleIndexes(domain, indexes, x, enabled)) .data(Self.data2[domain].ratio) .enter() .append("circle") .attr("cx", 0) .attr("cy", function (d) { return yScale(Self.data2[domain].ratio[d][x]); }) .attr("r", 5) .attr("stroke", d => palette[d]) .attr("fill", d => palette[d]) // .style("opacity", 0.8) ; d3 .select(`#${domain}_vertical_line2`) .append('circle') .attr("cx", 0) .attr("cy", yScale(1)) .attr("r", 5) .attr("stroke", "green") .attr("fill", "green") .style("opacity", 0.8) ; d3 .select(`#${domain}_chart2 div`) .remove() ; let table = ``; table += ''; for (let i in indexes) { const id = indexes[i]; if (id !== 'H2OfootPerCap') { let v = id !== 'CO2footCum' ? Math.round(Self.data2[domain].value[id][x] / 1000000) : Math.round(Self.data2[domain].value[id][x] / 1000); v = (v !== -1 ? v : ''); let t = id !== 'CO2footCum' ? Math.round(Self.data2[domain].fairShare[id][x] / 1000000) : Math.round(Self.data2[domain].fairShare[id][x] / 1000); t = (t !== -1 ? t : ''); table += ``; } } table += ''; table += '

${x + 1970}	Value	Fair Share	Unit
${labels[i]}	${v.toLocaleString()}	${t.toLocaleString()}	${units[id]}

'; d3 .select(`#${domain}_chart2`) .append('div') .style("position", "absolute") //.style("left", `${rx}px`) .style("top", `${ry + 10}px`) .style("z-Index", "10000") .html(table) ; d3 .select(`#${domain}_chart2 div table`) .selectAll('td, th') .each(function () { d3 .select(this) .style('padding-left', '4px') .style('padding-right', '4px') .style('padding-top', '0') .style('padding-bottom', '0') .style('margin', '0') ; }) ; const bounds3 = d3.select(`#${domain}_chart2 div table`).node().getBoundingClientRect(); if (rx + bounds3.width > bounds2.width) { d3 .select(`#${domain}_chart2 div`) .style('left', `${bounds2.width - bounds3.width}px`) .style('width', `${bounds3.width}px`) ; d3 .select(`#${domain}_chart2 div table`) .style('width', `${bounds3.width}px`) ; } else { d3 .select(`#${domain}_chart2 div`) .style("left", `${rx}px`) ; } } }) .on("mouseout", function (d) { d3.select(`#${domain}_vertical_line2`).style("display", " none"); d3.select(`#${domain}_chart2 div`).remove(); }) ; const xAxis = d3.axisBottom().tickFormat(x => `${(x + 1970)}`).tickValues([5, 15, 25, 35, 45]).scale(xScale); svg .append("g") .style("font-family", "sans-serif") .style("font-size", "1em") .attr("class", "axis") .attr("transform", "translate(0," + height + ")") .call(xAxis) .append("text") .attr("x", (width / 2) + "px") .attr("y", 60) .style("fill", "#333") .style("shape-rendering", "crispEdges") .style("font-family", "sans-serif") .style("font-size", "1.5em") .style("line-height", "100%") .style("text-anchor", "middle") .text("Year") ; const yAxis = d3.axisLeft().scale(yScale); svg .append("g") .style("font-family", "sans-serif") .style("font-size", "1em") .attr("class", "axis") .call(yAxis) ; const labelPositions = this.calculateLineLabelPositions2(this.data2[domain].ratio, yScale, null, enabled); let lines = svg .append("g") .attr("id", "path_" + domain + "_group") ; for (let label in labelPositions) { const i = labelPositions[label].id; const id = "path_" + domain + "_" + i; lines .selectAll("#" + id) .data([i]) .enter() .append("g") .attr("id", id) .attr("data-stroke", i === 'threshold' ? 'green' : palette[i]) .on('mouseover', function (d, e) { const g = this; d3 .select(this.parentElement) .selectAll("g:not(#path_social_threshold):not(#path_biophysical_threshold)") .each(function () { const g2 = this; d3.select(this) .selectAll("*") .each(function () { const color = g !== g2 ? "#e0e0e0" : d3.select(g2).attr("data-stroke"); const opa = g !== g2 ? 0.4 : 0.8; d3 .select(this) .style("stroke", color) .style("opacity", opa); }) }) }) .on('mouseout', function (d, e) { const g = this; d3 .select(this.parentElement) .selectAll("g") .each(function () { const g2 = this; d3.select(this) .selectAll("*") .each(function () { const color = d3.select(g2).attr("data-stroke"); d3 .select(this) .style("stroke", color) .style("opacity", 0.8); ; }) }) }) .append("path") .attr("stroke-linejoin", "bevel") .attr("stroke-linecap", "round") .style("fill", "none") .style("stroke", i === 'threshold' ? 'green' : palette[i]) .style("stroke-width", 4) .style("opacity", 0.8) .style("cursor", "pointer") .attr("d", function (d) { let path = d3.path(); if (i !== 'threshold') { let moved = false; if (Self.data2[domain].ratio[d][0] !== 1.00001) { path.moveTo( xScale(0), yScale(Self.data2[domain].ratio[d][0]) ); moved = true; } for (let i = 1; i <= Self.maxSequence; i++) { if (Self.data2[domain].ratio[d][i] !== 1.00001) { if (moved) { path.lineTo( xScale(i), yScale(Self.data2[domain].ratio[d][i]) ); } else { path.moveTo( xScale(i), yScale(Self.data2[domain].ratio[d][i]) ); moved = true; } } } } else { path.moveTo(xScale(0), yScale(1)); path.lineTo(xScale(Self.maxSequence), yScale(1)); } return path; }) .each(function () { const posData = labelPositions[label]; const posX = xScale(Self.maxSequence); d3 .select(this.parentElement) .append("path") .attr("stroke", d => i === 'threshold' ? 'green' : palette[i]) .attr("stroke-width", 1) .attr("d", `M${posX + 4},${posData.origin},${posX + 25},${posData.y - 5}`) .style("cursor", "pointer") ; d3 .select(this.parentElement) .append("text") .attr("x", posX + 28) .attr("y", posData.y) .attr("stroke", i === 'threshold' ? 'green' : palette[i]) .style("vertical-align", "middle") .style("cursor", "pointer") .text(i === 'threshold' ? Self.lineUnityLabels[domain] : labels[indexes.indexOf(i)]) ; }) ; } svg .append("g") .attr("id", domain + "_vertical_line2") .attr("transform", `translate(${xScale(12)}, 0)`) .style("display", "none") .append("path") .attr("stroke-width", 2) .attr("stroke-dasharray", "4 4") .attr("stroke", "#aaa") .attr("d", `M0,0,0,${height}`) ; }, calculateLineLabelPositions1: function (ratio, yScale, currentPosition, enabled) { const keys = Object.keys(ratio); if (!currentPosition) { let inserted = false; currentPosition = []; for (let i = 0; i < keys.length; i++) { const id = keys[i]; if (enabled[id]) { let y = ratio[id][this.maxSequence]; if (y < 1.0 && !inserted) { currentPosition.push({ 'id': 'threshold', 'origin': yScale(1), 'y': yScale(1) + 5 }); inserted = true; } currentPosition.push({ 'id': id, 'origin': yScale(ratio[id][this.maxSequence]), 'y': yScale(y) + 5 }); } } if (!inserted) { currentPosition.push({ 'id': 'threshold', 'origin': yScale(1), 'y': yScale(1) + 5 }); } currentPosition.sort((a, b) => a.y - b.y); } const max = currentPosition.length; let lastY = currentPosition[0].y; let lastP = 0; const gap = 24; let modified = false; for (let i = 1; i < max; i++) { let distance = (currentPosition[i].y + gap - lastY) / (i + 1 - lastP); if (distance >= gap || i + 1 === max) { if (lastP + 1 < i || (i + 1 === max && distance < gap)) { const items = (i + 1 === max && distance < gap) ? max - lastP : i - lastP; const topP = lastP + items - 1; const originSpace = currentPosition[topP].origin - currentPosition[lastP].origin; const requiredSpace = items * gap; let adjust = (requiredSpace - originSpace) / 2; let startY = (lastY - adjust) + (gap / 2); let step = gap; if (startY < 0) { startY = 0; } else if (lastP > 0 && startY < currentPosition[lastP - 1].y) { startY = currentPosition[lastP - 1].y + 1; } if (topP + 1 < max && (startY + requiredSpace) > currentPosition[topP + 1].y) { step = (currentPosition[i].y - startY - (gap / 2)) / items; } for (let j = lastP; j < lastP + items; j++) { currentPosition[j].y = startY; startY += step; } modified = true; } lastY = currentPosition[i].y; lastP = i; } } return modified ? this.calculateLineLabelPositions1(ratio, yScale, currentPosition) : currentPosition; }, calculateLineLabelPositions2: function (ratio, yScale, currentPosition, enabled) { const keys = Object.keys(ratio); if (!currentPosition) { let inserted = false; currentPosition = []; for (let i = 0; i < keys.length; i++) { const id = keys[i]; if (enabled[id]) { let y = ratio[id][this.maxSequence]; if (y < 1.0 && !inserted) { currentPosition.push({ 'id': 'threshold', 'origin': yScale(1), 'y': yScale(1) + 5 }); inserted = true; } currentPosition.push({ 'id': id, 'origin': yScale(ratio[id][this.maxSequence]), 'y': yScale(y) + 5 }); } } if (!inserted) { currentPosition.push({ 'id': 'threshold', 'origin': yScale(1), 'y': yScale(1) + 5 }); } currentPosition.sort((a, b) => a.y - b.y); } const max = currentPosition.length; let lastY = currentPosition[0].y; let lastP = 0; const gap = 24; let modified = false; for (let i = 1; i < max; i++) { let distance = (currentPosition[i].y + gap - lastY) / (i + 1 - lastP); if (distance >= gap || i + 1 === max) { if (lastP + 1 < i || (i + 1 === max && distance < gap)) { const items = (i + 1 === max && distance < gap) ? max - lastP : i - lastP; const topP = lastP + items - 1; const originSpace = currentPosition[topP].origin - currentPosition[lastP].origin; const requiredSpace = items * gap; let adjust = (requiredSpace - originSpace) / 2; let startY = (lastY - adjust) + (gap / 2); let step = gap; if (startY < 0) { startY = 0; } else if (lastP > 0 && startY < currentPosition[lastP - 1].y) { startY = currentPosition[lastP - 1].y + 1; } if (topP + 1 < max && (startY + requiredSpace) > currentPosition[topP + 1].y) { step = (currentPosition[i].y - startY - (gap / 2)) / items; } for (let j = lastP; j < lastP + items; j++) { currentPosition[j].y = startY; startY += step; } modified = true; } lastY = currentPosition[i].y; lastP = i; } } return modified ? this.calculateLineLabelPositions2(ratio, yScale, currentPosition) : currentPosition; }, computeVisibleIndexes: function(domain, indexes, year, enabled) { const Self = this; let visibles = []; const shortDomain = (domain === 'biophysical' ? 'bio' : 'social'); d3 .selectAll(`#${shortDomain}_dropdown_list input[type=checkbox]`) .each(function(d, e) { const key = this.value; if (indexes.indexOf(key) >= 0 && !this.disabled && this.checked && Self.data[domain].ratio[key][year] !== 1.00001 && enabled[key]) { visibles.push(key); } }) ; return visibles; }, });47:T964,controls = ({ //mdb: null, year: 2017, maxYear: 2017, chart: null, init: function(chart){ let Self = this; this.chart = chart; if (document.location.host === 'goodlife4allwithinpbs.static.observableusercontent.com') { d3.select('#main_block').attr("style", "min-height: " + width * 0.8 + "px; height: " + 500 + "px;"); } }, fillCountryDropdown1: function(countryData) { let Self = this; let countryList = countryData.map(elem => ( { country: elem.country, iso3c: elem.iso3c } )); let list1 = d3.select("#country_dropdown_menu1") .selectAll("option") .data(countryList) .enter() .append("option") .attr("class", "dropdown-item") .attr("id", d => "country1_" + d.iso3c) .attr("name", "country1") .attr("value", d => d.iso3c) .text(d => d.country) .property("selected", function (d) { return d.iso3c === 'HIC'; }) ; $('#country_dropdown_menu1') .on('change', function () { let key1 = $(this).val(); let key2 = Self.chart.country2; //let name = $(this).next().text(); //$('#country_dropdown1 .dropdown-toggle').text(name); //$('#country_dropdown_menu1').text(name); Self.chart.setCountry1(key1); Self.chart.setCountry2(key2); }); }, fillCountryDropdown2: function(countryData) { let Self = this; let countryList = countryData.map(elem => ( { country: elem.country, iso3c: elem.iso3c } )); let list2 = d3.select("#country_dropdown_menu2") .selectAll("option") .data(countryList) .enter() .append("option") .attr("class", "dropdown-item") .attr("id", d => "country2_" + d.iso3c) .attr("name", "country2") .attr("value", d => d.iso3c) .text(d => d.country) .property("selected", function (d) { return d.iso3c === 'LIC'; }) ; $('#country_dropdown_menu2') .on('change', function () { let key1 = $(this).val(); let key2 = Self.chart.country1; //let name = $(this).next().text(); //$('#country_dropdown2 .dropdown-toggle').text(name); //$('#country_dropdown_menu2').text(name); Self.chart.setCountry2(key1); Self.chart.setCountry1(key2); }); } });48:[{"id":"9cdf96ef7e1f9c07430c9f4617c73d9c5fde7e0fc9f5f5ed6396a80669165c6b82511b3034265fb49f4023497ec1b85c9304152d0d7a9d20f8601ca21e00fd1e","href":"https://static.observableusercontent.com/files/9cdf96ef7e1f9c07430c9f4617c73d9c5fde7e0fc9f5f5ed6396a80669165c6b82511b3034265fb49f4023497ec1b85c9304152d0d7a9d20f8601ca21e00fd1e","name":"Responsibility4EcologicalBreakdown_v2@1.json","type":"application/json","lastModified":1651783570761.533,"size":532117}] 43:{"id":"d6187afe6819973e","slug":null,"title":"Responsibility for Ecological Breakdown","thumbnail":"4a606275bff28ab5098668ee049149ada04cbc21a95a0affb5c390ebf6fabeb1","access_level":"public","create_time":"$D2022-03-27T14:38:13.789Z","update_time":"$D2023-08-25T22:39:27.139Z","view_time":null,"first_public_time":"$D2022-12-06T11:09:22.716Z","has_unpublished_edits":null,"fork":false,"stars":0,"starred":false,"owner":{"type":"team","id":"ce9094331216f114","login":"goodlife4allwithinpbs","name":"Goodlife4all WithinPBs","avatar_url":"https://avatars-next.observableusercontent.com/e3615608d84ea4ccd13ed87e0dee872cb08d8f9474d6fd162a3834c34c56470c","tier":"starter_2024","bio":"","following":false},"version":418,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"4f246c20353ea487","login":"goodlife4allwithinpbs","name":"Goodlife4all WithinPBs","avatar_url":"https://avatars-next.observableusercontent.com/e3615608d84ea4ccd13ed87e0dee872cb08d8f9474d6fd162a3834c34c56470c","tier":null,"bio":"","following":false}],"members":[{"type":"individual","id":"4f246c20353ea487","login":"goodlife4allwithinpbs","name":"Goodlife4all WithinPBs","avatar_url":"https://avatars-next.observableusercontent.com/e3615608d84ea4ccd13ed87e0dee872cb08d8f9474d6fd162a3834c34c56470c","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":1,"collection":null,"type":"notebook","body":{"titling":"auto","title":"Responsibility for Ecological Breakdown","cells":[{"id":0,"value":"# Responsibility for Ecological Breakdown","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":3,"value":"$45","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":13,"value":"play_chart = {\n $(document).ready(function() {\n chart.setControls(controls);\n \n controls.init(chart);\n controls.fillCountryDropdown1(countryData);\n controls.fillCountryDropdown2(countryData);\n \n chart.setCountry1('HIC');\n // d3.select('#country_dropdown_menu1').text('High-income');\n\n chart.setCountry2('LIC');\n //d3.select('#country_dropdown_menu2').text('Low-income');\n });\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":16,"value":"countryData = FileAttachment(\"Responsibility4EcologicalBreakdown_v2@1.json\").json()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":22,"value":"$46","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":20,"value":"$47","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":8,"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":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":10,"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"