Fork of Viz Function Concept

100%

Fork of Viz Function Concept

✓ Published0🌍 Public

Last edited Dec 1, 2024

Created on Dec 1, 2024

This dashboard visualizes Boston incident data from a CSV file using three D3.js v7 charts: a bar chart of offense types, an area chart showing hourly incident distribution, and a pie chart of incidents by district. The code uses `d3.rollup` to aggregate the data, `d3.scaleBand` and `d3.scaleLinear` for the bar and area charts, and `d3.area` with `d3.curveMonotoneX` for the hourly trend. Each chart renders as SVG within responsive cards that update their layout at different screen sizes.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

DV_Project_13

This dashboard displays Boston incident data through three interactive charts: a horizontal bar chart of the top ten offense types, an area chart showing incident distribution across the 24 hours of the day, and a pie chart of incidents by police district with percentage labels. Built with D3 v7, the code uses `d3.rollup` for data aggregation, `d3.scaleBand` and `d3.scaleLinear` for the bar and area charts respectively, and `d3.area` with `curveMonotoneX` for the hourly trend. A responsive CSS grid arranges the chart cards, with data loaded from a remote CSV file.

GGOPI MUPPURI

88% match

Loading thumbnail…

myViz

This pie chart displays the distribution of accidents by type, with each slice labeled directly on the visualization. The code loads CSV data from a GitHub gist, uses `d3.rollup` to count accidents per category, and `d3.pie()` to generate the arc layout. Slices are rendered as SVG paths via `d3.arc()`, colored with `d3.scaleOrdinal` and `d3.schemeCategory10`, while labels are positioned using `arc.centroid()`. The chart is built with D3 v6 and rendered entirely in SVG.

Vveeramallivaishnavi3@gmail.com

77% match

Loading thumbnail…

Fork of Fork of D3: NYC Crime Visualization

This interactive dashboard presents NYC crime data across multiple coordinated views: a geographic map with a heatmap overlay, a pie chart, and two bar charts for age and race breakdowns. Users can filter by precinct and crime type, with all charts updating in response. The visualization uses D3 v6 with a Mercator projection via `d3.geoMercator()` and `d3.geoPath()` for the map, alongside SVG-based pie and bar charts. Crime color mapping and tooltips provide additional detail.

CChristianABeier

77% match

Loading thumbnail…

Fork of Final Project Data Viz

This dashboard presents four coordinated views of San Francisco hate crime data from the SFPD, showing victim counts by suspect race and bias type, suspect counts by race and offense, and a monthly victim timeline. The bar chart uses `d3.rollups` for aggregation, the treemap employs `d3.treemap` with `d3.hierarchy`, and the bubble chart positions nodes via `d3.forceSimulation` with collision detection. An animated area chart uses a line path with dashoffset transitions and hover tooltips across all views.

NNita

77% match

Loading thumbnail…

Fork of NYC Crime

This interactive dashboard presents NYC crime data through a coordinated set of SVG views: a map, a pie chart, and bar charts. Users can click the reset button to restore the initial state. The visualization is built with React and D3 v6, using d3.geoMercator and d3.geoPath for the map, d3.arc for the pie, and d3.scaleBand and d3.scaleLinear for the bar charts, with animations and a tooltip for details.

SSelena Ding

76% match

Loading thumbnail…

Fork of D3: NYC Crime Visualization

This dashboard visualizes NYC crime statistics across multiple coordinated views: a geographic map shading precincts by crime volume, a pie chart of crime type proportions, and bar charts breaking down arrests by age and race. Users can filter the entire interface by clicking map regions or crime categories in the pie. Built with React and D3 v6, it uses `d3.geoMercator` and `d3.geoPath` to project the map, `d3.arc` for donut slices, and `d3.scaleBand`/`d3.scaleLinear` for the bars. A color legend uses CSS linear gradients, and an SVG animation resets the view when the button is clicked.

RRaianeTI

76% match

Loading thumbnail…

Fork of Final Project Data Viz

This visualization presents a multi-chart analysis of hate crimes in San Francisco, sourced from a CSV file of police department data. It shows the total number of victims by suspect race using a horizontal bar chart, a treemap of victims by bias type, a bubble chart of incidents, and an area chart of victims per year. Built with d3.v7, the code uses d3.rollups, d3.scaleBand, d3.scaleLinear, and SVG rendering, with hover effects and tooltips providing interaction.

NNita

76% match

Loading thumbnail…

Fork of Hello VizHub

This example displays a D3.js pie chart that visualizes the distribution of insurance records by region, rendered as SVG with an accompanying legend and interactive tooltips. The code loads CSV data from a GitHub-hosted dataset using `d3.csv`, aggregates region counts with `d3.rollup`, and constructs the pie with `d3.pie` and `d3.arc`. Hovering over a slice highlights it, triggers a tooltip showing the category and value, and applies categorical colors from `d3.scaleOrdinal` and `d3.schemeCategory10`.

Kkotha.shiva@btech.christuniversity.in

76% match