Choropleth Map Analysis

100%

Choropleth Map Analysis

✓ Published2🌍 Public

Last edited Apr 16, 2024

Created on Apr 16, 2024

Forked from Task8

This interactive choropleth map displays global data science salaries, using a color scale from dark purple to bright yellow to represent the salary ranges across countries. Users can filter the map's color distribution through two sliders that adjust the minimum and maximum salary values, while hovering over individual countries reveals a tooltip with the country name and its corresponding salary figure. The visualization is built with D3.js, utilizing `d3.geoMercator` for map projection, `d3.geoPath` to render country boundaries, and a `d3.scaleLinear` color scheme, with data sourced from a CSV file and world geometry from a GeoJSON file.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Project

This interactive choropleth map visualizes global data science salaries using a color gradient, with a World Atlas TopoJSON topology rendered via D3’s `geoMercator` projection and `geoPath`. Users filter salary ranges with two sliders that adjust the color scale domain, and hover tooltips display country-specific earnings. The map includes zoom functionality via `d3.zoom`, with salary data sourced from a CSV hosted on GitHub.

VVenkataSatyaRamKamini@my.unt.edu

87% match

Loading thumbnail…

Q3

This choropleth map visualizes the distribution of salaries by country, using a blue color scale to indicate aggregated mean salary values. The map renders geographic boundaries from a GeoJSON file ("world_map.geojson") onto an SVG canvas. It loads salary data from a hardcoded array, aggregates entries via `d3.rollups` and `d3.mean`, and colors each country path with a sequential interpolator (`d3.interpolateBlues`). Countries without matching salary data appear gray. The visualization relies on `d3.geoPath` for path generation and D3's `d3.json` loader to fetch the map data.

Ssindhuja27b@gmail.com

85% match

Loading thumbnail…

Choropleth Map

This choropleth map displays global income groups using a color scale applied to each country’s territory. The visualization employs d3.geoPath with a natural Earth projection to render the GeoJSON features, while d3.scaleOrdinal and schemeSpectral map income categories to colors. A custom color legend, built with select and merge, appears on the left. The map supports zooming via d3.zoom, and hovering highlights countries in red. Data comes from the world-atlas TopoJSON and TSV files, processed with topojson.feature.

PPiotr Paszek

83% match

Loading thumbnail…

Choropleth Map

This choropleth map colors world countries by income group using a categorical color scale with a spectral scheme. The visualization supports zooming and panning through d3.zoom, with country names and income groups revealed via tooltips on hover. Built with d3.geoPath and geoNames from the world-atlas TopoJSON dataset, it renders as SVG paths over a blue sphere. A custom color legend component displays the ordinal scale’s domain, while hover interactions highlight individual countries in red.

Mmla341

82% match

Loading thumbnail…

Choropleth Map with D3.js!

This choropleth map visualizes global income groups using D3.js to color each country based on its economic classification. Built with d3.geoNaturalEarth1 projection and d3.geoPath, the SVG renders geographic boundaries from TopoJSON data sourced from the world-atlas package, with income labels joined from a TSV file. The map includes an ordinal color scale using d3.scaleOrdinal and d3.schemeSpectral, supplemented by a custom color legend component. Interactive features include zooming via d3.zoom and hover effects that highlight individual countries in red.

CCarloWK1202

81% match

Loading thumbnail…

Choropleth Map

This choropleth map visualizes countries colored by income group using a natural Earth projection. It loads world geometry from TopoJSON and joins it with TSV metadata via d3.json and d3.tsv, then renders paths with d3.geoPath. A d3.scaleOrdinal with a schemeSpectral range assigns colors, and an interactive legend built with d3-selection shows the categorical scale. The map supports zooming through d3.zoom and highlights countries on hover via CSS.

Ooptimizeresume

81% match

Loading thumbnail…

Choropleth Map w Interactive Filtering

This choropleth map displays global income groups, color-coded using a spectral scale and an interactive zoom projection built with D3’s geoNaturalEarth1 projection and geoPath. The map renders country boundaries from World Atlas TopoJSON and TSV data, with a custom legend generated by colorLegend.js. Users can pan and zoom via the zoom overlay, while hovering over a country highlights it in gray and reveals its name and income group in a tooltip. The visualization demonstrates SVG-based DOM manipulation and event handling through D3’s selection and event APIs.

Cceresfin

81% match

Loading thumbnail…

(interactive) Choropleth Map

This interactive choropleth map visualizes global economic data across countries using a spectral color scale. The map supports zooming and panning via d3.zoom, with a clickable color legend that highlights matching countries and dims others. Built with d3-geoPath and a Mercator projection, it renders SVG paths from TopoJSON data sourced from the world-atlas dataset. The legend uses d3.scaleOrdinal and d3.schemeSpectral to map categorical values to colors, with opacity transitions indicating selection state.

ZZY Huang

81% match