2c:null 2d:["$","title",null,{"children":"Mini-Project 1: Geographic Financial Aid | NYU | Observable"}] 32:T601,## Submission Instructions: 1. You are free to either **fork this notebook** or **create your own notebook** for this mini-project. Ensure that: - The notebook is made _public_ in the settings. - That you include the following details inside of your submission at or near the top of the notebook: 1) _NetID_, 2) _Name_, and 3) _Notebook URL_. **You will get a ZERO if you do not include these details!** 2. Complete each question to the best of your ability, clearly marking which visualization and/or written answer corresponds to which question asked. - Your coded solutions **must use D3**. Other visualization libraries (.e.g Vega-Lite) 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](https://observablehq.com/@d3/color-legend) notebook to create your legends. 3. Export a `.tgz` of your completed notebook and upload it to the correct Assignment on Brightspace. This mini-project is due November 6 @ 11:59pm.

[NOTE]: Please make sure to Read ALL instructions carefully for each part of this assignment; the code should try to match exactly the requirements specified!

[NOTE]: Please make sure that your NOTEBOOK URL link correctly links to your noteook, alongside your Name and NetID, before submitting!

33:T697,## Questions Your goal is to create 3 independent visualizations of the same data set, 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 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.

34:T659,donationData = { const countryToContinent = { "Saudi Arabia": "Asia", "Kuwait": "Asia", "Qatar": "Asia", "Thailand": "Asia", "Japan": "Asia", "Korea": "Asia", "India": "Asia", "Taiwan": "Asia", "United Arab Emirates": "Asia", "Estonia": "Europe", "Hungary": "Europe", "Liechtenstein": "Europe", "Slovak Republic": "Europe", "Monaco": "Europe", "Belgium": "Europe", "Austria": "Europe", "Italy": "Europe", "Germany": "Europe", "Sweden": "Europe", "Luxembourg": "Europe", "Spain": "Europe", "Denmark": "Europe", "France": "Europe", "Norway": "Europe", "Portugal": "Europe", "Switzerland": "Europe", "United Kingdom": "Europe", "Finland": "Europe", "Ireland": "Europe", "Greece": "Europe", "Netherlands": "Europe", "Cyprus": "Europe", "Czech Republic": "Europe", "Slovenia": "Europe", "Iceland": "Europe", "Poland": "Europe", "Lithuania": "Europe", "Romania": "Europe", "Latvia": "Europe", "United States": "North America", "Canada": "North America", "Brazil": "South America", "Colombia": "South America", "Chile": "South America", "Australia": "Oceania", "New Zealand": "Oceania", "South Africa": "Africa" }; // build and return array return Array.from(countries, country => { const donated = donatedByCountry.get(country) ?? 0; const received = receivedByCountry.get(country) ?? 0; return { country, donated, received, player: donated + received, net_donate: donated - received, net_donor: donated > received ? 1 : 0, continent: countryToContinent[country] || "Unknown" }; }); } 35:T1134,oecd_interactive = { const width = 900; const height = 500; const margins = { top: 40, right: 100, bottom: 40, left: 110 }; //sort by total aid activity (donation + receiving) const data = donationData .slice() .sort((a, b) => d3.ascending(a.player,b.player)); const maxTotal = d3.max(data, d => d.player); const svg = d3.create("svg") .attr("width", width + margins.left + margins.right) .attr("height", height + margins.top + margins.bottom); const g = svg.append("g") .attr("transform", `translate(${margins.left}, ${margins.top})`); //use log scale to manage the large spread in data const x = d3.scaleLog() .domain([1, maxTotal * 10]) .range([0, width]); const y = d3.scaleBand() .domain(data.map(d => d.country)) .range([height, 0]) .padding(0.15); const formatValue = d => { const ad = Math.abs(d); if (ad >= 1e9) return (d / 1e9).toFixed(1) + "B"; if (ad >= 1e6) return (d / 1e6).toFixed(1) + "M"; if (ad >= 1e3) return (d / 1e3).toFixed(1) + "K"; return d; }; g.selectAll("rect.total") .data(data) .join("rect") .attr("class", "total") .attr("y", d => y(d.country)) .attr("x", 0) .attr("height", y.bandwidth()) .attr("width", d => x(d.player)) .attr("fill", "#e5e7eb"); const netBars = g.selectAll("rect.net") .data(data) .join("rect") .attr("class", "net") .attr("y", d => y(d.country) + y.bandwidth() * 0.15) .attr("height", y.bandwidth() * 0.8) .attr("x", 0) .attr("fill", d => (d.net_donate) >= 0 ? "#d62728" : "#1f77b4").attr("opacity",0.7) const valueLabels = g.selectAll("text.value") .data(data) .join("text") .attr("class", "value") .attr("y", d => y(d.country) + y.bandwidth() / 2 + 4) .style("font-size", "10px") .attr("text-anchor", "start"); g.append("g").call(d3.axisLeft(y)); g.append("g") .attr("transform", `translate(0, ${height})`) .call( d3.axisBottom(x) .ticks(6) .tickFormat(d => { const ad = Math.abs(d); if (ad >= 1e9) return (d / 1e9).toFixed(1) + "B"; if (ad >= 1e6) return (d / 1e6).toFixed(1) + "M"; if (ad >= 1e3) return (d / 1e3).toFixed(1) + "K"; return d; }) ); //Titles g.append("text") .attr("x", width / 2) .attr("y", height + margins.bottom - 5) .attr("text-anchor", "middle") .style("font-size", "12px") .style("font-weight", "bold") .text("Aid Activity (log scale, USD)"); g.append("text") .attr("transform", "rotate(-90)") .attr("x", -height / 2) .attr("y", -margins.left + 20) .attr("text-anchor", "middle") .style("font-size", "12px") .style("font-weight", "bold") .text("Country"); g.append("text") .attr("x", width / 2) .attr("y", -15) .attr("text-anchor", "middle") .style("font-weight", 700) .text("Total Aid Activity and Net Aid position"); const legend = g.append("g") .attr("transform", `translate(${width - 180}, ${height - 60})`); const legendData = [ { label: "Net donor (Donated - Received > 0)", color: "#d62728" }, { label: "Net receiver (Donated - Received < 0)", color: "#1f77b4" }, { label: "Total activity (Donated + Received)", color: "#e5e7eb" } ]; legend.selectAll("rect.leg") .data(legendData) .join("rect") .attr("class", "leg") .attr("x", 0) .attr("y", (d, i) => i * 16) .attr("width", 10) .attr("height", 10) .attr("fill", d => d.color); legend.selectAll("text.leg") .data(legendData) .join("text") .attr("class", "leg") .attr("x", 16) .attr("y", (d, i) => i * 16 + 9) .text(d => d.label) .style("font-size", "11px"); const update = () => { const show = changeDisplay; netBars .transition() .duration(250) .attr("width", d => { if (show === "Remove Net Position") return 0; const net = Math.abs(d.net_donate); const total = d.player; return x(Math.min(net, total)); }); valueLabels .text(d => { const val = (show === "Remove Net Position") ? d.player : d.net_donate; return formatValue(val); }) .attr("x", d => x(d.player) + 4); }; update(); viewof changeDisplay.addEventListener("input", update); return svg.node(); } 36:T178f,# **Aid Flow Comparison Across Countries** ## 1. Description The visualisation presents two variables i.e. the total aid activity that a country engages in and their net position in terms of aid. Each country is represented by a base horizontal bar (grey) which shows the total aid activity of the country. This is the sum of the total aid donated and total aid received. The visualisation is also sorted in descending order of aid activity, therefore, the grey bars are in descending order and indicative of which countries engage in aid the most. To determine and compare if countries donate much more than they receive or vice-versa, I created a net position attribute which is calculated by total amount donated - total amount received. If a country donates more than it receives (net donor), it is represented with a red overlay and if it is a net receiver, it is represented through a blue overlay bar. This colour coding of red for excess outflow and blue for excess inflow creates more ready associations to a country being a donor or receiver. In this visualisation, I use a logarithmic scale for the x-axis due to large differences in aid values for certain countries. There is also an interactive toggle that allows switching between viewing *Total Activity* and *Net Position*, highlighting either overall aid involvement or directional imbalance. This dynamically changes the values presented on the chart as well. This design makes it easy to see both how active and in what direction each country participates in global aid. --- ## **2. Analysis and Interpretation** 1. The visualization reveals a striking contrast between wealthier donor nations and developing receiver nations, illustrating global inequality in aid flows. High-income countries such as the United States (116.1 B), Japan (112.1 B), and Germany (47.2 B) record some of the highest overall aid activities and act predominantly as net donors. Their red overlays almost completely cover their total activity bars, indicating that the aid they donate vastly exceeds what they receive. In contrast, developing nations such as India (–134.0 B), Thailand (–49.0 B), and Brazil (–36.6 B) also display high total aid activity but are predominantly net receivers. 2. Aid activity appears to correlate strongly with both economic size and global influence. Countries with very large economies or significant geopolitical reach like the United States, Japan, Germany, and India engage heavily in international aid and hence are positioned at the top of the graph. Regardless of being net donors or receivers, their international visibility is likely key in their participation in the aid network. 4. As we move down to total activity in the single-digit billions, a gradual shift emerges. Nations such as France, Italy, Sweden, and Kuwait show slightly more balanced aid patterns, where donated and received volumes are relatively closer in scale. These mid-tier or smaller high-income countries often operate both as donors and recipients probably depending on regional cooperation, development programs, or crisis responses. This indicates that beyond the top tier, aid dynamics become less polarized. 5. A pattern also emerges concerning country size and economic maturity. Smaller yet wealthy countries such as Luxembourg, Liechtenstein, UAE exhibit relatively low total aid activity but seem to be net receivers. This suggests that despite their wealth, possible other factors such as limited population size, smaller diplomatic networks, and lower development outreach constrain their role as major donors. Monaco stands out as a clear exception: while its total aid activity remains minimal, it is one of the few small nations to maintain a net donor position. Together, these trends highlight that economic scale and international reach, rather than wealth alone, determine the extent of a country’s participation and position in global aid dynamics. --- ## **3. Thought Process and Rationale** The main objective of this visualization was to explore how countries compare in terms of their global aid activity and to identify whether certain countries consistently act as net donors or net receivers. To answer this, I wanted a chart that could convey both magnitude and direction of aid flows within a single frame. I chose a horizontal bar chart because it effectively accommodates a large number of countries while keeping country labels readable. The logarithmic x-axis was used to capture the vast range in total aid activity spanning from thousands to hundreds of billions of dollars. This scaling allows meaningful comparison between both large and small economies. To highlight the contrast between donors and receivers, I overlaid two color-coded bars for each country. This dual-bar structure was intentional it allows the viewer to see not only how active a country is in aid transactions, but also in which direction that activity leans. For example, countries like the United States and Japan have high total aid volumes with dominant red overlay while some shorter overlays were indicative of total amount donated being closer to received but one side still being more dominant. An additional radio button toggle (“Show net position”) was incorporated to enhance interactivity and interpretability. When enabled, this overlay emphasizes only the net difference rather than total volumes, helping the viewer focus on which countries are giving or receiving disproportionately. This dynamic element encourages comparison from different analytical angles i.e. either assessing total activity or analysing the net position. Countries were sorted by total aid activity to emphasize how the scale of engagement correlates with net donor/receiver status and also to directly answer the question of how countries compare in terms of their overall receiving and donating activity. The final visualization thus represents comparative scale with directional interpretation, allowing patterns to emerge visually. 37:Taa1,world_map_zoom_mercator = { const width = 900; const height = 600; const marginTop = 100 const svg = d3.create("svg") .attr("width", width) .attr("height", height + marginTop); const projection = d3.geoMercator() .scale(150) .translate([width / 2, height / 1.5]); const path = d3.geoPath(projection); const world = await d3.json("https://cdn.jsdelivr.net/npm/world-atlas@2/countries-110m.json"); const countries = topojson.feature(world, world.objects.countries).features; const nameFix = { "United States": "United States of America", "Slovak Republic": "Slovakia", "Czech Republic": "Czechia" }; const valueByCountry = new Map( donationData.map(d => { const name = nameFix[d.country] || d.country; const net = d.net_donate; return [name, net]; }) ); const maxAbs = d3.max([...valueByCountry.values()].map(v => Math.abs(v))); const color = d3.scaleSqrt([-maxAbs, 0, maxAbs], ["#2b83ba", "#f7f7f7", "#d7191c"]); const mapLayer = svg.append("g").attr("transform", `translate(0, ${marginTop})`); mapLayer.selectAll("path") .data(countries) .join("path") .attr("d", path) .attr("fill", d => { const v = valueByCountry.get(d.properties.name); return v == null ? "#eee" : color(v); }) .attr("stroke", "#fff") .attr("stroke-width", 0.5) .append("title") .text(d => { const v = valueByCountry.get(d.properties.name); if (v == null) return d.properties.name + ": no data"; const abs = Math.abs(v); let formatted = v.toString(); if (abs >= 1e9) formatted = (v / 1e9).toFixed(1) + "B"; else if (abs >= 1e6) formatted = (v / 1e6).toFixed(1) + "M"; else if (abs >= 1e3) formatted = (v / 1e3).toFixed(1) + "K"; return `${d.properties.name}: ${formatted}`; }); const zoom = d3.zoom() .scaleExtent([1, 25]) .on("zoom", (event) => { mapLayer.attr("transform", event.transform); }); svg.call(zoom); svg.append("text") .attr("x", width / 2) .attr("y", 20) .attr("text-anchor", "middle") .attr("font-size", "18px") .attr("font-weight", "600") .attr("fill", "#333") .text("Global Net-Aid Activity"); const legend = Legend( color, { title: "Net donate vs receive", width: 300, tickFormat: v => { const abs = Math.abs(v); if (abs >= 1e9) return (v / 1e9).toFixed(1) + "B"; if (abs >= 1e6) return (v / 1e6).toFixed(1) + "M"; if (abs >= 1e3) return (v / 1e3).toFixed(1) + "K"; return v; } } ); svg.node().appendChild(legend); return svg.node(); } 38:T1139,# **Geographic Patterns in Aid Activity** ## 1. Description >This choropleth world map visualizes the net aid activity of countries, defined as the difference between aid donated and aid received. The color scale ranges from deep blue (net receivers) to deep red (net donors), with lighter shades representing smaller net differences. Each country is shaded according to its net aid position (in billions of USD), enabling spatial comparison of global aid patterns. Interactive tooltips display the specific country name and its corresponding net position value upon hover and a zoom feature allows users to clearly view regions across the world. Overall, the map provides a clear geographic overview of which regions contribute the most aid and which primarily receive it, while revealing any regional clusters or contrasting patterns in global aid dynamics. --- ## **2. Analysis and Interpretation** **Do the countries that mostly receive or mostly donate tend to cluster around specific geographical areas of the world?** >The map reveals distinct geographic clustering patterns in aid dynamics. North America, Western Europe, and East Asia are dominated by red hues highlighting major donor nations such as the United States, Germany, and Japan. These regions host some of the world’s largest economies and thus lead global aid contributions. In contrast, South Asia, South America, and parts of Africa are shaded in deep blue, highlighting key receiver countries such as India, Brazil, and South Africa. Their negative net aid positions signify that they receive substantially more aid than they donate. **Are there neighboring countries that have radically different patterns in terms of how much they receive vs. how much they donate?** >Certain regions display mixed behaviour among neighbours for example, within Europe, countries like France and Germany are net donors, while others such as Poland or Czech Republic lean toward net receivers despite geographic proximity and similar development status. This suggests that regional similarities do not necessarily equate to similar aid patterns, as national economies, foreign policies, and development priorities vary. Overall, the map emphasizes the global imbalance in aid flows, where a small cluster of nations contributes disproportionately to global aid while large parts of the developing world remain recipients. The spatial layout also subtly highlights a possible pattern between North and South where it seems like there is a higher concentration of development and wealth present in the northern hemisphere. --- ## **3. Thought Process and Rationale** The motivation behind this visualization was to move beyond individual country comparisons (as in the previous bar chart) and instead reveal spatial relationships and regional clustering in global aid dynamics. A choropleth world map was chosen because it intuitively conveys geographic distribution, allowing viewers to immediately identify regional clusters of trends and contrasts. The color scale from blue (net receiver) to red (net donor) was intentionally selected for intuitive interpretation (also maintains consistency with the previous visualization) as blue often connotes inflow or support, while red indicates outflow or contribution. This dual-color gradient visually reinforces the directionality of aid movement. Using a continuous scale rather than discrete categories allows for more easier comparison as countries with similar magnitudes of net aid positions appear in comparable shades, helping highlight gradients within regions (e.g., stronger red in the U.S. vs. lighter red in France). The ability to zoom on this visualization, allows users to have a detailed look into regions such as Europe where countries are relatively small and see specific country names and values through tooltips. This helps visualise the details without cluttering the overall map with text. The map projection (Mercator) was used to maintain geographic recognizability and consistent scaling across continents. Countries without available data were left greyed out, ensuring the viewer’s attention remains on the nations actively involved in aid exchange. By integrating color intensity and geography, the visualization enables the identification of aid patterns in terms of how they cluster regionally, revealing structural inequalities in international aid networks.39:T969,data = { const countryToContinent = { "Saudi Arabia": "Asia", "Kuwait": "Asia", "Qatar": "Asia", "Thailand": "Asia", "Japan": "Asia", "Korea": "Asia", "India": "Asia", "Taiwan": "Asia", "United Arab Emirates": "Asia", "Estonia": "Europe", "Hungary": "Europe", "Liechtenstein": "Europe", "Slovak Republic": "Europe", "Monaco": "Europe", "Belgium": "Europe", "Austria": "Europe", "Italy": "Europe", "Germany": "Europe", "Sweden": "Europe", "Luxembourg": "Europe", "Spain": "Europe", "Denmark": "Europe", "France": "Europe", "Norway": "Europe", "Portugal": "Europe", "Switzerland": "Europe", "United Kingdom": "Europe", "Finland": "Europe", "Ireland": "Europe", "Greece": "Europe", "Netherlands": "Europe", "Cyprus": "Europe", "Czech Republic": "Europe", "Slovenia": "Europe", "Iceland": "Europe", "Poland": "Europe", "Lithuania": "Europe", "Romania": "Europe", "Latvia": "Europe", "United States": "North America", "Canada": "North America", "Brazil": "South America", "Colombia": "South America", "Chile": "South America", "Australia": "Oceania", "New Zealand": "Oceania", "South Africa": "Africa" }; const purposeMap = new Map(); for (const row of top5_data) { const purpose = row.coalesced_purpose_name; const country = row.recipient; const continent = countryToContinent[country] || "Other"; const amt = +row.commitment_amount_usd_constant || 0; if (!purposeMap.has(purpose)) { purposeMap.set(purpose, new Map()); } const continentMap = purposeMap.get(purpose); if (!continentMap.has(continent)) { continentMap.set(continent, new Map()); } const countryMap = continentMap.get(continent); countryMap.set(country, (countryMap.get(country) || 0) + amt); } const root = { name: "aid-by-purpose", children: [] }; for (const [purpose, continentMap] of purposeMap) { const purposeNode = { name: purpose, children: [] }; for (const [continent, countryMap] of continentMap) { const continentNode = { name: continent, children: [] }; for (const [country, amount] of countryMap) { continentNode.children.push({ name: country, value: amount }); } purposeNode.children.push(continentNode); } root.children.push(purposeNode); } return root; } 3a:T912,purpose_chart = { const width = 1154; const height = 1154; const color = d3.scaleOrdinal( data.children.map(d => d.name), d3.schemeTableau10 ); const h = d3.hierarchy(data) .sum(d => d.value != null ? Math.sqrt(d.value) : 0) .sort((a, b) => b.value - a.value); h.eachAfter(d => { if (!d.children || d.children.length === 0) { d.originalValue = d.data.value != null ? d.data.value : 0; } else { d.originalValue = d3.sum(d.children, c => c.originalValue || 0); } }); const root = d3.treemap() .tile(d3.treemapBinary) .size([width, height]) .padding(1) .round(true)(h); const svg = d3.create("svg") .attr("viewBox", [0, 0, width, height]) .attr("width", width) .attr("height", height) .attr("style", "max-width: 100%; height: auto; font: 10px sans-serif;"); const leaf = svg.selectAll("g") .data(root.leaves()) .join("g") .attr("transform", d => `translate(${d.x0},${d.y0})`); const format = d3.format(",d"); leaf.append("title") .text(d =>{ const path = d.ancestors().reverse(); const purpose = path[1]?.data?.name ?? ""; const continent = path[2]?.data?.name ?? ""; const country = path[3]?.data?.name ?? ""; return `Continent: ${continent}, Country: ${country}, Amount: ${d.originalValue}`; } ); leaf.append("rect") .attr("id", d => (d.leafUid = DOM.uid("leaf")).id) .attr("fill", d => { let p = d; while (p.depth > 1) p = p.parent; return color(p.data.name); }) .attr("fill-opacity", 0.6) .attr("width", d => d.x1 - d.x0) .attr("height", d => d.y1 - d.y0); leaf.append("clipPath") .attr("id", d => (d.clipUid = DOM.uid("clip")).id) .append("use") .attr("xlink:href", d => d.leafUid.href); leaf.append("text") .attr("clip-path", d => d.clipUid) .selectAll("tspan") .data(d => d.data.name.split(/(?=[A-Z][a-z])|\s+/g).concat(format(d.originalValue)) ) .join("tspan") .attr("x", 3) .attr("y", (d, i, nodes) => `${(i === nodes.length - 1) * 0.3 + 1.1 + i * 0.9}em` ) .attr("fill-opacity", (d, i, nodes) => i === nodes.length - 1 ? 0.7 : null ) .text(d => d); return Object.assign(svg.node(), { scales: { color } }); } 3b:T1f9f,# **Top 5 Disbursement Purposes and their Distribution** ## 1. Description This treemap visualizes the top five most frequent purposes of aid disbursements across all recipient countries. Each colored block represents a specific aid purpose, while the size of each rectangle corresponds to the total monetary value of disbursements received by each country under that purpose. The five categories visualized include “Sectors not specified,” “Social welfare services,” “Strengthening civil society,” “Higher education,” and “Multisector aid.” Within each color category, individual country squares are grouped by continent, providing a logical geographic organization of aid recipients. This means the treemap follows a hierarchical structure of aid purpose → continent → country. Each square can be hovered over to reveal specific value details through tooltips. The color legend further distinguishes the five aid purposes, enabling clear comparison and making it easier to observe how different types of aid are distributed globally. --- ## **2. Analysis and Interpretation** Firstly, the tree map reveals that “Sectors not specified” occupies the largest proportion overall along with "Social welfare services". This could mean that a large portion of global aid lacks specific categorization but the top purposes of aid seem to fall under general social development and social welfare. **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?** Overall Visible Pattern: 1. Social/welfare Services -> South America > Asia > Europe > Africa > North America 2. Sectors not specified -> Asia > South America > Europe > Africa 3. Multisector aid -> Asia > South America > Europe > Africa 4. Higher Education -> Asia > South America > Europe > Africa > North America 5. Strengthening Civil Society -> South America > Asia > Africa > Europe > Social welfare services dominate in South America, followed by Asia and Europe, indicating that Latin American nations receive substantial aid aimed at improving living standards and welfare infrastructure. Colombia makes up the largest proportion of this category, highlighting its central role in social development programs. This pattern aligns with regional priorities such as poverty alleviation and inequality reduction. > Sectors not specified is most concentrated in Asia, reflecting large-scale, broadly categorized aid flows to populous developing economies such as India and Thailand. The lack of detailed sector labeling suggests that this funding supports general development, infrastructure, or multipurpose national programs. Interestingly, Brazil overtakes Colombia in this category unlike in social welfare indicating that Brazil receives a larger share of more flexible funding. The absence of North America here underscores its status as a developed region with minimal need for such general development aid. > Multisector aid also shows a strong presence in Asia and South America, reflecting projects that integrate multiple development goals such as governance reform, environmental sustainability, and institutional capacity-building. Europe accounts for a relatively larger share of this category compared to other purposes, suggesting its greater involvement in multi-dimensional or cross-sectoral initiatives rather than narrowly defined programs. > Higher education is heavily concentrated in Asia, with notable contributions to Thailand, India, and Korea, indicating a regional emphasis on human capital development and education-driven growth. Brazil again surpasses Colombia in this category, possibly reflecting its stronger tertiary education system and active participation in international academic partnerships. This is one of the few categories where Korea also takes a comparatively larger share of Asia’s distribution, highlighting the country’s academic and research-oriented development ties. > Strengthening civil society appears most prevalent in South America and Asia, followed by Africa, reflecting targeted efforts to build democratic institutions, community organizations, and governance capacity in regions undergoing social or political transitions. This is also one of the few categories where Africa ranks higher than Europe, indicating a stronger focus on governance-related aid in developing regions. Across all five categories, Asia consistently emerges as the region receiving the widest range of aid types, while South America demonstrates strong focus in social welfare and governance. The recurrence of countries such as India, Thailand, Brazil, and Colombia across multiple purposes indicates that a small number of developing nations receive aid across a wide spectrum of developmental priorities. **Are there countries that tend to receive more of certain types of donations than others?** > Yes, the treemap reveals that certain countries specialize in receiving specific types of aid, reflecting their national development priorities and institutional capacity. > India and Thailand appear consistently across multiple purposes such as Sectors not specified, Higher Education, and Multisector Aid. This shows that they are major recipients of both general development and education-focused funding. > Colombia dominates Social Welfare Services and Strengthening Civil Society, suggesting that its aid profile is strongly oriented toward social programs and institutional reform. > Brazil, on the other hand, receives more in Sectors not specified and Higher Education, showing a broader, more diversified aid portfolio centered on infrastructure and human capital development. > Korea features prominently within Higher Education, reflecting the country’s established academic and research networks. > African nations, though less visible in most categories (perhaps indicative of the overall lack of funding in the continent), receive proportionally more support in Strengthening Civil Society, highlighting a focus on governance, participation, and social capacity-building. > European nations shows a more heterogeneous pattern across aid purposes. While countries such as Hungary, Poland, and Romania appear prominently under Social Welfare Services and Strengthening Civil Society, their positions shift in other categories. For example, Czech Republic, Cyprus, and Latvia are more visible under Multisector Aid and Higher Education, suggesting more specialized aid patterns. This variation implies that European recipients receive aid that is more purpose-specific and less uniform, reflecting differences in national development needs. --- ## **3. Thought Process and Rationale** The goal behind this visualization was to investigate whether certain countries tend to receive specific types of aid more frequently and to identify geographical or categorical concentration among disbursement purposes. A treemap was chosen because it efficiently represents this hierachy: aid purposes at the top level, continents and their recipient countries as subcategories. The nested structure enables viewers to simultaneously see the proportion of total aid by purpose and which countries dominate each category. The area size of each rectangle encodes the total disbursed amount, while colour encodes the purpose type, allowing for visual separation between categories. Although contribution representation based on area size does leave some very small squares, tooltips effectively eradicate any smaller details lost in the big-picture of the visualization. Division by continent, help identify regional patterns such as funding clustering heavily in Asian countries or social welfare support distributed across Latin America and Africa. Unlike bar charts or maps, which emphasize scale or geography, the treemap was intentionally chosen to highlight internal composition i.e. how the top 5 aid purposes break down within the overall dataset and which countries appear most across different aid categories.3c:[{"id":"73d953b454a992305f4c4a03837d8f2eda080065df489d1eebbad98086566e86f0082390f1274374819d17fe9a62d2f39626a1849d293349e0e250e56ce3e746","href":"https://static.observableusercontent.com/files/73d953b454a992305f4c4a03837d8f2eda080065df489d1eebbad98086566e86f0082390f1274374819d17fe9a62d2f39626a1849d293349e0e250e56ce3e746","name":"aiddata-countries-only - aiddata-countries-only.csv","type":"text/csv","lastModified":1761869201808.12,"size":8760387}] 30:{"id":"e927e311008dfe34","slug":null,"title":"Mini-Project 1: Geographic Financial Aid","thumbnail":"c84a743df1c41799726441a62006e1ee45995159d8d6f1ebb9601577c66871b1","access_level":"public","create_time":"$D2025-10-30T23:55:00.462Z","update_time":"$D2025-11-07T04:23:42.346Z","view_time":null,"first_public_time":"$D2025-11-06T22:38:52.338Z","has_unpublished_edits":null,"fork":true,"stars":0,"starred":false,"owner":{"type":"team","id":"9f0e7a056e171f1e","login":"nyu34","name":"NYU","avatar_url":"https://avatars-next.observableusercontent.com/2d4bc1e34109ca4a768a9988c04daf63bb3b75d51019c1264cf163e913a8562b","tier":"starter_2024"},"version":540,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"03df06c91a2bb0e9","login":"anushri-iyer","name":"Anushri Iyer","avatar_url":"https://avatars-next.observableusercontent.com/17802ee9d3daba50a72b15f0997290e6a630e2c752bc2c0f872a839f9ab5a4e3","tier":null}],"members":[{"type":"individual","id":"03df06c91a2bb0e9","login":"anushri-iyer","name":"Anushri Iyer","avatar_url":"https://avatars-next.observableusercontent.com/17802ee9d3daba50a72b15f0997290e6a630e2c752bc2c0f872a839f9ab5a4e3","tier":null,"role":"editor"},{"type":"team","id":"9f0e7a056e171f1e","login":"nyu34","name":"NYU","avatar_url":"https://avatars-next.observableusercontent.com/2d4bc1e34109ca4a768a9988c04daf63bb3b75d51019c1264cf163e913a8562b","tier":"starter_2024","role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"title":"Mini-Project 1: Geographic Financial Aid","cells":[{"id":0,"value":"# Mini-Project 1: Geographic Financial Aid","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":27,"value":"import {css} from \"@rk2546/2025-infovis-cse_notebook-gallery\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":34,"value":"css","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":32,"value":"$32","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":39,"value":"---\n\n#### [TO-DO]\n\nFill out the following submission details:\n\n* **Name:** Anushri Iyer;\n* **NetID:** ai2185;\n* **NOTEBOOK URL:** https://observablehq.com/d/e927e311008dfe34 ;\n\n---","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":6,"value":"## About the Dataset\n\nHere we load a [simplified and reduced version](https://docs.google.com/spreadsheets/d/1YiuHdfZv_JZ-igOemKJMRaU8dkucfmHxOP6Od3FraW8/) of the [AidData dataset](https://www.aiddata.org/data/aiddata-core-research-release-level-1-3-1). You are free to change this code as you wish. If you don't want to preprocess your data on Observable, then you can do the preprocessing using whatever languages or tools you'd like and then [upload](/@observablehq/file-attachments) your preprocessed data to Observable. ","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":21,"value":"\n\nThe dataset contains the following columns:\n- **yearDate**: year of the commitment as a Date object\n- **yearInt**: year of the commitment as an integer\n- **donor**: country providing the financial resource\n- **recipient**: country receiving the financial resource\n- **amount**: the total amount of financial resources provided\n- **purpose**: the purpose of the transaction","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":12,"value":"$33","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":15,"value":"### Remember\n\nThe questions above are a very useful tool for you to verify whether you are producing a good solution or not. As you go about solving this exercise you can use the questions above as an 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.\n\nFurthermore, you should feel free to process and transform the data any way you deem relevant and use any tool you prefer for data processing. Data transformation does not necessarily have to be in JavaScript nor within Observable. It’s ok to pre-process the data and then load it in Observable if you prefer.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":55,"value":"### Grading Criteria\n\nYour 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](/@nyuvis/contextual-elements-aesthetics-and-clarity) for reference.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":71,"value":"aid_data = FileAttachment(\"aiddata-countries-only - aiddata-countries-only.csv\").csv({typed:true})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":76,"value":"donatedByCountry = d3.rollup(\n aid_data,\n v => d3.sum(v, d => +d.commitment_amount_usd_constant),\n d => d.donor\n);","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":78,"value":"receivedByCountry = d3.rollup(\n aid_data,\n v => d3.sum(v, d => +d.commitment_amount_usd_constant),\n d => d.recipient\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":83,"value":"countries = new Set([\n ...donatedByCountry.keys(),\n ...receivedByCountry.keys()\n]);","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":325,"value":"$34","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":190,"value":"## Visualisation 1\nHow 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?","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":247,"value":"viewof changeDisplay = Inputs.radio(\n [\"Net Position\", \"Remove Net Position\"],\n { label: \"Overlay\", value: \"None\" }\n)\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":230,"value":"$35","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":328,"value":"$36","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":194,"value":"## Visualisation 2\nDo 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?","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":408,"value":"import {Legend, Swatches} from \"@d3/color-legend\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":252,"value":"$37","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":505,"value":"$38","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":355,"value":"## Visualisation 3\nAre 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?","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":357,"value":"per_category = d3.rollup(\n aid_data,\n v => d3.count(v, d => +d.aiddata_id),\n d => d.coalesced_purpose_name\n);","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":360,"value":"top5_categories = Array\n .from(per_category, ([purpose, count]) => ({ purpose, count }))\n .sort((a, b) => d3.descending(a.count, b.count))\n .slice(0, 5);","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":362,"value":"top5 = top5_categories.map(d=>d.purpose)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":365,"value":"top5_data = aid_data.filter(d=>top5.includes(d.coalesced_purpose_name))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":373,"value":"$39","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":442,"value":"key = Swatches(purpose_chart.scales.color)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":436,"value":"$3a","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":525,"value":"$3b","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":90,"value":"function unique(array) {\n return array.filter((v, i) => array.indexOf(v) === i);\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W3c","stdlib":"1","titling":"auto"}} 31:"$30:body"