Skip to main content
SimilarExport ZIP
100%

Fork of Persons of Concern StreamGraph by Origin

✓ Published0🌍 Public
Zzedelstein
Last edited Dec 4, 2021
Created on Dec 4, 2021

A streamgraph visualizes the total number of persons of concern per year, grouped by country of origin, using UNHCR data. It shows stacked, colored streams for countries with over one million total persons, with labels positioned by d3-area-label. The code uses d3.stack with stackOffsetWiggle and stackOrderInsideOut, d3.scaleTime, and d3.scaleOrdinal with schemeCategory10. Values are interpolated across years via d3.bisector. Hovering over paths turns them black.

AI-generated description

A StreamGraph visualization of the total number of persons of concern grouped by country of origin.

The total number of persons of concern is the sum of Asylum-seekers, Internally displaced persons, Persons in IDP-like situation, Others of concern, Returned IDPs, Refugees (incl. refugee-like situations), Returnees, Persons in Refugee-like situation, and Stateless Persons. Excludes countries with relatively low counts. Data from UNHCR Population Statistics.

See also this variant that shows the data grouped by destination.

Draws from Labeled Streamgraph and Syrian Refugees by Settlement Type.

Uses d3-area-label to position labels.

Originally published in bl.ocks.org: Persons of Concern StreamGraph by Origin.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Persons of Concern StreamGraph by Origin

This streamgraph visualizes the total number of persons of concern grouped by country of origin, with data from UNHCR Population Statistics. Each colored band represents a country, with labels positioned using d3-area-label. The visualization uses d3.stack with stackOffsetWiggle and stackOrderInsideOut to create the flowing streamgraph shape, while d3.scaleTime and d3.scaleLinear handle the axes. The code interpolates yearly values using d3.bisector, and renders the result as an SVG with hover effects that highlight individual bands.

TTanupat B.
95% match
Loading thumbnail…

Fork of Persons of Concern StreamGraph by Origin

This visualization shows the total number of persons of concern grouped by country of origin over time, using a streamgraph with labels positioned inside each stream. Built with D3 v4 and rendered as SVG, it applies `d3.stack` with `stackOffsetWiggle` and `stackOrderInsideOut` to create the flowing layers, while `d3-area-label` places country names. The data comes from UNHCR Population Statistics and excludes countries with low counts. Interpolation between years smooths the paths, and hover effects highlight individual countries.

EEevikettu
95% match
Loading thumbnail…

Fork of Persons of Concern StreamGraph by Origin

A streamgraph visualizes the total number of persons of concern grouped by country of origin, summing categories like refugees, asylum-seekers, and internally displaced persons. The interactive D3.js v4 visualization uses `d3.stack` with a wiggle offset and inside-out ordering, rendering static SVG paths with d3-area, a time-based x-scale, and labels positioned via d3-area-label. Data is fetched from a remote JSON file, filtered to countries with over one million people, and interpolated across years using d3's bisector and date range methods.

CCristina Macaraig
94% match
Loading thumbnail…

Fork of Persons of Concern StreamGraph by Origin

A streamgraph visualization shows the total number of persons of concern—including refugees, asylum-seekers, and internally displaced persons—grouped by country of origin, filtered to countries with over one million people. The chart uses d3.stack with stackOffsetWiggle and stackOrderInsideOut to create the flowing layers, d3.area with curveBasis for smooth shapes, and d3-area-label for positioning labels. Data comes from UNHCR Population Statistics, with values interpolated across years and rendered as SVG. The visualization is a fork of the original Persons of Concern StreamGraph by Origin.

Kkatebacon32
94% match
Loading thumbnail…

Fork of Persons of Concern StreamGraph by Origin

This streamgraph visualizes the total number of persons of concern (refugees, internally displaced persons, stateless persons, and related categories) grouped by country of origin, using data from UNHCR. The stacked areas wiggle across a time axis, with labels positioned via the d3-area-label library. The visualization also interpolates values between recorded years to create a continuous series. It renders to SVG using d3.v4, with stacked areas ordered and offset via d3.stack and a color scale from d3.schemeCategory10. Excluded are countries with low total counts.

Aayilya1
94% match
Loading thumbnail…

Fork of Persons of Concern StreamGraph by Origin

This fork of the Persons of Concern StreamGraph visualizes the total number of persons of concern (refugees, asylum-seekers, internally displaced persons, and others) from 2000 onward, grouped by country of origin and excluding countries with low counts. It uses a wiggle-offset stacked area chart rendered as SVG with d3.v4, with labels positioned via d3-area-label and interpolated yearly values computed from UNHCR Population Statistics data. The code employs d3.stack, d3.scaleTime, d3.scaleLinear, and d3.schemeCategory10 for coloring, with hover effects that highlight a path in black.

Ssudeepmathew
94% match
Loading thumbnail…

Persons of Concern StreamGraph by Origin

This StreamGraph visualizes the number of persons of concern over time, grouped by country of origin, using data from UNHCR Population Statistics. A stack offset wiggle creates the flowing layers, with d3.area-label placing labels inside each region. The code uses d3.stack, d3.scaleTime, and d3.curveBasis to render the SVG, with interpolated values between annual data points. Major and minor axes display time, while hovering highlights individual country streams.

Ppgy-iacas
93% match
Loading thumbnail…

Fork of Persons of Concern StreamGraph by Origin

This visualization presents a streamgraph of the total number of persons of concern (refugees, asylum-seekers, internally displaced persons, and related categories) grouped by country of origin, using data from UNHCR Population Statistics. The chart renders as an SVG with a wiggling stacked area layout, highlighting countries with over one million total persons. It interpolates yearly values between data points and uses d3.stack with stackOffsetWiggle, d3-scale-time, and d3.axisBottom for the time axis. Labels are positioned automatically via the d3-area-label library, and the implementation runs on d3 v4.

NNick-Brice
93% match