Violations

100%

✓ Published2🌍 Public

Last edited Sep 23, 2020

Created on Sep 16, 2020

This interactive bar chart visualizes documented violations in Syria by province and date, sourced from the Violations Documentation Center’s aggregated CSV data. The visualization encodes date on the x-axis, a count of violations on the y-axis, and province as color, with tooltips revealing exact counts. Using the Vega-Lite API (`vl.markBar`, `vl.x().fieldT`, `vl.y().fieldQ`, `vl.color().fieldN`) rendered via `vega-lite-api`, `vega`, and `vega-lite`, the chart dynamically fits the window and applies custom axis styling from `config.js`. The `d3.csv` loader fetches the remote dataset, with the tooltip handler provided by `vega-tooltip`.

AI-generated description

Scrapes data from the Database Acces page of the Violations Documentation Center in Syria.

Gist: Database Acces page of the Violations Documentation Center in Syria

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Violations

This visualization presents a categorical bar chart of documented violations in Syria, showing the count aggregated by province and date. The chart uses a dark color scheme for readability. It loads a CSV file from a GitHub repository and processes it with d3.csv retrieval. The visualization is built using Vega-Lite API via the vl module, with tooltips enabled through the vega-tooltip Handler, and the chart dimensions are set to fit the browser window.

Ttrentjhn

91% match

Loading thumbnail…

Fork of Loading Data SyriaViolationsDocumentationCenter Francesca Sajedi

This visualization displays aggregated Syrian violation records from the Syria Violations Documentation Center, showing the count of civilian and non-civilian casualties across provinces, dates, and responsible actors. The code fetches a CSV file and parses it with `d3.csvParse`, converting the count column to numeric values. Using D3 v7, the visualization initially renders the raw data as JSON text in a `<pre>` element, with a state management pattern where data loading triggers a re-render through the `setState` function. The framework is D3 with a custom `viz` function handling the container updates.

Ffsajedi22

79% match

Loading thumbnail…

Line Plot Francesca

This line chart visualizes the number of reported violations in Syria over time, using data from the Syria Violations Document Center. The chart plots a black line across a time-based x-axis and a count-based y-axis, with axis labels for "Year" and "Number of Violations." The visualization is built with D3 v7, leveraging `d3.scaleTime`, `d3.scaleLinear`, `d3.line`, and `d3.timeParse` to parse the date strings from the CSV file. Data is loaded via `fetch` and parsed with `d3.csvParse`, with the full chart rendered into an SVG element.

Ffsajedi22

76% match

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

75% match

Loading thumbnail…

Database Acces page of the Violations Documentation Center in Syria.

This example summarizes a dataset from the Violations Documentation Center in Syria, displaying its size in kilobytes, row count, and column count on a page. The page uses `d3.csv` to fetch a remote CSV file from GitHub and `d3.csvFormat` to calculate byte length, with `d3` version 5 loaded via a CDN. It answers distribution questions about violation type, location, and time only by presenting the dataset’s basic dimensions, not by rendering charts. The code also includes commented alternatives using `fetch` and `d3.csvParse`.

MMoooYang

75% 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

72% match

Loading thumbnail…

Monthly Deaths in Syria

A bar chart shows the monthly count of documented deaths in Syria from 2011 through June 2019, using red bars over a time-series axis. The visualization relies on D3 v4 scales (`d3.scaleTime`, `d3.scaleLinear`), axes (`d3.axisBottom`, `d3.axisLeft`), and tooltips via `d3-tip` to display the date and count on hover. Data comes from the Violations Documentation Center in Syria, aggregated from a CSV using Datalib’s `groupby` and `summarize`. Hovering highlights the bar with a lighter fill.

CCurran Kelleher

72% match

Loading thumbnail…

Monthly Deaths in Syria

This visualization of monthly deaths in Syria uses a bar chart with a red color scheme and interactive tooltips. It aggregates data from the Violations Documentation Center in Syria, summing recorded deaths per month from 2011 to June 2019. The chart renders as SVG using D3.js v5, with axes, gridlines, and labels styled via CSS. Hovering over a bar reveals the exact month and death count through a d3-tip tooltip. The y-axis label is rotated for readability, and the chart resizes to fit the browser window.

Vvaynexie

71% match