NJ Income Final

100%

NJ Income Final

✓ Published0🌍 Public

Last edited Aug 16, 2023

Created on Jul 31, 2023

This interactive visualization combines a bubble map of New Jersey with a linked histogram, showing income and population by ZIP code. Users can toggle between average income and population for bubble sizing, while brushing the histogram filters the map by age range. The map uses d3.geoMercator and d3.geoPath with TopoJSON county boundaries, while the histogram uses d3.histogram and d3.brushX. Circles are scaled with d3.scaleSqrt, and all rendering uses SVG within a React framework.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

NJ Income

This interactive visualization displays demographic and income data for New Jersey, showing population counts or average incomes as scaled circles positioned by geographic coordinates on a county map. Users select which attribute to display via a dropdown menu, while a histogram below shows age distribution, with a d3.brushX selection filtering the map circles to show only data within the selected age range. The map uses d3.geoMercator projection with d3.geoPath to render county boundaries from TopoJSON, while circles are sized with d3.scaleSqrt based on the chosen metric, with data sourced from a CSV file containing individual income records.

EEdison Gu

91% match

Loading thumbnail…

Fork of Migrant Deaths Linked Views with Fast Brushing

This example links a geographic bubble map of New Jersey counties with a time-series histogram, using color and size to convey the annual salary of migrant deaths. Brushing the histogram filters the map, with the selected time range visually isolated on the map. The visualization is built with React and D3 v5, using `d3.geoMercator` and `d3.geoPath` for the map projection, `d3.scaleSqrt` for bubble sizing, and `d3.brushX` for the interactive filter. Data on migrant deaths and county boundaries are loaded from CSV and TopoJSON sources.

EEdison Gu

71% match

Loading thumbnail…

Untitled

This visualization displays Massachusetts household income data by town, overlaid on an interactive Leaflet map. The map uses D3’s `geoPath` with a `geoTransform` to render census tract boundaries, with each town’s fill color mapped via `d3.scaleDiverging` based on the hhinc80k salary bracket. A separate canvas-based color ramp legend is generated using the Canvas API. The data is loaded from external GeoJSON and CSV files, with Leaflet providing the base tile layer and pan/zoom controls.

NNilla

69% match

Loading thumbnail…

Untitled

This map shows the population of individuals under 18 living in poverty across US counties in 2014, using red semi-transparent bubbles over a gray landmass with white state borders. The visualization loads TopoJSON data and renders it with `d3.geo.path` for geographic shapes, while bubble radii are scaled via `d3.scale.sqrt` based on population values. Hovering over a county triggers a tooltip displaying its name and population, and bubbles highlight with a darker stroke on mouseover. The SVG output includes static county and state paths, with the proportional bubbles layered on top.

JJoshua chirchir

67% match

Loading thumbnail…

County Bubbles

A map of the United States uses brown circles sized by county population, with a legend for reference and hover tooltips showing the county name and population. The visualization overlays these bubbles on a gray landmass with white state borders, placing each circle at its county’s centroid. Built with D3 v3, it loads a TopoJSON file containing merged county, state, and nation geometries, projects it via `d3.geo.albersUsa`, and draws the map with `d3.geo.path` while sizing bubbles with `d3.scale.sqrt`. Population data comes from the 2012 American Community Survey.

Mmbostock

67% match

Loading thumbnail…

Untitled

This visualization combines a bubble map of emergency reports with a date histogram. It uses React to render a Mercator projection of the Netherlands, plotting each incident as a red circle based on its coordinates. The accompanying histogram, built with d3's scaling, binning, and time-series functions, displays the daily count of reported incidents. Both views read from a CSV file containing geolocation and timestamp data.

Ssri7harsha

67% match

Loading thumbnail…

demographic school snapshot

This interactive dashboard presents a demographic snapshot of NYC crime incidents, linking a choropleth precinct map to a pie chart of crime types and bar charts for victim age, race, and sex through coordinated brushing and a reset button. It uses d3.geoPath with a Mercator projection to render the map and d3.arc for the pie, while animated transitions update all charts based on user selections. The code relies on d3.v6, d3-array, and d3-geo, with SVG and tooltips for hover details.

YYuan

66% match

Loading thumbnail…

Untitled

This visualization shows the under-18 population living in poverty across U.S. counties in 2014, using red semi-transparent bubbles overlaid on a map. Bubble size encodes population via a square-root scale, and tooltips display county names and populations on hover. The map is built with D3.js, using `d3.geo.path` for rendering topojson shapes, `d3.svg.arc` for bubble outlines, and `d3.json` to load data from a GitHub-hosted JSON file. The SVG output animates state borders and bubble hover effects.

JJingru Liu

66% match