34:["$","title",null,{"children":"Mini-Project 1: Geographic Financial Aid (Due Oct. 29th) | Swati Singh | Observable"}] 3c:Ta99,

[NOTE]

Please make sure to Read ALL instructions carefully for each part of this assignment!

1. Please **fork this notebook** for this mini-project. Ensure that the notebook is made either _public_ or _unlisted_ in the settings. 2. Complete each question to the best of your ability, clearly marking which visualization and/or written answer corresponds to which question asked. 3. Your coded solutions **must use D3**. Other visualization libraries (.e.g Vega-Lite) or other code languages (e.g. Python) are not allowed. - You are allowed to use functions and modules created by other creators. For example, you can use Mike Bostock's Color Legend notebook to create your legends. 4. You are free to modify any datasets mentioned in this project, or introduce new datasets if it helps you with any explanations or visualizations. For datasets originating from this dataset, you are free to modify them in any way as long as 1) the preprocessing is performed here in JavaScript, or 2) you preprocessed the dataset elsewhere (e.g. a Python notebook or Google Colab notebook via Python). - If you modified the dataset elsewhere, **please make sure to explicitly mention in your write-up where and how to access the code; preprocessing the dataset without a way for us to verify will lead to penalties on your score**. - If you are introducing a new dataset from elsewhere, **please make sure to explicitly mention how to access the dataset**. 5. Please adhere to our AI policy for the class, which is provided on our course syllabus: > _... you can use generative AI tools to do the assignments in this class. If you use an AI to guide you in completing an assignment, you must **disclose which parts were generated by the AI**. Remember that you are responsible for any errors or inaccuracies in AI-generated content, and you must be able to explain all submitted work._ 6. Submit the URL of this notebook on Brightspace by the listed due date. ### Submission Details This assignment is due **Oct. 29th @ 11:59pm**. This submission expects a URL to your notebook that is either public or unlisted. Please be aware that we will grade notebooks based on the version of the notebook we receive at the submission deadline. This means that if you decide to modify your notebooks after the deadline, your changes may not be considered while grading. This policy also applies to late submissions as well.3d:T698,Your goal is to create **3 independent visualizations of the same dataset**, each one with the intent of answering the questions stated below. For each numbered question, you should be able to 1) create a data visualization that answers **all** of the questions specified, 2) provide a written analysis that extrapolates from your visualization and answers **all** of the questions specified, and 3) provide a written description of your thought process and why you think your solution is *appropriate* and *effective*. These are the 3 visualizations you should create: - **Visualization #1 [25pts]:** How do the countries compare in terms of how much they receive and donate? Are there countries that donate much more than they receive or receive much more than they donate? - **Visualization #2 [25pts]:** Do the countries that mostly receive or mostly donate tend to cluster around specific geographical areas of the world? Are there neighboring countries that have radically different patterns in terms of how much they receive vs. how much they donate? - **Visualization #3 [25pts]:** Are there any major differences in how the top 5 most frequent purposes of disbursements (across all countries) distribute geographically in terms of countries that receive donations? Are there countries that tend to receive more of certain types of donations than others?

[NOTE]

It is okay to submit more than one solution, plot, etc. for a given visualization problem if you think there are some competing solutions that work well. When you do that, make sure to compare the solutions by commenting on their advantages and disadvantages.

