Fork of ICE-8

100%

✓ Published0🌍 Public

Last edited Nov 1, 2025

Created on Nov 1, 2025

Forked from ICE-8

This choropleth shows a world map with countries colored by their Pasta Variety Index, a higher value indicating more varieties. Hovering reveals each country’s value via a tooltip. Built with D3 v7 and TopoJSON, it uses `d3.geoMercator` and `d3.geoPath` to project the 110m country outlines, with a sequential `YlOrRd` color scale mapping values from 4 to 13. The map fetches world-atlas data asynchronously and renders to SVG.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of ICE8

This world choropleth displays a static color-coded map of countries, with data provided inline in the code rather than through an external CSV file. The visualization uses D3.js version 7 to render the geographic boundaries via `d3.geoPath` and applies sequential color scales to encode values. It relies on the TopoJSON client library to load and convert geographic data for the map’s projection. A hover tooltip is implemented using a fixed overlay that shows details, though no value labels are present on the map itself.

BBHUMIKA CHUNDU

88% match

Loading thumbnail…

Fork of ICE-8 1A kumar danam

This example shows a choropleth world map using Natural Earth projection to display numeric values for selected countries, with a sequential YlGnBu color scale indicating magnitude. Tooltips reveal ISO numeric country IDs and their values on hover. It loads world-atlas TopoJSON data, renders via SVG, and employs d3.geoNaturalEarth1, d3.geoPath, d3.scaleSequential, and d3.csvParse. A gradient legend with a linear axis communicates the value range at the bottom.

KKumar Danam

84% match

Loading thumbnail…

Fork of ICE8-network

This example displays a world map with sample population values shaded using a blue sequential color scale. It uses D3 v7’s `d3.geoNaturalEarth1` projection and `d3.geoPath` to render countries from TopoJSON data sourced from world-atlas’s `countries-110m.json`. Hovering over a shaded country reveals a tooltip with the population value; countries without data appear gray. The code applies a logarithmic domain to the color scale and relies on `topojson-client` for GeoJSON conversion, with SVG output.

Ssaiprasadpilla937@gmail.com

83% match

Loading thumbnail…

Fork of ICE 08 11540905

This interactive map displays the world's countries, rendered as SVG paths filled with a green color and outlined in black. The visualization uses D3.js version 5 and the TopoJSON library with the `geoEquirectangular` projection and `geoPath` to draw the map, pulling country boundaries from the world-atlas dataset (countries-110m.json). Upon hovering over a country, its fill color changes from green to blue, providing a simple interactive feedback mechanism.

SstellaWangg

83% match

Loading thumbnail…

Fork of ICE-8 world map

This fork of ICE-8 displays a world map with countries rendered as orange shapes outlined in red, set against a sky-blue sphere. It uses D3 v5’s `geoNaturalEarth1` projection and `geoPath` to draw the geographic features from a TopoJSON file loaded via `json()`. The map is rendered as SVG, with each country appended as a path element, while the sphere background is drawn separately. The styling applies low stroke opacity to create a subtle border effect.

GGARIDIDEEKSHITHREDDY

83% match

Loading thumbnail…

Fork of ICE 8 country map

This map visualization renders global country boundaries using a Mercator projection, with each country filled by a categorical color scheme. Built with React and D3 v5, the code loads TopoJSON data from a GitHub gist, processes it using the `topojson` feature API, and draws paths via `d3.geoPath` with a `geoMercator` projection. The SVG output responds to hover events by turning countries green, while a title shows each country’s interpolated value. The visualization includes a heading and uses the `d3.schemeCategory10` palette for initial coloring.

Aamiralitah

83% match

Loading thumbnail…

Fork of ICE8 - World Map

This visualization displays a world map using the Natural Earth projection, with countries rendered as orange polygons outlined in black against a blue background. The code loads geographic data from the world-atlas TopoJSON dataset via `d3.json`, converts it to GeoJSON using `topojson.feature`, and draws the map with `d3.geoPath` and `geoNaturalEarth1`. An additional path element draws a circular outline defined through the projection. The visualization uses D3 v5 to bind country features to SVG paths, producing a static, styled geographic overview.

MMgk1255

83% match

Loading thumbnail…

Fork of ICE-8 WORLD MAP

This choropleth map displays 2023 population figures for major countries, using a yellow-to-red color ramp to encode population in millions. It renders a Natural Earth world atlas with a natural Earth projection, drawing graticule lines and country polygons as SVG paths via `d3.geoPath` and `d3.geoNaturalEarth1`. Country data comes from a CSV of global metrics, joined to map features by name. Interactive tooltips are implemented with `d3.select` and DOM elements, while a linear color scale (`d3.scaleLinear`) maps population values to the sequential color scheme.

Sskmriyaz0786@gmail.com

83% match