Chloropleth Map

100%

Chloropleth Map - Interactive

✓ Published0🌍 Public

Last edited Dec 20, 2018

Created on Dec 19, 2018

This interactive chloropleth map displays global economic data by country, with a color legend that filters the map to highlight selected categories. The visualization uses D3 v5’s `geoPath` and `geoNaturalEarth1` projections to render the world map, while the legend leverages `scaleOrdinal` and `schemeSpectral` for color mapping. Users can click legend ticks to isolate specific economic classifications, with non-selected countries dimmed and the selected category emphasized. The map also supports zooming via D3’s `zoom` event, and country data is loaded from the world-atlas TopoJSON and TSV sources.

AI-generated description

About chloropleth map interactive filtering - see video

MIT Licensed

Similar vizzes

Loading thumbnail…

Chloropleth Map Interactive

This interactive choropleth map displays world countries colored by their economic classification using an ordinal color scale. Users can click legend items to filter and highlight countries matching the selected economy type, with non-matching countries fading to low opacity. The map uses d3.geoNaturalEarth1 projection and d3.geoPath for rendering country boundaries as SVG paths, with d3.zoom enabling pan and zoom interactions. Data comes from TopoJSON world atlas files, while the interactive legend is built with custom d3 selections and click handlers.

IIsabel

93% match

Loading thumbnail…

Interactive Chloropleath Map

This interactive choropleth map displays global economic classifications by country, with a color-coded legend that filters and highlights selected regions. The map uses D3 v5 with `geoNaturalEarth1` projection, `geoPath` for rendering SVG paths, and TopoJSON data from the world-atlas dataset. Users can click legend categories to emphasize matching countries while dimming others, and zoom/pan the map via D3’s `zoom` behavior. A spectral color scale maps ordinal economy values, with tooltips showing country names and values.

AAjit Singh

93% match

Loading thumbnail…

Chloropleth Map Interactive

A choropleth map shows world countries colored by economy type, with a legend that filters and highlights selected categories. The visualization supports zooming and panning, and dims non-selected countries while emphasizing those matching the chosen economy. It uses d3.geoPath with the geoNaturalEarth1 projection to render the map, and d3.scaleOrdinal with schemeSpectral for coloring. Country data comes from world-atlas TopoJSON and TSV files, with hover effects and a clickable color legend for interaction.

MMaxwell Dayvson da Silva

93% match

Loading thumbnail…

This choropleth map visualizes global economic classifications by coloring each country according to its economy type, with a color legend to the side. Built with D3 v5, it uses `d3.geoPath` with the Natural Earth projection to render country boundaries from TopoJSON data loaded from the world-atlas package. An ordinal color scale maps economic categories to the spectral scheme, while zoom interaction and hover highlighting are implemented via `d3.zoom` and CSS. The legend is generated as a reusable SVG component through custom functions.

Ffbudwill

92% match

Loading thumbnail…

Chloropleth Map with interactive filtering-1

A choropleth map displays global economic classifications, with a linked color legend for interactive filtering. Clicking a legend category dims non-matching countries and highlights those selected. The visualization uses d3.geoNaturalEarth1 and d3.geoPath for projection, d3.zoom for panning, and d3.scaleOrdinal with schemeSpectral for colors. Data comes from TopoJSON world-atlas and TSV metadata, rendered as SVG paths with hover effects.

Jjblaskovich

92% match

Loading thumbnail…

Chloropleth Map

This choropleth map displays countries colored by economic classification, with a color legend positioned in the lower-left corner and hover interactions that highlight individual nations. The visualization uses D3 v5 with d3.geoNaturalEarth1 for projection and d3.geoPath for rendering geographic features, while d3.zoom enables pan and zoom functionality. TopoJSON and TSV data from the world-atlas package populate the map, with d3.scaleOrdinal mapping economy categories to a spectral color scheme. SVG elements render all visuals, and the legend uses custom D3 scales and tick marks for clarity.

AAdrian Tan

91% match

Loading thumbnail…

chloropleth map

This choropleth map colors countries according to economic data, with a color legend and hover highlighting. The visualization uses D3 v5 with `d3.geoPath` and `d3.geoNaturalEarth1` for geographic projection, while loading world data from the world-atlas TopoJSON and TSV files. The color scale uses `d3.scaleOrdinal` with the Spectral scheme to map economic classifications. Users can pan and zoom via `d3.zoom`, and country names appear as tooltips on hover.

Aaidanoconnor1

91% match

Loading thumbnail…

Choropleth Map with Interactive Filtering

This choropleth map displays global economic data using a color scale, where users can click on color legend items to interactively filter the map. The map renders countries as SVG paths using `d3.geoPath` with a Natural Earth projection, while the legend employs `d3.scaleOrdinal` with a spectral color scheme. Hovering reveals country names and values via `<title>` elements. Clicking a legend category dims non-matching countries, and zooming is enabled through the `d3.zoom` module. Data originates from the world-atlas TopoJSON and TSV files.

ZZG

91% match