Skip to main content
SimilarExport ZIP
100%

Fork of Fork of Points on a Map

✓ Published0🌍 Public
Aasdfcvd70@gmail.com
Last edited Apr 10, 2024
Created on Apr 10, 2024

This map visualizes global cities with populations over 50,000, using data from the Simplemaps World Cities Database. The geographic context comes from World Atlas TopoJSON, including country boundaries, graticules, and a sphere outline. The visualization uses a React component with the `geoNaturalEarth1` projection and `geoPath` from d3.v5 to render SVG paths. Circles represent cities, positioned using the projection on latitude and longitude coordinates, with a semi-transparent teal fill to show density.

AI-generated description

A world map showing cities with population greater than 50,000. City data from Simplemaps: World Cities Database.

Country boundaries from World Atlas TopoJSON, polished for visual style, including graticules.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Fork of Points on a Map

This example displays a world map with cities having populations over 50,000, sourced from the Simplemaps World Cities Database, overlaid on country boundaries from the World Atlas TopoJSON. The visualization uses React for component management and d3.geoNaturalEarth1 projection with d3.geoPath to render the sphere, graticules, land, and interiors. City points are projected and drawn as semi-transparent circles, using d3.csv for data loading and topojson’s feature and mesh functions to prepare the geographic data.

Mmmei-d
95% match
Loading thumbnail…

Fork of Points on a Map

This visualization displays a world map with cities whose populations exceed 50,000, sourced from the Simplemaps World Cities Database. The map uses a natural Earth projection, rendered as SVG through React, with country boundaries from the World Atlas TopoJSON. D3's `geoNaturalEarth1` projection, `geoPath`, and `geoGraticule` functions draw the sphere, graticules, and landmasses, while city coordinates are projected and plotted as semi-transparent teal circles. The styling employs muted grays for geographic features, creating a clean backdrop for the city data points.

RRupendra Pamisetty
95% match
Loading thumbnail…

Fork of Points on a Map

This visualization displays over 4,000 cities with populations exceeding 50,000 as semi-transparent points on a natural Earth projection. The map includes geographic context through landmasses, graticules, and country borders. Using React with d3.geoNaturalEarth1 and d3.geoPath, it renders the World Atlas TopoJSON shapes as SVG paths, while city coordinates from the Simplemaps World Cities Database are projected to circles. The code demonstrates asynchronous data loading with d3.json and d3.csv hooks, filtering the initial dataset to only larger urban centers.

Aasdfcvd70@gmail.com
95% match
Loading thumbnail…

Fork of Points on a Map

This visualization displays a world map populated with circles representing cities with populations over 50,000. The map uses a Natural Earth projection with visible graticules, country boundaries, and landmasses rendered in muted grays. City coordinates are projected from longitude and latitude data using D3’s `geoNaturalEarth1` and `geoPath`, with circles drawn as SVG elements. The example is built with React, relies on D3 v5 for data loading and projection, and sources city data from Simplemaps and country boundaries from the World Atlas TopoJSON.

SSam
94% match
Loading thumbnail…

Fork of Points on a Map

This visualization displays a world map plotting cities with populations over 50,000 as semi-transparent teal dots, sourced from the Simplemaps World Cities Database. Country boundaries and graticules are rendered using D3’s geoNaturalEarth1 projection and geoPath, with data loaded via useWorldAtlas and useCities hooks that fetch TopoJSON and CSV files. React manages the component structure, while SVG circles mark each city’s projected coordinates.

Bbillmccabeusa@hotmail.com
94% match
Loading thumbnail…

Fork of Points on a Map

This visualization shows a world map depicting cities with populations over 50,000, drawn as semi-transparent teal dots. The country boundaries and graticules are rendered using D3’s `geoNaturalEarth1` projection with `geoPath`, while the city positions are projected from latitude and longitude coordinates. The map uses a React front-end with `useWorldAtlas` and `useCities` hooks to load TopoJSON land data and CSV city data from Simplemaps, displaying everything as SVG elements.

YYedrup
94% match
Loading thumbnail…

Fork of Points on a Map

This visualization displays a world map with points marking cities that have populations exceeding 50,000, drawn from the Simplemaps World Cities Database. Using React and D3 v5, the example projects geographic coordinates onto an SVG canvas with the geoNaturalEarth1 projection and geoPath. The map includes land masses, country interiors, and graticules from World Atlas TopoJSON, while semi-transparent teal circles represent each city, revealing population clusters across continents.

AAntonis Prodromou
94% match
Loading thumbnail…

Fork of Points on a Map

This example displays a world map with circles marking cities whose populations exceed 50,000, using data from Simplemaps. The visualization renders geographic features with d3.geoPath and geoNaturalEarth1, including land masses, graticules, and country interiors. City coordinates are projected onto the SVG using the same projection, with semi-transparent circles indicating locations. The map is built with React hooks, d3.v5, and TopoJSON for world atlas data.

Mmmei-d
94% match