Fork of World Map

100%

Fork of World Map

✓ Published0🌍 Public

Last edited Aug 17, 2023

Created on Aug 17, 2023

This example renders a spherical world map inside an SVG, using a light blue sphere as the base and green landmasses with black outlines drawn on top. It shows the complete set of countries from the world-atlas TopoJSON dataset, projected with the Natural Earth projection. The code imports `geoPath`, `geoNaturalEarth1`, and the `feature` function from TopoJSON to convert the TopoJSON data to GeoJSON before drawing each country path.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of World Map

This example displays a world map using a natural Earth projection, with countries rendered as green landmasses against a light blue spherical backdrop. The visualization loads TopoJSON world data from the world-atlas package, converts it to GeoJSON using `topojson.feature`, and draws the paths with `d3.geoPath` and `d3.geoNaturalEarth1`. It also appends a sphere path to frame the projection, all rendered as SVG elements.

SstellaWangg

95% match

Loading thumbnail…

Fork of World Map

This example presents a natural Earth projection of the world map, rendered as an SVG with a light blue spherical background and green landmasses outlined in black. It loads world country boundaries from the world-atlas TopoJSON dataset via `d3.json`, converting them to GeoJSON with `topojson.feature`. The visualization uses D3 v5’s `geoNaturalEarth1` projection and `geoPath` to draw the sphere and country paths, demonstrating a straightforward choropleth-free geographic rendering workflow.

Aadapavaishnavi12

95% match

Loading thumbnail…

Fork of World Map

This example displays a natural Earth projection of the world map, with countries rendered as green landmasses on a light blue sphere. It uses D3 v5’s `geoNaturalEarth1` and `geoPath` to project and draw geographic features, while `topojson.feature` converts country boundaries from a TopoJSON world-atlas dataset loaded from unpkg. The SVG includes a background sphere path before adding individual country paths, resulting in a clean, stylized global visualization.

KKiran-tech007

94% match

Loading thumbnail…

Fork of World Map

This example renders a natural Earth projection world map using D3 v5 and TopoJSON. It displays countries as green landmasses with black strokes against a blue spherical backdrop. The code fetches world boundary data from the world-atlas package, converts TopoJSON to GeoJSON with topojson.feature, and visualizes it using d3.geoNaturalEarth1, d3.geoPath, and SVG paths. A pre-defined sphere path establishes the globe’s outline before country features are appended.

Ppemmasaniprudhvinadh

93% match

Loading thumbnail…

Fork of worldmap

This example displays a natural Earth projection world map, with countries filled in light green against a blue ocean sphere. It loads geographic data from the world-atlas TopoJSON file and converts it to GeoJSON using the `feature` method from topojson. The map is rendered as SVG paths, with the projection and path generation handled by `d3.geoNaturalEarth1` and `d3.geoPath`. A separate path outlines the globe’s sphere, while country borders use a subtle black stroke.

Aaruna-rajeswari

92% match

Loading thumbnail…

Fork of Forkcountry map

This example displays a world map with countries filled in light green against a blue sphere, using a natural Earth projection. It renders geographic features as SVG paths by loading world-atlas TopoJSON data and converting it to GeoJSON with topojson’s `feature` method. The map’s paths are generated with `d3.geoPath` and `geoNaturalEarth1`, while styling is applied through CSS classes for the sphere and country boundaries.

SSreejaBellamkonda

92% match

Loading thumbnail…

Fork of Topojson World Map

This example shows a world map rendered with a natural Earth projection, displaying country boundaries as green filled paths with subtle black strokes. The visualization loads geographic data from the world-atlas TopoJSON file and converts it to GeoJSON features using topojson’s `feature` method. The map is drawn with d3.geoPath and the d3.geoNaturalEarth1 projection, while a spherical outline is added as a distinct path. The code leverages d3.v5’s selection and data-joining capabilities to append each country’s path to an SVG.

Ccp571999

92% match

Loading thumbnail…

Fork of World Map

This fork of a world map projects countries onto a sphere, showing landmasses in green with black outlines over a light blue ocean. It builds the sphere and countries using D3 v5’s `geoNaturalEarth1` projection and `geoPath`, rendering the result as SVG paths. The data comes from the world-atlas 110m TopoJSON, which is converted to GeoJSON via TopoJSON’s `feature` function before being drawn.

MMahendraGullinkala

92% match