World Map

100%

✓ Published0🌍 Public

Last edited Nov 12, 2025

Created on Nov 12, 2025

This world map uses D3’s natural Earth projection to display landmasses in teal against a light graticule and sphere. The SVG marks define geographic paths for countries, interiors, and a globe outline, rendered via `d3.geoPath`. Topological data from the world-atlas package is processed with `topojson.feature` and `mesh` to derive boundaries. Built with React, the visualization updates once the JSON loads, though the initial state shows a loading message.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

World Map

This world map visualization displays landmasses and country borders using a natural Earth projection with d3.geoPath and d3.geoGraticule. The SVG rendering, built with React, layers a light gray sphere, teal land fills, green interior boundaries, and cyan graticule lines. Data comes from the world-atlas TopoJSON dataset, processed through topojson.feature and topojson.mesh to extract land geometry and internal borders. The visualization emphasizes clean, stylized geographic outlines rather than thematic data encoding.

Mmclee933

95% match

Loading thumbnail…

World Map

This world map displays global landmasses and country borders using a natural Earth projection. Built with React and D3 v7, it renders SVG paths via `d3.geoPath` and `geoNaturalEarth1`, overlaying a graticule grid and sphere outline. The visualization loads GeoJSON from the world-atlas TopoJSON dataset, converting it with the `topojson` library’s `feature` and `mesh` functions. Land areas are filled in teal, with interiors highlighted by a distinct stroke color.

Jjackcaldwellnichols

95% match

Loading thumbnail…

World Map

A world map rendered with D3’s geoNaturalEarth1 projection, drawn in SVG using d3.geoPath. The map displays landmasses filled with teal, country interiors as thin light-blue lines, and graticules in gray. Data comes from the TopoJSON World Atlas (countries-50m.json), processed via TopoJSON’s feature and mesh APIs. The React-based visualization shows a static globe with a subtle color scheme, prioritizing clean spatial form over interactivity.

WWolfgang

94% match

Loading thumbnail…

World Map

This visualization displays a world map using an SVG projection, with landmasses filled in teal, graticules in light gray, and country borders drawn as interior lines. The map is rendered with React and D3 v5, using `d3.geoNaturalEarth1` for the projection, `d3.geoPath` to generate paths, and `d3.geoGraticule` for the grid. Geographic data comes from the World Atlas TopoJSON file, which is loaded via `d3.json` and processed with `topojson.feature` and `topojson.mesh`. A subtle sphere outline frames the map against a neutral background.

Vvmonney

94% match

Loading thumbnail…

World Map

A world map displays Earth’s landmasses in teal and grey, with country borders drawn as interior lines. The visualization uses a natural Earth projection via `d3.geoNaturalEarth1` and renders geometric paths with `d3.geoPath`, including graticules and a sphere outline. Geographic data comes from the World Atlas TopoJSON file, processed with `feature` and `mesh` from the topojson library. React manages the component structure, while D3 handles the SVG path generation within a fixed 960×500 viewport.

KK3zter

94% match

Loading thumbnail…

World Map

This visualization presents a world map using D3's geoNaturalEarth1 projection, rendering landmasses in teal with country borders highlighted and graticules overlaid on a light gray sphere. The data comes from the World Atlas TopoJSON dataset (countries-50m.json), processed with topojson’s feature and mesh functions. React manages the SVG output, while D3’s geoPath and geoGraticule construct the geometric paths. The map emphasizes clean, minimalist styling with muted colors, illustrating global geography through a responsive, interactive-free interface.

AAudrey

94% match

Loading thumbnail…

World Map

This visualization displays a world map using a natural Earth projection, with landmasses rendered in teal against a light gray sphere and graticule grid lines. The map also highlights country borders through interior mesh strokes. Built with React and D3 v7, the code uses d3.geoNaturalEarth1, d3.geoPath, and d3.geoGraticule to project and draw geographic features. TopoJSON data from the world-atlas package is loaded and processed with topojson.feature and topojson.mesh to extract land polygons and interior boundaries.

Aahora

94% match

Loading thumbnail…

World Map

This world map uses a Natural Earth projection to display global landmasses and country borders. The visualization layers graticules, a sphere outline, land areas in teal, and interior boundary lines, all rendered as SVG paths. Built with React and d3-geo, it loads TopoJSON data from the World Atlas dataset, using d3.geoNaturalEarth1 and d3.geoPath to project features, while topojson.mesh draws country borders.

CCodeDuckie99

94% match