Skip to main content
SimilarExport ZIP
100%

Scatterplot of Boston Crime Data

✓ Published1🌍 Public
LLeah Mitchell
Last edited Sep 27, 2021
Created on Sep 14, 2021
Forked from D3 Scatter Plot

A scatterplot displays Boston crime data for theft-type offenses, plotting the hour of day on the x-axis against the offense code on the y-axis. Each grey, semi-transparent circle represents an individual crime, with opacity revealing overlapping points. The data loads from a CSV file and is processed via `d3.csv` with a parsing function that converts numeric fields. Using d3.v6, the visualization employs `scaleLinear` for the axes, `axisLeft`, `axisBottom`, and SVG `circle` elements within a full-window rendered chart.

AI-generated description

Scatterplot of hour versus offense code for Boston crime data, specifically for theft-type crimes.

Data from: https://gist.github.com/LeahMitchell/1995469479ed07a95eabb8625b32807a#file-readme-md

MIT Licensed

Similar vizzes

Loading thumbnail…

forkforlinechart

This line chart visualizes crime rates across different towns, using a filtered subset of the Boston housing dataset. The chart shows a single steelblue line connecting points for each town, with rotated x-axis labels for readability. The visualization is built with D3 v7, using `d3.csvParse` to load the data, `d3.scaleBand` and `d3.scaleLinear` for positioning, and a `d3.line` generator to draw the path. The SVG is rendered directly in the browser, with margins and axes configured manually. The chart highlights per-town variation in per-capita crime, ordered alphabetically along the horizontal axis.

Rranjithkmr598@gmail.com
77% match
Loading thumbnail…

Summary Statistics for Boston Crime Data

This example displays summary statistics for Boston crime data from 2020, showing the dataset’s size in kilobytes, row count, and column count in large text. It loads the CSV from a GitHub gist using `d3.csv`, then calculates the file size by measuring the formatted CSV string length and divides it by 1024. The code also includes commented-out alternatives using `fetch`, `async`/`await`, and `d3.csvParse`, demonstrating different approaches to asynchronous data loading. The visualization is minimal, rendering the final message into a `<pre>` element using standard DOM text assignment.

LLeah Mitchell
76% match
Loading thumbnail…

Fork of areaChart

This example visualizes the Boston housing dataset, plotting crime rate (CRIM) per town using an area chart. The chart encodes the data with a steelblue filled area, where the x-axis lists town names (rotated for readability) and the y-axis scales CRIM values. Built with D3.js v7, it fetches a CSV, parses it with `d3.csvParse`, and uses `d3.area()` and `d3.scaleBand`/`d3.scaleLinear` to render the SVG path and axes. The code demonstrates a clean, reusable pattern for time-series-like comparisons across categorical labels.

Rranjithkmr598@gmail.com
76% match
Loading thumbnail…

Boston Crime Reports

A map of Boston displays crime incident reports as semi-transparent circles, colored by the Uniform Crime Report (UCR) part via an ordinal color scale. A linked date histogram below the map shows the total number of incidents over time, with a brush that filters the map’s circles by date range. The visualization uses React, D3’s `geoAlbers` projection, `geoPath`, `scaleOrdinal`, and `brushX`. Data comes from Boston Crime Reports and neighborhood GeoJSON files.

GGeniXiong
75% match
Loading thumbnail…

Major Crimes in Boston

This example visualizes major crimes in Boston from a city dataset, using a bar chart where each bar represents a crime type and its length corresponds to the number of incidents. The bars are color-coded by year, and hovering reveals a tooltip with the crime name and exact count. Built with Vega-Lite and rendered via the `vega-lite-api`, it loads data from a CSV URL using D3’s `csv` method, then applies custom axis styling and tooltip handling from `vega-tooltip`.

JJosvin John
74% match
Loading thumbnail…

Boston Crime Reports

This interactive visualization maps Boston crime incident reports by neighborhood, with points colored by Uniform Crime Report category. A linked time-series histogram below the map shows the total number of incidents over time and includes a brush that filters the map to a selected date range. The map uses a D3 geoAlbers projection with geoPath to render TopoJSON neighborhood boundaries, while React manages the state for the brush selection and color legend. Data comes from a CSV of Boston crime reports.

GGeniXiong
74% match
Loading thumbnail…

Fork of Reusable D3 Scatter Plot

This interactive scatter plot visualizes the Boston housing dataset, comparing median home values against various attributes such as room count, lower status population, and crime rate. Built with D3.js, the visualization cycles through these different x-axis variables every two seconds, dynamically updating the plot and axis labels. The chart uses SVG rendering and employs a custom, reusable scatter plot charting function that leverages D3's linear scales, extent, and axis utilities for data mapping and visual encoding.

Rranjithkmr598@gmail.com
74% match
Loading thumbnail…

Chicago Crime Dataset Analysis

This visualization presents a bar chart of Chicago crime data, ranking offense types by their recorded counts, with THEFT and BATTERY as the most frequent. The bars are color-coded and rendered as SVG using D3.js v5, with axes created via d3.axisLeft and d3.axisBottom. The code includes reusable modules for a dropdown menu and color legend, though the current renderer focuses on the bar chart. The data is loaded from a CSV file and processed with d3.csv, with scales built using d3.scaleLinear and d3.scaleBand.

Ssrrajendran
73% match