Skip to main content
SimilarExport ZIP
100%

A9-World Choropleth Map

✓ Published0🌍 Public
Bbhavi.kenia@gmail.com
Last edited Apr 14, 2025
Created on Apr 14, 2025
Forked from HTML Starter

This is a choropleth map showing the global crime index by country, using a red sequential color scale where darker shades indicate higher crime levels. The visualization loads world GeoJSON boundaries and crime index data from a CSV, then renders each country as an SVG path via `d3.geoPath` with a Mercator projection. A tooltip displays the country name and crime index on hover, while the color scale is defined with `d3.scaleSequential` and `d3.interpolateReds`. Countries without data appear gray.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Map

This choropleth shows global crime rates by country, with a pink-to-purple sequential color scale indicating values from 0 to 50. The map uses the Natural Earth projection via `d3.geoNaturalEarth1` and renders country boundaries as SVG paths from the world-atlas TopoJSON dataset. A hardcoded `Map` object supplies crime values for a few nations (e.g., USA, India, China), which are mapped to fill colors using `d3.scaleSequential` with `d3.interpolateRdPu`. Interactive tooltips display each country’s crime rate or "No Data" on hover, driven by `d3.geoPath` and D3’s event listeners.

Eeeshani.boyapati@gmail.com
83% match
Loading thumbnail…

maps

This choropleth map shows U.S. state crime rates per 100,000 people, with states colored on a sequential orange-red scale based on values loaded from a CSV file. The visualization uses D3 v7 and TopoJSON to render state boundaries via `d3.geoAlbersUsa` projection and `d3.geoPath`, while encoding data with `d3.scaleSequential` and `d3.interpolateOrRd`. A canvas-generated gradient legend with a `d3.axisBottom` scale accompanies the SVG map, and hover interactions display crime values and state names in a tooltip.

Vvydeeshm@gmail.com
82% match
Loading thumbnail…

ICE8Wmap

This map shows global crime rates by country, using a yellow-to-red color scale to represent the range of synthetic crime rate values. Built with D3.js, it renders a Natural Earth projection using `d3.geoNaturalEarth1()` and draws country boundaries with `d3.geoPath()`. The code generates random crime rates and merges them with TopoJSON country data from the world-atlas package via `topojson.feature()`. It also adds a graticule layer with `d3.geoGraticule()` and an interactive color legend with axis labels.

Ddandamidhun41613@gmail.com
81% match
Loading thumbnail…

A9 World Choropleth Map

A9 World Choropleth Map visualizes GDP per capita across countries in 2022 using a Mercator projection and a threshold color scale from `d3.scaleThreshold` and `d3.schemeBlues`. The map, rendered as SVG, colors each country path via `d3.geoPath`, with gray for missing data, and includes interactive tooltips showing country name and GDP value on mouseover. A separate SVG legend, built with `d3.legendColor`, displays the color thresholds. The code loads GeoJSON country boundaries and CSV economic data using `d3.json` and `d3.csv` with a queued `d3.queue`.

Hhxu51@usfca.edu
80% match
Loading thumbnail…

Country map ICE 8

This choropleth map shows crime rate values for U.S. states, encoded with a threshold color scale ranging from light blue to dark navy. The map renders SVG paths via `d3.geoPath` with a `d3.geoAlbersUsa` projection, using TopoJSON data from the us-atlas repository. State values are loaded from a CSV file and mapped to fill colors, with a legend displaying the color bins alongside interactive tooltips on hover.

GGuntupalli Mohan kalyan
79% match
Loading thumbnail…

ICE 8 PART 1 CRIME RATE

This map visualizes homicide rates per 100,000 people for selected countries, using a red sequential color scale from light to dark to indicate increasing crime severity. Hovering over a country displays a tooltip with its name and specific rate, while nations without data appear grey. The visualization uses d3.geoNaturalEarth1 for projection, d3.geoPath for rendering country outlines from TopoJSON data via topojson.feature, and d3.scaleSequential with an interpolateReds interpolator. Interactivity relies on D3 event handlers for mousemove and mouseout, with the map rendered as an SVG.

Ssakethgoud333@gmail.com
79% match
Loading thumbnail…

proj-choropleth

This visualization animates through daily snapshots of reported crime counts across Chicago’s community areas. A sequential blue color scale, created with `d3.scaleSequential`, encodes each area’s crime total for the current date. Using `d3.geoMercator` and `d3.geoPath`, the example renders SVG paths from a GeoJSON file of community boundaries, with a transitioning fill color per area via `transition.attr`. The code loads crime data from a JSON file and updates the map as it cycles through available dates.

AAndrew Blakeslee Moore
79% match
Loading thumbnail…

A9 World Choropleth

This choropleth displays world happiness scores for 2022, coloring each country on a blue sequential scale and revealing its name and score on hover via SVG `<title>` tooltips. It loads CSV data and TopoJSON world geometry, then renders paths with `d3.geoPath()` and a Mercator projection. The implementation uses D3 v7, TopoJSON, and d3-legend, with color mapping from `d3.scaleSequential` and `d3.interpolateBlues`.

NNoah C.
79% match