Skip to main content
SimilarExport ZIP
100%

Syria Situation Prototypes

✓ Published0🌍 Public
CCurran Kelleher
Last edited Aug 3, 2017
Created on Jul 18, 2017

This interactive area chart visualizes the growth of Syrian refugees, comparing those residing in camps against those in urban and rural settings. The input data is loaded from two local JSON files sourced from the UN Refugee Agency Data API, with both datasets interpolated to a unified daily timeline using `d3.bisector` to enable a continuous stacked comparison. The visualization, built with D3 v4, renders semi-transparent SVG areas, includes an x-axis for dates and a right-aligned y-axis with gridlines, and features a mouse-driven tooltip.

AI-generated description

A stacked area chart showing Syrian refugees, by settlement type.

Data from the UN Refugee Agency Data API.

mit Licensed

Similar vizzes

Loading thumbnail…

Untitled

This visualization shows the monthly aggregated death toll in Syria from 2011 to June 2019, plotted as a bar chart over time. The chart uses D3.js to render an SVG with axes, bars, and a tooltip that appears on hover. Data is sourced from the Violations Documentation Center in Syria via a scraping script. The visualization also includes a dynamic title and a responsive layout styled with CSS, with the y-axis and x-axis drawn using D3’s axis components.

Vvaynexie
73% match
Loading thumbnail…

Refugees Streamgraph

This streamgraph visualizes the total number of persons of concern to UNHCR, grouped by country of origin, using a flowing, layered area chart. The data spans multiple years and is filtered to exclude countries with relatively low counts. Rendered in SVG with D3 v4, the chart uses a wiggle offset to create the signature streamgraph silhouette, with each country’s contribution represented as a colored layer. Labels are positioned using d3-area-label, and hovering highlights individual streams by turning them black. The visualization relies on interpolated yearly values and a custom stack layout to show change over time for over 1 million persons of concern per country.

PPatrick Wojda
71% match
Loading thumbnail…

Refugees Streamgraph

This visualization shows the total number of persons of concern grouped by country of origin from 1951 to 2016, using a streamgraph with a wiggle offset. It labels selected regions with `d3-area-label` and includes interactive highlighting on hover. The data is sourced from UNHCR Population Statistics and preprocessed into a JSON file. The visualization is built with D3 v4, using `d3.stack`, `d3.area`, and `d3.scaleTime` for rendering as SVG.

CCurran Kelleher
71% match
Loading thumbnail…

Refugees Streamgraph

A streamgraph visualizes the total number of persons of concern to UNHCR from 1951 to 2016, grouped by country of asylum or residence and excluding countries with low cumulative counts. The chart uses a wiggle offset and inside-out ordering via `d3.stack` to create the layered flows, with area shapes rendered as SVG paths using `d3.area` and a basis curve. Hovering highlights a country by turning its path black. Data originates from UNHCR’s time series CSV and is preprocessed with `d3.nest`.

CCurran Kelleher
71% match
Loading thumbnail…

Fork of Monthly Deaths in Syria

This visualization displays a time-series bar chart of monthly deaths in Syria from 2011 to June 2019, with each bar’s height representing the death count for that month. The chart uses D3.js v4, with the `d3.scaleTime` and `d3.scaleLinear` functions to map dates and counts, and a custom tooltip via the `d3-tip` library. Data is aggregated from the Violations Documentation Center in Syria, loaded via `d3.csv` and processed with the `datalib` library.

IIan Wright
70% match
Loading thumbnail…

Fork of Monthly Deaths in Syria

This bar chart shows the monthly count of documented deaths in Syria from 2011 to June 2019, with a hovering tooltip revealing the exact number per month. Each bar’s height encodes the death toll, allowing comparisons of peaks and trends across the conflict. The visualization uses the D3 v4 API, including `d3.scaleTime`, `d3.scaleLinear`, `d3.axisBottom`, and `d3.axisLeft`, with data aggregated from the Violations Documentation Center in Syria via a Node.js script. The tooltip is rendered with the `d3-tip` library, and the chart is drawn as SVG rectangles.

MMaldewar
70% match
Loading thumbnail…

Fork of Monthly Deaths in Syria

This bar chart shows the monthly count of documented deaths in Syria from 2011 to June 2019, with a hovering tooltip revealing the exact number per month. Each bar’s height encodes the death toll, allowing comparisons of peaks and trends across the conflict. The visualization uses the D3 v4 API, including `d3.scaleTime`, `d3.scaleLinear`, `d3.axisBottom`, and `d3.axisLeft`, with data aggregated from the Violations Documentation Center in Syria via a Node.js script. The tooltip is rendered with the `d3-tip` library, and the chart is drawn as SVG rectangles.

MMaldewar
70% match
Loading thumbnail…

Monthly Deaths in Syria

This visualization displays monthly deaths in Syria from 2011 to June 2019 as a bar chart, with each bar colored red and hover interactions showing exact counts via a tooltip. The data comes from the Violations Documentation Center and is aggregated by month. It uses D3 v4 with d3.scaleTime for the x-axis, d3.scaleLinear for the y-axis, and the d3-tip library for tooltips. The SVG chart is responsive and updates its size on window resize.

PPedro Ernesto Tramontina
69% match