Q3 — VizHub

100%

Q3

✓ Published0🌍 Public

Last edited Apr 25, 2024

Created on Apr 25, 2024

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.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Choropleth Map Analysis

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.

GGeorge Oyosa

85% match

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

80% 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

77% match

Loading thumbnail…

Choropleth Map with D3.js

This choropleth map visualizes global income groups using a color scale based on the Spectral scheme. The map is rendered with SVG paths generated by D3.js’s `geoPath` projection, and the world country boundaries come from the `world-atlas` TopoJSON dataset. Users can zoom and pan the map via the `zoom` event, and a color legend displays the ordinal scale’s categories. Data is loaded from the TSV file, merged with geographic features, and country names and income groups appear on hover via tooltips.

Ddanhuijia

77% 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

77% 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

77% match

Loading thumbnail…

Choropleth Map

This choropleth map colors world countries by income group, using a spectral color scale with an accompanying legend. The visualization is built with D3.js, using `d3.geoPath` and `d3.geoNaturalEarth1` for map projection and rendering, and `zooming` via `d3.zoom` event handling. Country data comes from the `world-atlas` package, with income group information joined from a TSV file, and the map supports hover highlighting.

Iianleekq

77% 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

76% match