Skip to main content
SimilarExport ZIP
100%

dv_project

✓ Published0🌍 Public
GGOPI MUPPURI
Last edited Nov 27, 2024
Created on Nov 27, 2024
Forked from Hello VizHub

This example presents five coordinated crime data visualizations—a scatter plot, stacked bar chart, heat map, line graph, and pie chart—rendered as SVGs using D3 v7. It loads CSV data from a GitHub gist and demonstrates multiple D3 APIs including `d3.csv`, `d3.scaleLinear`, `d3.scaleBand`, `d3.scaleOrdinal`, `d3.stack`, `d3.group`, `d3.rollup`, and `d3.axisBottom`. The scatter plot maps longitude and latitude coordinates, while the stacked bar and heat map show top offense categories by year using `d3.schemeCategory10` and `d3.interpolateBlues` color scales.

AI-generated description

An example showing the capabilities of VizHub:

  • Loads D3 via UNPKG.
  • Demonstrates use of import from "d3".
  • Demonstrates use of import from local ES6 modules.
MIT Licensed

Similar vizzes

Loading thumbnail…

DataViz-Plot1

This example presents two static D3.js v6 SVG visualizations of crime data. A bar chart displays the number of crimes per day of the week, using `d3.scaleBand` and `d3.scaleLinear` with axes from `d3.axisLeft` and `d3.axisBottom`, while a scatter plot maps the geographical distribution of incidents by latitude and longitude using `d3.scaleLinear`. Data is loaded from a Google Drive-hosted CSV file via `d3.csv`, with the bar chart grouping records by the "Day of Week" field and the scatter plot filtering for valid coordinates.

Hharikrishnasair@gmail.com
80% match
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
80% match
Loading thumbnail…

testcase

This example presents two crime data visualizations in a single HTML page. A scatter plot maps crime locations using latitude and longitude coordinates, while a histogram displays the frequency of crimes by hour of the day. Both charts are rendered as SVGs using D3 v6, with the data loaded from a CSV file via `d3.csv`. The scatter plot uses linear scales with blue points, and the histogram employs a band scale with green bars built from `d3.rollup` counts.

Hharikrishnasair@gmail.com
79% match
Loading thumbnail…

Fork of DataViz-Plot2

This example visualizes the locations of crimes from a CSV dataset as a scatter plot, mapping latitude and longitude coordinates to x and y positions. The code loads the data using `d3.csv`, filters out invalid entries, and renders each point as an SVG circle with tooltips. The visualization includes linear scales, axes with labels, and a title, all created with D3 v7. The source dataset is linked from Google Drive, and the chart is built exclusively with SVG elements.

Hharikrishnasair@gmail.com
78% match
Loading thumbnail…

Fork of DataViz-Plotnew

This fork of DataViz-Plotnew presents two static SVG visualizations of crime data loaded via `d3.csv` from a Google Drive link. A bar chart counts crimes per day of the week using `d3.rollup`, while a scatter plot maps crime locations by longitude and latitude with `d3.scaleLinear`. Both use D3 v6 axes and hardcoded SVG dimensions, with bars styled in steel blue and points in red.

Hharikrishnasair@gmail.com
78% match
Loading thumbnail…

ProjectDV

This interactive visualization gallery presents four chart types—bar chart, line chart, histogram, and count plot—that users switch between via buttons. Each chart visualizes population data for ten countries loaded from a CSV file hosted on GitHub Gist. Built with React and D3 v6, the application uses the `csv` method to parse the dataset and dynamically renders each chart type on button click. The code references separate render functions for each visualization, though the concrete D3 scales and layouts are not included in the provided snippets.

Ssannihitha.k23@gmail.com
77% match
Loading thumbnail…

exploration&Visu

This visualization uses D3 v4’s `d3.histogram` and `d3.scaleBand` to display crime counts as bar charts, with hardcoded arrays for daily and monthly totals. The SVG chart is generated via a reusable `chart` function, which sets up linear scales and an axis, then binds data to rectangle elements for bars. The code includes category labels for crime types and weekdays, but no external data file. Rendering is purely SVG with styled bars and axes.

AAminaSGitHub
76% match
Loading thumbnail…

Fork of D3.js Line Chart

This visualization displays country crime indices as a line chart, using a bar-chart-style categorical X axis for countries and a linear Y axis for crime scores. Built with D3 v7, it loads data from a CSV file using `d3.csv`, applies a `scaleBand` for country positioning and `scaleLinear` for the crime index range, and draws the line with `d3.line()`. The SVG chart includes axes, labels, and a thick steel-blue stroke, rendered within a fixed 960×400 pixel canvas and styled with external CSS.

Bbhanuprasadk19
76% match