Asylum total 2016

Force Layout from CSV

A force-directed graph visualizing asylum-seeker flows in 2016, with nodes representing countries and links representing asylum applications between them. The visualization uses D3's force layout to position nodes and draw edges, with data loaded from a CSV file containing origin and destination countries. The graph is rendered as an SVG with lines for links and circles for nodes, and the force-directed layout distributes the nodes based on the connections between countries. Data is sourced from UNHCR population statistics, showing asylum-seeker movements between countries of origin and countries of asylum/residence.

Aalex-rind

76% match

Untitled

This visualization displays a world map with asylum seeker data, highlighting the flow of refugees from various countries to Canada over time. Using D3 version 3, the map employs a geographic equirectangular projection with graticules, land boundaries, and a red arc connecting two specific locations. The code loads TopoJSON world data to render land masses and country borders, while the asylum data is loaded from an external CSV file. The visualization demonstrates how geographic and temporal asylum patterns can be represented through interactive map-based data visualization.

75% match

Untitled

This visualization displays the number of asylum seekers arriving in Canada from various countries of origin between 1959 and 1970. It uses a red arc to connect Washington, D.C. and Beijing across an equirectangular projection of the world map. The map is rendered using the `d3.geo` API, with graticule, land, and boundary layers. The asylum data is loaded from a CSV file and joined with the country features from a TopoJSON world atlas.

Circles on Map

This visualization displays asylum seeker data on a world map using a natural Earth projection. Small black circles mark the approximate centroid of each country, with circle size not varying by value. The map is rendered with SVG paths and supports zoom and pan through d3.zoom. Data comes from a CSV file of asylum claims, loaded and joined with TopoJSON country boundaries using TopoJSON's feature method and d3.csv.

HTML Starter

This example visualizes asylum seekers departing from countries worldwide, with a choropleth map coloring each nation by the number of departures for a selected year. It uses a natural Earth projection via `d3.geoPath` and `d3.geoNaturalEarth1`, with data loaded from a TopoJSON world atlas and a local asylum JSON file. A threshold color scale and `d3.legendColor` display the legend, while a slider updates the displayed year and re-renders the map with `d3.queue`.

Arc Generator

This visualization displays asylum-seeking flows between countries on a world map using curved arcs that connect country centroids. When hovering over a country, arcs appear linking it to several pre-selected destinations, though the data shown represents a small sample rather than the full asylum.json dataset. The visualization uses an SVG rendering approach with D3 v5's geoNaturalEarth1 projection and geoPath to draw country boundaries, while custom arc-generating logic creates the connecting paths. The style.css file defines the map aesthetics, including light green country fills and red arcs.

D3 in Action Adjacency Matrix

This example visualizes asylum-seeker flows between countries as a directed adjacency matrix, with source countries on the y-axis and destinations on the x-axis. The grid encodes the weight of each flow through the opacity of red squares, and hovering over a cell highlights the corresponding row and column. It loads node and edge data from CSV files using the queue library, then builds the matrix with d3.csv and renders it as SVG rectangles. Axis labels are added with d3.svg.axis, while d3.scale.ordinal positions the country names along both dimensions.

Aalex-rind