3e:T4df,aiddata_clean = { // Convert missing or invalid text values to null const cleanText = value => { const text = String(value ?? "").trim(); return ( text === "" || ["na", "n/a", "null", "undefined"].includes(text.toLowerCase()) ) ? null : text; }; // Convert financial amounts to numbers const parseAmount = value => { const text = cleanText(value); if (text === null) return null; const amount = Number(text.replace(/[$,]/g, "")); return Number.isFinite(amount) ? amount : null; }; // Clean each record while retaining the original column names return aiddata_raw.map(row => { const yearText = cleanText(row.year); const year = yearText === null ? null : Number(yearText); return { aiddata_id: cleanText(row.aiddata_id), aiddata_2_id: cleanText(row.aiddata_2_id), year: Number.isInteger(year) ? year : null, donor: cleanText(row.donor), recipient: cleanText(row.recipient), commitment_amount_usd_constant: parseAmount(row.commitment_amount_usd_constant), coalesced_purpose_code: cleanText(row.coalesced_purpose_code), coalesced_purpose_name: cleanText(row.coalesced_purpose_name) }; }); }3f:T549,data_quality_summary = [ { metric: "Total records", value: aiddata_raw.length }, { metric: "Valid financial records", value: aiddata_valid.length }, { metric: "Excluded records", value: aiddata_raw.length - aiddata_valid.length }, { metric: "Unique donor countries", value: new Set(aiddata_valid.map(d => d.donor)).size }, { metric: "Unique recipient countries", value: new Set(aiddata_valid.map(d => d.recipient)).size }, { metric: "Earliest year", value: d3.min(aiddata_valid, d => d.year) }, { metric: "Latest year", value: d3.max(aiddata_valid, d => d.year) }, { metric: "Missing financial amounts", value: aiddata_clean.filter( d => d.commitment_amount_usd_constant === null ).length }, { metric: "Zero financial amounts", value: aiddata_valid.filter( d => d.commitment_amount_usd_constant === 0 ).length }, { metric: "Negative financial amounts", value: aiddata_valid.filter( d => d.commitment_amount_usd_constant < 0 ).length }, { metric: "Missing purpose names", value: aiddata_valid.filter( d => d.coalesced_purpose_name === null ).length }, { metric: "Same donor and recipient", value: aiddata_valid.filter( d => d.donor === d.recipient ).length } ]40:T46f,country_totals = { // Total financial commitments made by each donor const donations = d3.rollup( aiddata_valid, records => d3.sum( records, d => d.commitment_amount_usd_constant ), d => d.donor ); // Total financial commitments received by each recipient const receipts = d3.rollup( aiddata_valid, records => d3.sum( records, d => d.commitment_amount_usd_constant ), d => d.recipient ); // Include every country appearing as a donor or recipient const countries = new Set([ ...donations.keys(), ...receipts.keys() ]); // Combine donation and receipt totals into one dataset return Array.from(countries, country => { const donated = donations.get(country) ?? 0; const received = receipts.get(country) ?? 0; return { country: country, donated_usd: donated, received_usd: received, // Positive = net donor; negative = net recipient net_donated_usd: donated - received }; }).sort((a, b) => d3.descending( a.donated_usd + a.received_usd, b.donated_usd + b.received_usd ) ); }41:T1f48, viz1_scatter = { // -------------------------------------------------- // 1. Chart dimensions and margins // -------------------------------------------------- const width = 850; const height = 540; const margin = { top: 83, right: 175, bottom: 100, left: 105 }; const plotWidth = width - margin.left - margin.right; const plotHeight = height - margin.top - margin.bottom; // -------------------------------------------------- // 2. Financial scales and formatting // -------------------------------------------------- const maxAmount = d3.max( country_totals, d => Math.max(d.donated_usd, d.received_usd) ) * 1.05; // Symlog accommodates both zero and large amounts. const xScale = d3.scaleSymlog() .constant(1e6) .domain([0, maxAmount]) .range([0, plotWidth]); const yScale = d3.scaleSymlog() .constant(1e6) .domain([0, maxAmount]) .range([plotHeight, 0]); const axisTicks = [ 0, 1e6, 1e7, 1e8, 1e9, 1e10, 1e11 ].filter(value => value <= maxAmount); const formatAxis = value => { if (value === 0) return "$0"; if (value >= 1e9) return `$${value / 1e9}B`; if (value >= 1e6) return `$${value / 1e6}M`; return `$${value / 1e3}K`; }; const formatMoney = d3.format("$,.0f"); // -------------------------------------------------- // 3. Country classification and colors // -------------------------------------------------- const getCategory = d => d.net_donated_usd > 0 ? "Net donor" : d.net_donated_usd < 0 ? "Net recipient" : "Balanced"; const colorScale = d3.scaleOrdinal() .domain(["Net donor", "Net recipient", "Balanced"]) .range(["#2563eb", "#ea580c", "#64748b"]); // -------------------------------------------------- // 4. Create SVG and title // -------------------------------------------------- const svg = d3.create("svg") .attr("width", width) .attr("height", height) .attr("viewBox", `0 0 ${width} ${height}`) .style("background", "white") .style("font-family", "Arial, sans-serif"); svg.append("text") .attr("x", margin.left) .attr("y", 32) .attr("font-size", 21) .attr("font-weight", "bold") .attr("fill", "#111827") .text("Aid Commitments: Donated vs. Received"); const yearExtent = d3.extent(aiddata_valid, d => d.year); svg.append("text") .attr("x", margin.left) .attr("y", 55) .attr("font-size", 12) .attr("fill", "#6b7280") .text( `${yearExtent[0]}–${yearExtent[1]} | Each point represents one country` ); const plot = svg.append("g") .attr( "transform", `translate(${margin.left},${margin.top})` ); // -------------------------------------------------- // 5. Gridlines and reference line // -------------------------------------------------- plot.append("g") .call( d3.axisLeft(yScale) .tickValues(axisTicks) .tickSize(-plotWidth) .tickFormat("") ) .call(g => g.select(".domain").remove()) .call(g => g.selectAll(".tick line") .attr("stroke", "#e5e7eb")); // Equality line: total donated = total received plot.append("line") .attr("x1", xScale(0)) .attr("y1", yScale(0)) .attr("x2", xScale(maxAmount)) .attr("y2", yScale(maxAmount)) .attr("stroke", "#6b7280") .attr("stroke-width", 1.5) .attr("stroke-dasharray", "5,5"); // -------------------------------------------------- // 6. Plot countries // -------------------------------------------------- const points = plot.selectAll("circle.country") .data(country_totals) .join("circle") .attr("class", "country") .attr("cx", d => xScale(d.received_usd)) .attr("cy", d => yScale(d.donated_usd)) .attr("r", 5) .attr("fill", d => colorScale(getCategory(d))) .attr("fill-opacity", 0.78) .attr("stroke", "white") .attr("stroke-width", 0.8); // Hover tooltip with exact financial totals points.append("title") .text(d => `${d.country}\n` + `Donated: ${formatMoney(d.donated_usd)}\n` + `Received: ${formatMoney(d.received_usd)}\n` + `Net donated: ${formatMoney(d.net_donated_usd)}` ); // -------------------------------------------------- // 7. Label countries with the largest imbalances // -------------------------------------------------- const topDonors = country_totals .filter(d => d.net_donated_usd > 0) .sort((a, b) => d3.descending(a.net_donated_usd, b.net_donated_usd)) .slice(0, 2) .map((d, i) => ({ ...d, labelDy: 19 + i * 12 })); const topRecipients = country_totals .filter(d => d.net_donated_usd < 0) .sort((a, b) => d3.ascending(a.net_donated_usd, b.net_donated_usd)) .slice(0, 2) .map((d, i) => ({ ...d, labelDy: -12 - i * 20 })); plot.selectAll("text.country-label") .data([...topDonors, ...topRecipients]) .join("text") .attr("class", "country-label") .attr("x", d => xScale(d.received_usd) + (d.net_donated_usd > 0 ? 9 : -9) ) .attr("y", d => yScale(d.donated_usd) + d.labelDy ) .attr("text-anchor", d => d.net_donated_usd > 0 ? "start" : "end" ) .attr("font-size", 11) .attr("font-weight", "bold") .attr("fill", "#374151") .text(d => d.country); // -------------------------------------------------- // 8. Axes and axis labels // -------------------------------------------------- plot.append("g") .attr("transform", `translate(0,${plotHeight})`) .call( d3.axisBottom(xScale) .tickValues(axisTicks) .tickFormat(formatAxis) ); plot.append("g") .call( d3.axisLeft(yScale) .tickValues(axisTicks) .tickFormat(formatAxis) ); svg.append("text") .attr("x", margin.left + plotWidth / 2) .attr("y", height - 43) .attr("text-anchor", "middle") .attr("font-size", 13) .attr("font-weight", "bold") .attr("fill", "#374151") .text("Total Commitments Received (USD)"); svg.append("text") .attr( "transform", `translate(25,${margin.top + plotHeight / 2}) rotate(-90)` ) .attr("text-anchor", "middle") .attr("font-size", 13) .attr("font-weight", "bold") .attr("fill", "#374151") .text("Total Commitments Donated (USD)"); // -------------------------------------------------- // 9. Legend // -------------------------------------------------- const legend = svg.append("g") .attr( "transform", `translate(${margin.left + plotWidth + 22},${margin.top + 25})` ); const categories = [ "Net donor", "Net recipient", "Balanced" ].filter(category => country_totals.some(d => getCategory(d) === category) ); const legendItems = legend.selectAll("g.legend-item") .data(categories) .join("g") .attr("class", "legend-item") .attr("transform", (d, i) => `translate(0,${i * 27})`); legendItems.append("circle") .attr("cx", 5) .attr("cy", 0) .attr("r", 5) .attr("fill", d => colorScale(d)); legendItems.append("text") .attr("x", 17) .attr("y", 4) .attr("font-size", 12) .attr("fill", "#374151") .text(d => d); legend.append("line") .attr("x1", 0) .attr("x2", 23) .attr("y1", 105) .attr("y2", 105) .attr("stroke", "#6b7280") .attr("stroke-dasharray", "5,4"); legend.append("text") .attr("x", 0) .attr("y", 124) .attr("font-size", 11) .attr("fill", "#6b7280") .text("Equal donated / received"); // -------------------------------------------------- // 10. Scale note // -------------------------------------------------- svg.append("text") .attr("x", margin.left) .attr("y", height - 12) .attr("font-size", 11) .attr("fill", "#6b7280") .text("Both axes use symmetric logarithmic scales to show large financial differences while retaining countries with zero commitments."); return svg.node(); } 42:T83f, ### Written Analysis - **Overall pattern:** The scatter plot shows a noticeable difference between countries that mainly donate and those that mainly receive financial aid. Most countries fall clearly above or below the equality line, suggesting that their financial commitments are not evenly balanced. - **Major donors:** The United States and Japan stand out as the largest net donors, with approximately $116.07 billion and $112.10 billion in net commitments, respectively. Germany also has a substantial positive balance of around $47.22 billion, with very little aid received. - **Major recipients:** India has the largest negative balance, receiving approximately $133.98 billion with no recorded donations. Thailand and Brazil show similar patterns, receiving around $49.04 billion and $36.61 billion while contributing comparatively small amounts. - **Countries with a more balanced involvement:** Canada is an interesting example, having donated around $7.47 billion and received $4.07 billion. Unlike the countries at the extremes, it participates considerably in both directions. ### Thought Process I chose a scatter plot because I wanted to compare how much each country donates and receives in the same view, rather than using separate charts for the two amounts. The dashed diagonal represents equal donated and received commitments, making it easy to identify net donors above the line and net recipients below it. One challenge was the huge difference in financial amounts, ranging from zero to over $100 billion, so I used symmetric logarithmic scales on both axes to keep smaller values visible without losing the larger ones. I also used blue for net donors and orange for net recipients to make the two groups easier to distinguish. Instead of labeling every point and overcrowding the chart, I highlighted the countries with the largest imbalances and added tooltips for checking exact values. Although the nonlinear scales make it harder to estimate differences directly from the axes, I think this design works well for identifying overall patterns and countries that stand out. 43:T4ad,country_geo_data = { // Match country names from AidData to World Atlas names const financialData = new Map( country_totals.map(d => [ country_name_aliases[d.country] ?? d.country, d ]) ); // Convert TopoJSON boundaries to GeoJSON features const features = topojson.feature( world_atlas, world_atlas.objects.countries ).features; // Attach financial information to each country return features.map(feature => { const countryName = feature.properties.name; const record = financialData.get(countryName); const donated = record?.donated_usd ?? null; const received = record?.received_usd ?? null; const total = record ? donated + received : null; // Balance ranges from -1 (recipient) to +1 (donor) const balance = total > 0 ? Math.max(-1, Math.min(1, (donated - received) / total)) : null; return { ...feature, properties: { ...feature.properties, aid_country: record?.country ?? null, donated_usd: donated, received_usd: received, net_donated_usd: record?.net_donated_usd ?? null, balance_score: balance } }; }); }44:T1a87, viz2_map = { // ================================================== // 1. Chart dimensions // ================================================== const width = 900; const height = 540; // ================================================== // 2. Geographic projection and path generator // ================================================== const projection = d3.geoNaturalEarth1() .fitExtent( [[25, 90], [width - 25, 435]], {type: "Sphere"} ); const path = d3.geoPath(projection); // ================================================== // 3. Diverging color scale // Orange = net recipient // Blue = net donor // ================================================== const colorScale = d3.scaleDiverging(t => t < 0.5 ? d3.interpolateRgb("#ea580c", "#f8fafc")(t * 2) : d3.interpolateRgb("#f8fafc", "#2563eb")((t - 0.5) * 2) ) .domain([-1, 0, 1]) .clamp(true); const noDataColor = "#cbd5e1"; const formatMoney = d3.format("$,.0f"); const formatBalance = d3.format("+.2f"); // ================================================== // 4. Create SVG and title // ================================================== const svg = d3.create("svg") .attr("width", width) .attr("height", height) .attr("viewBox", `0 0 ${width} ${height}`) .style("font-family", "Arial, sans-serif"); svg.append("text") .attr("x", width / 2) .attr("y", 34) .attr("text-anchor", "middle") .attr("font-size", 22) .attr("font-weight", "bold") .attr("fill", "#111827") .text("Geographical Patterns of Financial Aid"); svg.append("text") .attr("x", width / 2) .attr("y", 59) .attr("text-anchor", "middle") .attr("font-size", 12) .attr("fill", "#64748b") .text( "1973–2013 | Normalized balance of donated and received commitments" ); // ================================================== // 5. Ocean background and geographic grid // ================================================== svg.append("path") .datum({type: "Sphere"}) .attr("d", path) .attr("fill", "#f8fafc") .attr("stroke", "#cbd5e1") .attr("stroke-width", 0.8); svg.append("path") .datum(d3.geoGraticule10()) .attr("d", path) .attr("fill", "none") .attr("stroke", "#e2e8f0") .attr("stroke-width", 0.5); // ================================================== // 6. Draw countries using normalized aid balance // ================================================== const countries = svg.append("g") .attr("class", "countries"); const countryPaths = countries.selectAll("path") .data(country_geo_data) .join("path") .attr("d", path) .attr("fill", d => d.properties.balance_score === null ? noDataColor : colorScale(d.properties.balance_score) ) .attr("stroke", "#ffffff") .attr("stroke-width", 0.45) .attr("stroke-linejoin", "round"); // ================================================== // 7. Tooltips with country financial information // ================================================== countryPaths.append("title") .text(d => { const p = d.properties; if (p.balance_score === null) { return `${p.name}\nNo matched financial data`; } const category = p.balance_score > 0 ? "Net donor" : p.balance_score < 0 ? "Net recipient" : "Balanced"; return ( `${p.aid_country}\n` + `Status: ${category}\n` + `Donated: ${formatMoney(p.donated_usd)}\n` + `Received: ${formatMoney(p.received_usd)}\n` + `Net donated: ${formatMoney(p.net_donated_usd)}\n` + `Balance score: ${formatBalance(p.balance_score)}` ); }); // ================================================== // 8. Draw borders between neighboring countries // ================================================== const borders = topojson.mesh( world_atlas, world_atlas.objects.countries, (a, b) => a !== b ); svg.append("path") .datum(borders) .attr("d", path) .attr("fill", "none") .attr("stroke", "#94a3b8") .attr("stroke-width", 0.35) .attr("pointer-events", "none"); // ================================================== // 9. Continuous color legend // ================================================== const legendWidth = 400; const legendHeight = 15; const legendX = (width - legendWidth) / 2; const legendY = 462; // Define a smooth gradient matching the color scale const defs = svg.append("defs"); const gradient = defs.append("linearGradient") .attr("id", "aid-balance-gradient") .attr("x1", "0%") .attr("x2", "100%") .attr("y1", "0%") .attr("y2", "0%"); gradient.selectAll("stop") .data(d3.range(0, 1.001, 0.025)) .join("stop") .attr("offset", d => `${d * 100}%`) .attr("stop-color", d => colorScale(2 * d - 1)); svg.append("rect") .attr("x", legendX) .attr("y", legendY) .attr("width", legendWidth) .attr("height", legendHeight) .attr("fill", "url(#aid-balance-gradient)") .attr("stroke", "#cbd5e1") .attr("stroke-width", 0.5); // Legend tick values const legendScale = d3.scaleLinear() .domain([-1, 1]) .range([legendX, legendX + legendWidth]); svg.append("g") .attr("transform", `translate(0,${legendY + legendHeight})`) .call( d3.axisBottom(legendScale) .tickValues([-1, -0.5, 0, 0.5, 1]) .tickFormat(d3.format("+.1f")) .tickSize(5) ) .call(g => g.select(".domain").remove()) .call(g => g.selectAll("text") .attr("font-size", 11) .attr("fill", "#475569")); // Legend category labels svg.append("text") .attr("x", legendX) .attr("y", 515) .attr("font-size", 11) .attr("fill", "#ea580c") .text("Mostly receiving"); svg.append("text") .attr("x", width / 2) .attr("y", 515) .attr("text-anchor", "middle") .attr("font-size", 11) .attr("fill", "#475569") .text("Balanced"); svg.append("text") .attr("x", legendX + legendWidth) .attr("y", 515) .attr("text-anchor", "end") .attr("font-size", 11) .attr("fill", "#2563eb") .text("Mostly donating"); // No-data note svg.append("rect") .attr("x", 25) .attr("y", 465) .attr("width", 13) .attr("height", 13) .attr("fill", noDataColor) .attr("stroke", "#cbd5e1"); svg.append("text") .attr("x", 45) .attr("y", 476) .attr("font-size", 11) .attr("fill", "#64748b") .text("No matched data"); // ================================================== // 10. Return the completed SVG // ================================================== return svg.node(); } 45:T72d, map_neighbor_contrasts = { // Find neighboring countries from shared map boundaries const neighborIndices = topojson.neighbors( world_atlas.objects.countries.geometries ); const contrastingPairs = []; // Compare each pair of adjacent countries neighborIndices.forEach((neighbors, i) => { neighbors.forEach(j => { // Avoid counting the same pair twice if (i >= j) return; const countryA = country_geo_data[i].properties; const countryB = country_geo_data[j].properties; // Both countries must have financial data if ( countryA.balance_score === null || countryB.balance_score === null ) return; // Identify pairs with opposite donor-recipient patterns if (countryA.balance_score * countryB.balance_score >= 0) { return; } contrastingPairs.push({ country_a: countryA.aid_country, pattern_a: countryA.balance_score > 0 ? "Net donor" : "Net recipient", balance_a: countryA.balance_score, country_b: countryB.aid_country, pattern_b: countryB.balance_score > 0 ? "Net donor" : "Net recipient", balance_b: countryB.balance_score, // Larger differences indicate stronger contrasts balance_difference: Math.abs( countryA.balance_score - countryB.balance_score ), combined_commitments_usd: countryA.donated_usd + countryA.received_usd + countryB.donated_usd + countryB.received_usd }); }); }); // Rank by contrast, then by overall financial activity return contrastingPairs.sort((a, b) => d3.descending(a.balance_difference, b.balance_difference) || d3.descending( a.combined_commitments_usd, b.combined_commitments_usd ) ); } 46:Taab, ### Written Analysis - **Overall geographical pattern:** The map shows that countries with similar donation patterns do tend to cluster in certain regions, although this is not consistent everywhere. Western and Northern Europe have a noticeable concentration of net donors, while several countries in Central and Eastern Europe are primarily recipients. - **Patterns across other regions:** In Asia, Japan stands out as a strong net donor, whereas India and Thailand are heavily oriented toward receiving commitments. Similarly, Brazil, Colombia, and Chile appear as net recipients in South America. These patterns suggest geographical differences in how countries participate in development finance, although many countries are not represented in the dataset. - **Contrasting neighboring countries:** One of the clearest differences is between Germany and Poland. Germany has a balance score close to +1, indicating that almost all its recorded financial activity is outgoing, whereas Poland has a score close to -1, indicating the opposite. Germany and the Czech Republic show a similarly strong contrast despite sharing a border. - **Other interesting differences:** The United Kingdom and Ireland also have noticeably different patterns, with balance scores of approximately +0.92 and -0.52, respectively. This shows that even neighboring countries within the same geographical region can have quite different roles in development finance. ### Thought Process I chose a choropleth map because the question focuses on geographical patterns, and coloring countries directly makes it easier to identify regional clusters and differences across borders. Instead of using the raw difference between donated and received amounts, I calculated a normalized balance by dividing the net amount by the total financial activity of each country. This gives values between -1 and +1, allowing us to compare countries based on whether they primarily donate or receive, without larger economies dominating the color scale. I used a diverging orange-to-blue color scale, keeping the same color association as Visualization 1, with lighter shades representing more balanced commitments and gray indicating countries without matched data. I also added country borders, a continuous legend, and tooltips showing the actual financial amounts to make the map easier to interpret. One limitation is that normalization does not show the overall size of a country's commitments, so two countries with very different financial totals can appear similarly colored. However, I think this approach works better for this question because the main goal is to compare geographical patterns rather than rank countries by the amount of money involved. 47:T75a, purpose_country = { // -------------------------------------------------- // 1. Select the top five purpose codes // -------------------------------------------------- const selectedCodes = new Set( top5_purposes.map(d => d.purpose_code) ); // -------------------------------------------------- // 2. Aggregate by purpose code and recipient // -------------------------------------------------- const purposeTotals = d3.rollup( aiddata_valid.filter(d => selectedCodes.has(d.coalesced_purpose_code) ), records => ({ count: records.length, amount_usd: d3.sum( records, d => d.commitment_amount_usd_constant ) }), d => d.coalesced_purpose_code, d => d.recipient ); // -------------------------------------------------- // 3. Get countries with recorded incoming aid // -------------------------------------------------- const recipientCountries = country_totals.filter( d => d.received_usd > 0 ); // -------------------------------------------------- // 4. Combine purpose amounts and country totals // -------------------------------------------------- return top5_purposes.flatMap(purpose => recipientCountries.map(country => { const record = purposeTotals .get(purpose.purpose_code) ?.get(country.country); const amount = record?.amount_usd ?? 0; const count = record?.count ?? 0; return { purpose_code: purpose.purpose_code, purpose: purpose.purpose, country: country.country, map_name: country_name_aliases[country.country] ?? country.country, commitment_count: count, purpose_amount_usd: amount, total_received_usd: country.received_usd, share_of_receipts: amount / country.received_usd }; }) ); } 48:T50d,country_regions = { // Match geographic regions using ISO numeric country IDs const regionsById = new Map( country_codes .filter(d => d["ISO3166-1-numeric"] && d["Region Name"]) .map(d => [ String(Number(d["ISO3166-1-numeric"])), d["Region Name"] ]) ); // Alternative matching for small countries absent from World Atlas const regionsByName = new Map(); country_codes.forEach(d => { [ d["CLDR display name"], d["official_name_en"] ].forEach(name => { if (name) regionsByName.set(name, d["Region Name"]); }); }); const featuresByCountry = new Map( country_geo_data .filter(d => d.properties.aid_country) .map(d => [d.properties.aid_country, d]) ); return country_totals .filter(d => d.received_usd > 0) .map(d => { const feature = featuresByCountry.get(d.country); const region = (feature?.id != null ? regionsById.get(String(Number(feature.id))) : null) ?? regionsByName.get(d.country) ?? regionsByName.get( country_name_aliases[d.country] ?? d.country ) ?? "Unmatched"; return { country: d.country, region, total_received_usd: d.received_usd }; }); }49:T2d22, viz3_bar_charts = { // ================================================== // 1. Chart dimensions and layout // ================================================== const width = 940; const panelWidth = 900; const panelHeight = 315; const panelGap = 18; const panelStartY = 120; const plotLeft = 205; const plotTop = 68; const plotWidth = 560; const plotHeight = 200; const topN = 10; const height = panelStartY + top5_purposes.length * panelHeight + (top5_purposes.length - 1) * panelGap + 58; // ================================================== // 2. Selected comparison metric // ================================================== const showShare = viz3_metric === "Share of country receipts (%)"; const getValue = d => showShare ? d.share_of_receipts : d.purpose_amount_usd; // ================================================== // 3. Geographic regions and colors // ================================================== const regionLookup = new Map( country_regions.map(d => [d.country, d.region]) ); const regionColors = { "Africa": "#16a34a", "Americas": "#2563eb", "Asia": "#f97316", "Europe": "#8b5cf6", "Oceania": "#db2777", "Unmatched": "#64748b" }; const getRegion = country => regionLookup.get(country) ?? "Unmatched"; const getColor = country => regionColors[getRegion(country)] ?? regionColors.Unmatched; // ================================================== // 4. Number formatting // ================================================== const formatMoney = d3.format("$,.0f"); const formatPercent = d3.format(".1%"); const formatCompact = value => { const abs = Math.abs(value); const sign = value < 0 ? "-" : ""; if (abs >= 1e9) return `${sign}$${(abs / 1e9).toFixed(2)}B`; if (abs >= 1e6) return `${sign}$${(abs / 1e6).toFixed(1)}M`; if (abs >= 1e3) return `${sign}$${(abs / 1e3).toFixed(1)}K`; return `${sign}$${abs.toFixed(0)}`; }; const formatValue = value => showShare ? formatPercent(value) : formatCompact(value); // ================================================== // 5. Create SVG and main heading // ================================================== const svg = d3.create("svg") .attr("width", width) .attr("height", height) .attr("viewBox", `0 0 ${width} ${height}`) .style("font-family", "Arial, sans-serif"); svg.append("text") .attr("x", width / 2) .attr("y", 32) .attr("text-anchor", "middle") .attr("font-size", 23) .attr("font-weight", "bold") .attr("fill", "#111827") .text("Top Recipient Countries by Aid Purpose"); svg.append("text") .attr("x", width / 2) .attr("y", 55) .attr("text-anchor", "middle") .attr("font-size", 12) .attr("fill", "#64748b") .text( "1973–2013 | Five most frequent purposes by commitment count" ); // ================================================== // 6. Region color legend // ================================================== const regions = [ "Africa", "Americas", "Asia", "Europe", "Oceania", "Unmatched" ].filter(region => country_regions.some(d => d.region === region) ); svg.append("text") .attr("x", 30) .attr("y", 91) .attr("font-size", 12) .attr("font-weight", "bold") .attr("fill", "#475569") .text("Bar color:"); const legend = svg.append("g") .attr("transform", "translate(120, 82)"); const legendItems = legend.selectAll("g.legend-item") .data(regions) .join("g") .attr("class", "legend-item") .attr("transform", (d, i) => `translate(${i * 125}, 0)` ); legendItems.append("rect") .attr("width", 13) .attr("height", 13) .attr("rx", 2) .attr("fill", d => regionColors[d]); legendItems.append("text") .attr("x", 20) .attr("y", 11) .attr("font-size", 12) .attr("fill", "#374151") .text(d => d); // ================================================== // 7. Draw five horizontal bar charts // ================================================== top5_purposes.forEach((purpose, index) => { // ---------------------------------------------- // Select and rank recipient countries // ---------------------------------------------- const allRecipients = purpose_country .filter(d => d.purpose === purpose.purpose && d.commitment_count > 0 ); const rankedRecipients = allRecipients .filter(d => getValue(d) >= 0) .sort((a, b) => d3.descending(getValue(a), getValue(b)) || d3.ascending(a.country, b.country) ) .slice(0, topN); // ---------------------------------------------- // Find the leading geographical region // using all recipients, not just the top ten // ---------------------------------------------- const regionTotals = d3.rollups( allRecipients, records => d3.sum( records, d => d.purpose_amount_usd ), d => getRegion(d.country) ).sort((a, b) => d3.descending(a[1], b[1]) ); const totalRegionalAmount = d3.sum( regionTotals, d => d[1] ); const leadingRegion = regionTotals[0]; // ---------------------------------------------- // Panel background and title // ---------------------------------------------- const panelY = panelStartY + index * (panelHeight + panelGap); const panel = svg.append("g") .attr( "transform", `translate(20, ${panelY})` ); panel.append("rect") .attr("width", panelWidth) .attr("height", panelHeight) .attr("rx", 9) .attr("fill", "#ffffff") .attr("stroke", "#dbe3ee"); panel.append("text") .attr("x", 20) .attr("y", 27) .attr("font-size", 17) .attr("font-weight", "bold") .attr("fill", "#111827") .text( `${index + 1}. ${purpose.purpose}` ); panel.append("text") .attr("x", 20) .attr("y", 48) .attr("font-size", 11) .attr("fill", "#64748b") .text( `${d3.format(",")(purpose.frequency)} commitments` + ` | ${formatCompact(purpose.total_amount_usd)} total` + ` | ${allRecipients.length} recipient countries` ); // ---------------------------------------------- // Linear X scale and categorical Y scale // ---------------------------------------------- const maxValue = Math.max( 1e-12, d3.max(rankedRecipients, getValue) ?? 0 ); const xScale = d3.scaleLinear() .domain([0, maxValue * 1.12]) .range([0, plotWidth]); const yScale = d3.scaleBand() .domain(rankedRecipients.map(d => d.country)) .range([0, plotHeight]) .paddingInner(0.24) .paddingOuter(0.1); const chart = panel.append("g") .attr( "transform", `translate(${plotLeft}, ${plotTop})` ); // ---------------------------------------------- // X-axis gridlines // ---------------------------------------------- const ticks = xScale.ticks(5); chart.selectAll("line.gridline") .data(ticks.filter(d => d > 0)) .join("line") .attr("class", "gridline") .attr("x1", d => xScale(d)) .attr("x2", d => xScale(d)) .attr("y1", 0) .attr("y2", plotHeight) .attr("stroke", "#e5e7eb") .attr("stroke-width", 1); // ---------------------------------------------- // Horizontal bars // ---------------------------------------------- const bars = chart.selectAll("rect.bar") .data(rankedRecipients) .join("rect") .attr("class", "bar") .attr("x", 0) .attr("y", d => yScale(d.country)) .attr("width", d => xScale(getValue(d))) .attr("height", yScale.bandwidth()) .attr("rx", 2) .attr("fill", d => getColor(d.country)) .attr("fill-opacity", 0.85); // ---------------------------------------------- // Interactive tooltips // ---------------------------------------------- bars.append("title") .text(d => `${d.country}\n` + `Region: ${getRegion(d.country)}\n` + `Purpose: ${purpose.purpose}\n` + `Number of commitments: ${d.commitment_count}\n` + `Amount received: ${formatMoney(d.purpose_amount_usd)}\n` + `Total aid received: ${formatMoney(d.total_received_usd)}\n` + `Share of all receipts: ${formatPercent(d.share_of_receipts)}` ); // ---------------------------------------------- // Country labels // ---------------------------------------------- chart.selectAll("text.country-label") .data(rankedRecipients) .join("text") .attr("class", "country-label") .attr("x", -12) .attr("y", d => yScale(d.country) + yScale.bandwidth() / 2 ) .attr("dy", "0.35em") .attr("text-anchor", "end") .attr("font-size", 11.5) .attr("fill", "#334155") .text(d => d.country); // ---------------------------------------------- // Exact values beside bars // ---------------------------------------------- chart.selectAll("text.value-label") .data(rankedRecipients) .join("text") .attr("class", "value-label") .attr("x", d => xScale(getValue(d)) + 7) .attr("y", d => yScale(d.country) + yScale.bandwidth() / 2 ) .attr("dy", "0.35em") .attr("font-size", 11) .attr("font-weight", "bold") .attr("fill", "#374151") .text(d => formatValue(getValue(d))); // ---------------------------------------------- // X-axis // ---------------------------------------------- chart.append("g") .attr( "transform", `translate(0, ${plotHeight})` ) .call( d3.axisBottom(xScale) .ticks(5) .tickFormat(formatValue) .tickSizeOuter(0) ) .call(g => g.selectAll("text") .attr("font-size", 10) .attr("fill", "#64748b") ); // ---------------------------------------------- // Regional summary below each plot // ---------------------------------------------- if (leadingRegion && totalRegionalAmount > 0) { panel.append("text") .attr("x", 20) .attr("y", panelHeight - 13) .attr("font-size", 11) .attr("fill", "#64748b") .text( `Largest regional share by amount: ` + `${leadingRegion[0]} ` + `(${formatPercent(leadingRegion[1] / totalRegionalAmount)})` ); } }); // ================================================== // 8. Footnote explaining scale and selection // ================================================== svg.append("text") .attr("x", width / 2) .attr("y", height - 32) .attr("text-anchor", "middle") .attr("font-size", 12) .attr("fill", "#64748b") .text( "Each chart has its own linear X-axis. " + "Compare values across charts using the labels." ); svg.append("text") .attr("x", width / 2) .attr("y", height - 13) .attr("text-anchor", "middle") .attr("font-size", 11) .attr("fill", "#64748b") .text( showShare ? "Percentages use each country's total receipts across all purposes." : "Amounts represent recorded financial commitments, not confirmed disbursements." ); return svg.node(); } 4a:Te9c, ### Written Analysis - **Overall distribution:** The five most frequent aid purposes show clear differences in where financial commitments are received. India appears among the largest recipients by amount across several categories, but it does not lead every purpose. For instance, Colombia receives the largest amount for social/welfare services, while South Africa leads in strengthening civil society. This suggests that different countries have different patterns of aid allocation. - **Geographical patterns:** There are also noticeable differences at the regional level. Asia accounts for approximately 69.2% of the funding under sectors not specified and 41.5% under higher education. On the other hand, the Americas receive around 76.2% of social/welfare commitments and 38.7% of strengthening civil society commitments. This shows that the distribution varies considerably depending on the purpose, rather than following the same geographical pattern across all five categories. - **Differences in relative importance:** Switching to the percentage view reveals patterns that are not as obvious from the dollar amounts. For example, sectors not specified account for 16.9% of the Czech Republic's total receipts, while Colombia receives 25.3% of its total commitments for social/welfare services. Higher education makes up 28.7% of the United States' recorded receipts and 21.0% of Slovenia's, while Hungary has the highest share for multisector aid at 6.7%. These differences suggest that certain purposes are relatively more important in some countries' aid portfolios, even when those countries are not the largest recipients by amount. - **Interpreting percentages carefully:** One interesting case is Germany, where social/welfare services account for 100% of its recorded receipts. However, Germany receives only around $60,000 in total commitments in this dataset, so the percentage is based on a very small amount. This highlights why it is important to consider both absolute funding and percentage shares rather than relying on either measure alone. - **Frequency versus funding:** The most frequent purpose does not necessarily receive the most money. Sectors not specified has 8,140 commitments totaling approximately $8.56 billion, whereas social/welfare services has fewer commitments (6,407) but a higher total of $9.53 billion. This shows that the frequency of commitments and their financial value can tell different stories. ### Thought Process I chose five separate horizontal bar charts because I wanted to compare recipient countries within each purpose without overcrowding a single chart. I ranked the top 10 countries in descending order and used a linear X-axis starting at zero, since comparing bar lengths makes differences in funding easier to judge. Each geographical region has a distinct color, with the same mapping across all five charts, so it is easier to notice which regions appear most frequently among the leading recipients. I also included exact values beside the bars and regional summaries to make the comparisons more informative. One design choice I found particularly useful was allowing the user to switch between total commitment amounts and the percentage of each country's overall receipts. The dollar view highlights where the largest amounts of funding go, while the percentage view helps identify countries where certain purposes make up a larger share of their aid. I used separate X-axis scales for each chart to keep smaller values visible, although this means bar lengths cannot be compared directly across purposes. Also, limiting the charts to the top 10 recipients leaves out some smaller countries, but I think this makes the main patterns much easier to read. 4b:[{"id":"09040dddbda03374a466600047ccbc70c46e6853884eb725db2141c566ca1b78fb7cc935096e8d5468c21e8df215e73fc49cdaaf7e2f1f89139793da25be02b2","href":"https://static.observableusercontent.com/files/09040dddbda03374a466600047ccbc70c46e6853884eb725db2141c566ca1b78fb7cc935096e8d5468c21e8df215e73fc49cdaaf7e2f1f89139793da25be02b2","name":"aiddata-countries-only.csv","type":"text/csv","lastModified":1793220360622,"size":8760387}] 38:{"id":"20e3c8e4177373c8","slug":"mini-project-1-geographic-financial-aid-due-oct-29th","title":"Mini-Project 1: Geographic Financial Aid (Due Oct. 29th)","thumbnail":"775e920cee927586fb7033a99fb568582dcaf1f3a722e9602ea226521cc2dee3","access_level":"public","create_time":"$D2026-10-28T20:06:56.220Z","update_time":"$D2026-10-29T15:13:48.476Z","view_time":null,"first_public_time":"$D2026-10-29T14:46:53.093Z","has_unpublished_edits":null,"fork":{"id":"e6fcea972bfc4543","slug":"2026-infovis-cse_project-1","title":"Mini-Project 1: Geographic Financial Aid (Due Oct. 29th)","owner":{"id":"3d6c0f5acd6a20a4","login":"rk2546","name":"rk2546"}},"stars":0,"starred":false,"owner":{"type":"team","id":"31796935448e8396","login":"swati-singh","name":"Swati Singh","avatar_url":"https://avatars-next.observableusercontent.com/aa0eb037c6af2ec7060abfe5d861b0235d3d5abc018ffe41d2a04a8f99bd2a16","tier":"starter_2024","bio":"","followed_by_you":false,"follows_you":false},"version":447,"publish_version":447,"role":null,"authored":false,"authors":[{"type":"individual","id":"a2af93fb39c4d44d","login":"swati-singh","name":"Swati Singh","avatar_url":"https://avatars-next.observableusercontent.com/aa0eb037c6af2ec7060abfe5d861b0235d3d5abc018ffe41d2a04a8f99bd2a16","tier":null,"bio":"","followed_by_you":false,"follows_you":false}],"members":[{"type":"team","id":"31796935448e8396","login":"swati-singh","name":"Swati Singh","avatar_url":"https://avatars-next.observableusercontent.com/aa0eb037c6af2ec7060abfe5d861b0235d3d5abc018ffe41d2a04a8f99bd2a16","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":"Mini-Project 1: Geographic Financial Aid (Due Oct. 29th)","cells":[{"id":0,"value":"# Mini-Project 1: Geographic Financial Aid (Due Oct. 29th)","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":27,"value":"import { css } from \"@rk2546/infovis-cse-backend\";","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":34,"value":"css","pinned":true,"hidden":false,"mode":"ts","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":62,"value":"---\n## Submission Instructions","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":32,"value":"$3c","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":6,"value":"---\n## About the Dataset","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":21,"value":"This spreadsheet is a simplified and reduced version of the AidData dataset. This dataset describes commitment information for over 1.5 million development finance activities funded between 1947 and 2013. The simplified dataset contains the following columns:\n\n- **`aiddata_id`**: unique ID of the commitment\n- **`aiddata_2_id`**: secondary unique ID\n- **`year`**: year of the commitment\n- **`donor`**: country providing the financial resource\n- **`recipient`**: country receiving the financial resource\n- **`commitment_amount_usd_constant`**: the total amount of financial resources provided\n- **`coalesced_purpose_code`**: categorization ID for the stated purpose of the commitment\n- **`coalesced_purpose_name`**: the purpose of the commitment","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":58,"value":"---\n## Questions","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":12,"value":"$3d","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":60,"value":"---\n## Grading Criteria","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":55,"value":"Your answers to each question are graded on the following qualities, with each question totaling up to **25 points**:\n\n- **[10pts]**: Does the visualization answer the questions posed in the exercise?\n- **[10pts]**: Does the written answer & discussion the questions posed in the exercise?\n- **[5pts]**: Is the visual representation clear? Does it have good aesthetics? If needed, you can review this notebook on clarity for reference.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":15,"value":"The questions above are a very useful tool for you to verify whether you are producing a good solution or not. As you go about completing this project, you can use the questions above as a self-evaluation tool in two main ways:\n\n1. Verify that you can indeed answer the questions with your visualization. If you can’t fully answer the questions, it means your solution has some problems.\n2. Compare multiple solutions to the same problem and ask yourself: “which one makes it easier for me to answer these questions?”, where easier may mean, more accurately, with less effort or faster.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":65,"value":"\n\n---","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":64,"value":"## Students' Workspace\n\n_From this point onward, you are free to modify the notebook in any way you see fit._","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":126,"value":"*Swati Singh*\n\n*ss20478*","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":56,"value":"## 1. Data Loading and Preprocessing","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":66,"value":"aiddata_raw = FileAttachment(\"aiddata-countries-only.csv\").csv()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":67,"value":"aiddata_raw.columns","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":78,"value":"### 1.1 Data Cleaning","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":68,"value":"$3e","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":69,"value":"aiddata_valid = aiddata_clean.filter(d =>\n d.donor !== null &&\n d.recipient !== null &&\n d.commitment_amount_usd_constant !== null\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":70,"value":"aiddata_preview = Inputs.table(aiddata_valid.slice(0, 15))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":79,"value":"### 1.2 Data Quality and Summary Statistics","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":71,"value":"$3f","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":72,"value":"Inputs.table(data_quality_summary)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":80,"value":"### 1.3 Country-Level Financial Aggregation","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":73,"value":"$40","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":74,"value":"country_totals_preview = Inputs.table(\n country_totals.slice(0, 15).map(d => ({\n Country: d.country,\n \"Donated (USD)\": d3.format(\",.0f\")(d.donated_usd),\n \"Received (USD)\": d3.format(\",.0f\")(d.received_usd),\n \"Net Donated (USD)\": d3.format(\",.0f\")(d.net_donated_usd)\n }))\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":81,"value":"### 1.4 Most Frequent Financial Aid Purposes","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":75,"value":"\npurpose_summary = d3.rollups(\n\n // Group by purpose CODE\n aiddata_valid.filter(d =>\n d.coalesced_purpose_code !== null\n ),\n\n records => {\n\n // Find the most commonly used name for this code\n const names = d3.rollups(\n records.filter(d =>\n d.coalesced_purpose_name !== null\n ),\n group => group.length,\n d => d.coalesced_purpose_name\n ).sort((a, b) => d3.descending(a[1], b[1]));\n\n return {\n purpose: names[0]?.[0] ?? \"Unknown purpose\",\n frequency: records.length,\n total_amount_usd: d3.sum(\n records,\n d => d.commitment_amount_usd_constant\n )\n };\n },\n\n d => d.coalesced_purpose_code\n\n).map(([code, values]) => ({\n purpose_code: code,\n purpose: values.purpose,\n frequency: values.frequency,\n total_amount_usd: values.total_amount_usd\n})).sort((a, b) =>\n d3.descending(a.frequency, b.frequency)\n)\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":76,"value":"top5_purposes = purpose_summary.slice(0, 5)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":77,"value":"Inputs.table(\n top5_purposes.map(d => ({\n Purpose: d.purpose,\n \"Number of Records\": d.frequency,\n \"Total Commitment (USD)\":\n d3.format(\",.0f\")(d.total_amount_usd)\n }))\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":82,"value":"### 1.5 Inspecting Unusual Financial Records","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":83,"value":"negative_commitments = Inputs.table(\n aiddata_valid.filter(\n d => d.commitment_amount_usd_constant < 0\n )\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":84,"value":"same_country_commitments = Inputs.table(\n aiddata_valid.filter(d => d.donor === d.recipient)\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":85,"value":"## 2. Visualization 1: Comparing Donations and Receipts","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":86,"value":"$41","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":87,"value":"$42","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":89,"value":"## Visualization 2 — Geographical Patterns of Aid Commitments","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":90,"value":"### 2.1 Loading Geographic Data","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":93,"value":"topojson = await import(\"https://cdn.jsdelivr.net/npm/topojson-client@3/+esm\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":94,"value":"world_atlas = d3.json(\n \"https://cdn.jsdelivr.net/npm/world-atlas@2/countries-110m.json\"\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":95,"value":"### 2.2 Matching Country Names","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":96,"value":"country_name_aliases = ({\n \"United States\": \"United States of America\",\n \"Korea\": \"South Korea\",\n \"South Korea\": \"South Korea\",\n \"Russian Federation\": \"Russia\",\n \"Czech Republic\": \"Czechia\",\n \"Slovak Republic\": \"Slovakia\",\n \"Viet Nam\": \"Vietnam\",\n \"Lao PDR\": \"Laos\",\n \"Lao People's Democratic Republic\": \"Laos\",\n \"Iran, Islamic Republic of\": \"Iran\",\n \"Syrian Arab Republic\": \"Syria\",\n \"Türkiye\": \"Turkey\",\n \"Ivory Coast\": \"Côte d'Ivoire\",\n \"Cote d'Ivoire\": \"Côte d'Ivoire\",\n \"Democratic Republic of the Congo\": \"Dem. Rep. Congo\",\n \"DR Congo\": \"Dem. Rep. Congo\",\n \"Republic of the Congo\": \"Congo\",\n \"Dominican Republic\": \"Dominican Rep.\",\n \"Central African Republic\": \"Central African Rep.\",\n \"Bosnia and Herzegovina\": \"Bosnia and Herz.\",\n \"North Macedonia\": \"Macedonia\",\n \"Eswatini\": \"eSwatini\",\n \"Swaziland\": \"eSwatini\"\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":97,"value":"$43","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":98,"value":"unmatched_map_countries = {\n\n const atlasNames = new Set(\n country_geo_data.map(d => d.properties.name)\n );\n\n return country_totals\n .filter(d => !atlasNames.has(\n country_name_aliases[d.country] ?? d.country\n ))\n .map(d => ({\n country: d.country,\n attempted_map_name:\n country_name_aliases[d.country] ?? d.country,\n donated_usd: d.donated_usd,\n received_usd: d.received_usd\n }));\n\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":99,"value":"Inputs.table(unmatched_map_countries)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":100,"value":"### 2.3 Geographical Distribution of Net Donors and Recipients","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":101,"value":"$44","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":102,"value":"### 2.4 Comparing Neighboring Countries","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":103,"value":"$45","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":104,"value":"Inputs.table(\n map_neighbor_contrasts.slice(0, 12).map(d => ({\n \"Country A\": d.country_a,\n \"Pattern A\": d.pattern_a,\n \"Balance A\": d.balance_a.toFixed(2),\n \"Country B\": d.country_b,\n \"Pattern B\": d.pattern_b,\n \"Balance B\": d.balance_b.toFixed(2),\n \"Difference\": d.balance_difference.toFixed(2)\n }))\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":105,"value":"$46","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":106,"value":"## Visualization 3","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":108,"value":"### 3.1 Aggregating Aid Purposes by Recipient Country","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":109,"value":"$47","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":110,"value":"### 3.2 Select the Geographic Comparison Metric","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":111,"value":"viewof viz3_metric = Inputs.radio(\n [\n \"Total commitments (USD)\",\n \"Share of country receipts (%)\"\n ],\n {\n label: \"Color countries by\",\n value: \"Total commitments (USD)\"\n }\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":112,"value":"### 3.3 Geographic Distribution of the Five Most Frequent Aid Purposes","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":121,"value":"country_codes = d3.csv(\n \"https://raw.githubusercontent.com/datasets/country-codes/master/data/country-codes.csv\"\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":122,"value":"$48","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":120,"value":"$49","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":114,"value":"### 3.4 Comparing the Leading Recipient Countries by Purpose","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":115,"value":"\nviz3_purpose_findings = top5_purposes.map(purpose => {\n\n const records = purpose_country.filter(d =>\n d.purpose === purpose.purpose &&\n d.commitment_count > 0\n );\n\n // Country receiving the largest absolute amount\n const largestAmount = d3.greatest(\n records,\n d => d.purpose_amount_usd\n );\n\n // Country with the highest share of its incoming aid\n // allocated to this purpose\n const largestShare = d3.greatest(\n records,\n d => d.share_of_receipts\n );\n\n return {\n\n purpose: purpose.purpose,\n\n frequency: purpose.frequency,\n\n recipient_countries: records.length,\n\n largest_amount_country: largestAmount?.country ?? null,\n\n largest_amount_usd:\n largestAmount?.purpose_amount_usd ?? null,\n\n largest_share_country: largestShare?.country ?? null,\n\n largest_share_percent:\n largestShare\n ? 100 * largestShare.share_of_receipts\n : null,\n\n largest_share_country_total_usd:\n largestShare?.total_received_usd ?? null\n\n };\n})\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":116,"value":"Inputs.table(\n viz3_purpose_findings.map(d => ({\n Purpose: d.purpose,\n \"Total Records\": d.frequency,\n \"Recipient Countries\": d.recipient_countries,\n \"Largest Amount Received By\": d.largest_amount_country,\n \"Largest Amount (USD)\":\n d3.format(\"$,.0f\")(d.largest_amount_usd),\n \"Highest Share In\": d.largest_share_country,\n \"Highest Share\":\n d.largest_share_percent.toFixed(1) + \"%\",\n \"That Country's Total Receipts (USD)\":\n d3.format(\"$,.0f\")(\n d.largest_share_country_total_usd\n )\n }))\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":123,"value":"$4a","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":125,"value":"\n## Data Sources\n\n- **World boundaries:** [World Atlas TopoJSON (110m)](https://cdn.jsdelivr.net/npm/world-atlas@2/countries-110m.json)\n- **Geographical regions:** [Country Codes Dataset](https://github.com/datasets/country-codes)\n\nAll data cleaning, aggregation, and transformations were performed in JavaScript within this Observable notebook.\n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":124,"value":"## AI Use Declaration\n\nI used AI to assist with the code for this assignment. I have reviewed the submitted work, understand the implementation, and can explain the code, design decisions, and findings.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W4b","stdlib":"2"}} 33:null