Skip to main content
Log in
S

suprithreddy267

@suprithreddy267·4 public vizzes

Loading thumbnail…

Choropleth Map with Interactive Filtering

A choropleth map colored by economy category uses color-coding to show global economic groupings, with a legend that filters countries by clicking a category or hovering to highlight. Built with D3.js v5, it projects geographic data using `d3.geoNaturalEarth1` and `d3.geoPath`, while an ordinal `scaleOrdinal` with `schemeSpectral` drives the fill colors. The map loads world atlas TopoJSON and TSV data, and the legend’s click handler toggles the selected value to adjust country opacity, with a zoom interaction via `d3.zoom`. Hovering a country turns it red, and tooltips display the country name and color value.

Apr 2, 2020
Loading thumbnail…

Choropleth Map with Interactive Filtering

A choropleth map colored by economy category uses color-coding to show global economic groupings, with a legend that filters countries by clicking a category or hovering to highlight. Built with D3.js v5, it projects geographic data using `d3.geoNaturalEarth1` and `d3.geoPath`, while an ordinal `scaleOrdinal` with `schemeSpectral` drives the fill colors. The map loads world atlas TopoJSON and TSV data, and the legend’s click handler toggles the selected value to adjust country opacity, with a zoom interaction via `d3.zoom`. Hovering a country turns it red, and tooltips display the country name and color value.

Apr 2, 2020
Loading thumbnail…

Choropleth Map with Interactive Filtering

This choropleth map displays global economic classifications by country, with a color legend that doubles as an interactive filter. Clicking a legend item dims all countries not in that category, while hovering over a highlighted country reveals its name and value via a native SVG tooltip. The map uses an orthographic natural Earth projection rendered as SVG paths, with zoom and pan enabled through d3.zoom. Data comes from the World Atlas TopoJSON and TSV files, processed with topojson.feature and d3.tsv. The color scale uses d3.scaleOrdinal with the Spectral scheme.

Apr 2, 2020
Loading thumbnail…

Choropleth Map with Interactive Filtering

A choropleth map colored by economy category uses color-coding to show global economic groupings, with a legend that filters countries by clicking a category or hovering to highlight. Built with D3.js v5, it projects geographic data using `d3.geoNaturalEarth1` and `d3.geoPath`, while an ordinal `scaleOrdinal` with `schemeSpectral` drives the fill colors. The map loads world atlas TopoJSON and TSV data, and the legend’s click handler toggles the selected value to adjust country opacity, with a zoom interaction via `d3.zoom`. Hovering a country turns it red, and tooltips display the country name and color value.

Apr 2, 2020