Fork of Polished World Map(cities)

100%

Fork of Polished World Map(cities)

✓ Published1🌍 Public

Last edited Apr 4, 2024

Created on Apr 4, 2024

This D3 visualization presents a world map with city points sized by population, using a Natural Earth projection with graticules, sphere, and country interiors. Built with React, the code uses `geoNaturalEarth1`, `geoPath`, and `geoGraticule` from D3, along with a `scaleSqrt` for circle radii. City data is loaded from a CSV of world cities, while country boundaries come from World Atlas TopoJSON, both rendered as SVG paths and circles.

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

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

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

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

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

91% match

Loading thumbnail…

Fork of World maping with cities

This interactive map displays world cities with circle sizes proportional to population, overlaid on a geographic projection of Earth. It renders country landmasses, graticules, and interior borders using `d3.geoPath` with `geoNaturalEarth1` projection, while city positions are projected from latitude/longitude coordinates. Population values drive a square-root scale to determine circle radii. The visualization uses React hooks to load TopoJSON world atlas data and CSV city data, with d3.v5 handling geographic calculations and SVG rendering.

Ppatasky

90% match

Loading thumbnail…

Fork of WorldMap (mit Cities)

This is a world map visualization that displays global cities as circles, with their size scaled by population using a square root scale. The map is rendered using SVG paths and circles, with D3.js handling the geographic projections and data processing. The visualization uses `geoNaturalEarth1` for the map projection, `geoPath` for drawing countries and graticules, and `scaleSqrt` for city sizing. City and country data are loaded from external JSON and CSV sources, with React managing the user interface and rendering.

EEd Hutchinson

90% match