Public
Edited
Aug 22, 2022
Insert cell
Insert cell
Insert cell
Inputs.table(aiddata)
Insert cell
aiddata = {
const data = await d3.csv(googleSheetCsvUrl, row => ({
yearDate: d3.timeParse('%Y')(row.year),
yearInt: +row.year,
donor: row.donor,
recipient: row.recipient,
amount: +row.commitment_amount_usd_constant,
purpose: row.coalesced_purpose_name,
}));
data.columns = Object.keys(data[0]);
return data;
}
Insert cell
Insert cell
geoJSON = FileAttachment("countries-50m.json").json()
Insert cell
Insert cell
Insert cell
Insert cell
import {legend, swatches} from "@d3/color-legend"
Insert cell
Insert cell
Insert cell
a) How does the amount donated vs. amount received change over time for each country?
Insert cell
Insert cell
countries = [... new Set(aiddata.map(d => d.recipient))]
Insert cell
selectYear
Insert cell
Insert cell
//data question a) Group the data with respect to years and donors, in the same way do for recipients
yearlyCountryDonationData = d3.rollups(aiddata, g => d3.sum(g, e => e.amount), d => d.donor, d => d.yearInt)
Insert cell
yearlyCountryRecieptData = d3.rollups(aiddata, g => d3.sum(g, e => e.amount), d => d.recipient, d => d.yearInt)
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
filteringDataByYearLocRecieve =
{
var filterData = [];
selectYear.forEach(year =>{
const tempYear = yearlyGiveTakeCountryWise.filter(d => d.yr == year)
filterData = filterData.concat(tempYear)
})
return filterData.filter(d => d.location == selectLocation).filter(d => d.txn =='recieving')
}
Insert cell
filteringDataByYearLocDonate =
{
var filterData = [];
selectYear.forEach(year =>{
const tempYear = yearlyGiveTakeCountryWise.filter(d => d.yr == year)
filterData = filterData.concat(tempYear)
})
return filterData.filter(d => d.location == selectLocation).filter(d => d.txn =='donating')
}
Insert cell
Insert cell
Insert cell
c) Are there countries that change their role over time?
Marks : Lines, Matrices,
Channels: colors, position
Insert cell
Insert cell
d3 = require('d3@7')
Insert cell
googleSheetCsvUrl = 'https://docs.google.com/spreadsheets/d/1YiuHdfZv_JZ-igOemKJMRaU8dkucfmHxOP6Od3FraW8/gviz/tq?tqx=out:csv'
Insert cell

Purpose-built for displays of data

Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
Learn more