Skip to main content
SimilarExport ZIP
100%

Fork of Polished World Map

✓ Published0🌍 Public
Jjchen6912
Last edited May 8, 2022
Created on May 8, 2022
Forked from 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.

AI-generated description

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

MIT Licensed

Similar vizzes

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
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 interactive world map displays country boundaries, graticules, and city populations using a natural Earth projection. Cities are rendered as semi-transparent circles whose radii scale with population using a square-root scale. Built with React and D3 v5, it loads geographic data from the World Atlas TopoJSON, processes it via `topojson.feature` and `topojson.mesh`, and draws the visualization as SVG using `d3.geoPath` and `d3.geoGraticule`.

Sstefanpullen
94% match
Loading thumbnail…

Fork of Polished World Map

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.

MMinh Luong
93% match
Loading thumbnail…

Fork of Fork of Polished World Map

This fork of a polished world map visualizes global country boundaries using data from the World Atlas TopoJSON, rendered with React and d3. The map displays a natural Earth projection with graticules, landmasses filled in teal, and interior borders highlighted. The code uses `d3.geoPath` with the `geoNaturalEarth1` projection to draw shapes, while topojson's `feature` and `mesh` functions prepare the geographic data. The visualization includes a sphere outline, graticule grid, and styled land and interior paths in SVG, with explicit CSS for colors.

Kkarumanchimanasa
92% match
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
92% match
Loading thumbnail…

Fork of Polished World Map

This fork of a polished world map uses D3’s `geoNaturalEarth1` projection and `geoPath` to render both country boundaries and graticules over a gray sphere. It loads world topology from the World Atlas TopoJSON via `d3.json`, then converts the land and interior meshes with `topojson.feature` and `topojson.mesh`. React components structure the SVG output, while CSS styles the land in teal and highlights interior borders with a contrasting stroke. The visualization updates asynchronously, displaying a loading prompt until the geographic data arrives.

Aallnichols
92% match
Loading thumbnail…

Fork of Polished World Map

This map shows country boundaries and graticules projected with d3.geoNaturalEarth1 and rendered as SVG paths via d3.geoPath. The visualization uses world-atlas TopoJSON data, with countries filled in teal and internal borders drawn as thin lines. A single red circle marks the coordinates (130, 20). The React component loads the data with d3.json and topojson.feature/mesh, while custom CSS styles the sphere, graticules, land, and interior strokes.

Tthe-1000th-summer
92% match