Fork of Polished World Map

100%

Fork of Polished World Map

✓ Published1🌍 Public

Last edited Jan 15, 2022

Created on Jan 9, 2022

This example shows a world map with country boundaries, graticules, and city points sized by population. The visualization uses a Natural Earth projection via `d3.geoPath` and `d3.geoNaturalEarth1`, with land and interior borders rendered from World Atlas TopoJSON. City data comes from a CSV of world cities, and circle radii are scaled with `d3.scaleSqrt` based on population. The map is built with React components, styled in SVG, and uses D3 v5 for geographic and data-processing tasks.

AI-generated description

A world map showing country boundaries and cities from World Atlas TopoJSON, polished for visual style, including graticules.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Polished World Map

This example displays a natural Earth projection world map with country boundaries, graticules, and city markers scaled by population. The visualization uses React to render SVG elements, with d3-geo’s `geoNaturalEarth1` and `geoPath` for the projection and paths, and `geoGraticule` for the grid. City data comes from a CSV of world cities, with population values mapped through d3’s `scaleSqrt`. Land and interior borders are derived from World Atlas TopoJSON via topojson’s `feature` and `mesh` functions.

Mmikekslv

95% match

Loading thumbnail…

Fork of Polished World Map

This visualization presents a natural Earth projection world map with country boundaries, graticules, and city locations. The map uses d3.geoNaturalEarth1 and d3.geoPath to render land masses and interiors from World Atlas TopoJSON data, while circles sized by population via d3.scaleSqrt represent cities from a CSV dataset. Built with React and D3 v5, the SVG rendering applies subtle gray styling to geographical features and semi-transparent teal dots for urban centers.

Ssteelerfan107

94% match

Loading thumbnail…

Fork of Polished World Map

This example displays a world map with country boundaries and graticules using a Natural Earth projection. The visualization uses the `d3.geoNaturalEarth1`, `d3.geoPath`, and `d3.geoGraticule` APIs from D3 to render the map, with React managing the SVG output. The data is loaded from the World Atlas TopoJSON file via the `topojson` library, which provides both land polygons and interior boundaries for countries. The map is styled with a light gray sphere background, teal land and boundary colors, and subtle graticule lines.

VViệt An

94% match

Loading thumbnail…

Fork of Polished World Map

This fork of a polished world map visualizes global city populations using a natural Earth projection. The visualization displays landmasses, country interiors, graticules, and a sphere outline, with city markers sized proportionally to population using a square root scale. It loads TopoJSON country boundaries from the world-atlas package and city data from a CSV file, processing them with d3's geoNaturalEarth1, geoPath, and geoGraticule utilities. The React rendering uses SVG paths and circles, styled with custom CSS classes for a clean, refined aesthetic.

Jjchen6912

93% match

Loading thumbnail…

Fork of Polished World Map

This map visualization displays global city populations as proportional circles overlaid on a world map with country boundaries, graticules, and interior borders. The map uses a Natural Earth projection, with data sourced from the World Atlas TopoJSON and a clean CSV of world cities. Built with React and D3 v5, the code leverages `d3.geoNaturalEarth1`, `d3.geoPath`, and `d3.geoGraticule` for the geographic elements, while `d3.scaleSqrt` maps population values to circle radii. The SVG rendering is styled with a cohesive gray and teal palette.

Bbgeffrault

93% match

Loading thumbnail…

Fork of Polished World Map

This example displays a polished world map with country boundaries, rendered as an SVG using the natural Earth projection. The visualization shows landmasses in teal, graticules, and country interior borders, all styled with custom CSS. It uses React to manage the component hierarchy, with `d3.geoNaturalEarth1` and `d3.geoPath` for projection and path generation, and `d3.geoGraticule` for the grid overlay. Data is loaded from the World Atlas TopoJSON using `d3.json` and processed with `topojson.feature` and `topojson.mesh` to extract land and interior boundaries.

DDIANJING FAN

93% match

Loading thumbnail…

Fork of Polished World Map

This example displays a world map with country boundaries, graticules, and a stylized color scheme using React and D3 v5. The map is rendered as SVG through the `geoNaturalEarth1` projection and `d3.geoPath`, with data sourced from World Atlas TopoJSON. The code uses `d3.geoGraticule` to draw grid lines and TopoJSON’s `feature` and `mesh` methods to extract land polygons and interior borders. The sphere is filled light gray, land is teal, and boundaries are highlighted in a contrasting color.

Bbhargavarathod

93% match

Loading thumbnail…

Fork of Polished World Map

This example displays a world map with country boundaries and graticules, rendered with a clean, polished color palette. It uses the `geoNaturalEarth1` projection and `geoPath` from d3-geo to draw land masses, while `geoGraticule` generates the grid lines. React components manage the SVG rendering, and the data comes from the World Atlas TopoJSON dataset, with country interiors extracted using `topojson.mesh`. The map is styled with CSS, including a light gray sphere background and teal land fill.

TThiago Sawada

92% match