Major Crimes in Boston

100%

Major Crimes in Boston

✓ Published1🌍 Public

Last edited Sep 23, 2020

Created on Sep 17, 2020

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`.

AI-generated description

The data shown here comes from Boston Crimes Dataset

This chart meant to show the "Major Crimes in Boston". The color denotes the number of occurrences of that crime in that particular year. The name of the crime and the number of occurrences are shown on the tooltip as well when you hover over the chart.

MIT Licensed

Similar vizzes

Loading thumbnail…

Major Crimes in Boston with Dropdown Menu for Year

This interactive visualization displays major crimes in Boston as a bar chart, with the color of each bar representing the year and the bar height showing the crime count per offense category. A dropdown menu allows users to filter the data by selecting one or multiple years. Built with React and Vega-Lite API, the chart loads CSV data via D3’s `csv` function and renders using `vl.markBar()` with `vl.x()` and `vl.y()` encodings. The code includes a custom config for axis styling and uses Vega Tooltip for interactivity.

JJosvin John

90% match

Loading thumbnail…

Use my own Mass Crime data

This example visualizes the ten highest-crime cities in Massachusetts as a simple column chart, with bars sized proportionally to each city’s crime ratio. The chart uses `d3.csv` to load the 2016 city crime dataset and `d3.scaleLinear` and `d3.scaleBand` for positioning, while rendering bars as SVG `<rect>` elements via React. The visualization omits axes and labels, focusing solely on the relative bar heights to compare crime rates across the selected cities.

Wwenleicao

78% match

Loading thumbnail…

Massachusetts Crime Proportion by Community (final project)

This visualization shows the proportion of different crime types across Massachusetts communities, using a stacked, normalized bar chart to compare relative shares. Rural areas exhibit more burglary, while cities show higher rates of robbery, motor vehicle theft, and violent crime. Built with vega-lite-api on d3.v5, it loads CSV data from a GitHub gist, aggregates crime counts by community and type, and renders horizontal bars with tableau20 color coding. The config adjusts font sizes and axis styling, while vega-tooltip provides interactive crime-type and count details on hover.

Wwenleicao

78% match

Loading thumbnail…

Vega-Lite API Template

This visualization shows the burglary rate per capita for Massachusetts cities, filtering to only those with rates above 0.005 and sorting the bars from highest to lowest. The bars are rendered with the Vega-Lite API, which builds a specification that Vega then renders as scalable vector graphics. Data is loaded from a CSV file using `d3.csv` and processed to calculate the per-capita metric. Interactive tooltips display the city name when hovering, and the chart automatically fits the browser window dimensions.

CCurran Kelleher

77% match

Loading thumbnail…

Vega-Lite API Template

A bar chart displays the per-capita burglary rate for Massachusetts cities, filtered to those with rates above 0.005, with cities sorted descending by value. Built with the Vega-Lite API, it uses `vl.markBar()` and `vl.y().fieldQ()` for the quantitative axis, while `getData.js` loads a CSV via d3's `csv` method and computes the rate. The chart renders to SVG, with custom axis and label styling from `config.js`.

TTammminana

77% match

Loading thumbnail…

Massachussetts Top 10 Crime city Refactor Code

This example presents a bar chart of the top 10 Massachusetts cities by crime ratio, using data from a 2016 city crime population dataset. The chart displays crime ratios as vertical bars without axes, showing values through a y-axis scale and city names as x-axis labels. Built with React for component rendering and D3 v5 for data loading and scaling, it uses `scaleLinear` and `scaleBand` to map coordinates, while rendering the visualization as SVG elements.

Wwenleicao

75% match

Loading thumbnail…

Massachussetts Top 10 Crime City filter works

A dropdown menu filters a bar chart of the top 10 cities in Massachusetts by crime rate, comparing All, City, Rural, and Suburb community types. The bars display the crime ratio as a percentage, with hover tooltips showing exact values. Built with React and D3 v5, it uses `scaleBand`, `scaleLinear`, and `csv` to load and visualize 2016 crime data, with SVG rendering for the chart and axes.

Wwenleicao

75% match

Loading thumbnail…

Scatterplot of Boston Crime Data

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.

LLeah Mitchell

74% match