Fork of World Map

100%

Fork of World Map

✓ Published0🌍 Public

Last edited Sep 4, 2023

Created on Sep 4, 2023

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.

AI-generated description

MIT Licensed

Similar vizzes

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

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

95% match

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 visualization displays a natural Earth projection of the world map with countries rendered in light green and oceans in sky blue. It uses D3 v5’s `geoNaturalEarth1` projection and `geoPath` to generate SVG paths from TopoJSON data sourced from the world-atlas package at 110m resolution. A sphere outline is drawn first, followed by country features parsed with TopoJSON’s `feature` method. The map is static, with no interactions or animations beyond the initial data join.

Ddineshtadepalli12

94% match

Loading thumbnail…

Fork of World Map

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.

Llakepee

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

93% match

Loading thumbnail…

Fork of

This example displays a world map using the Natural Earth projection, with countries filled in sky blue against a black spherical backdrop. The visualization loads geographic data from the World Atlas TopoJSON dataset via `d3.json`, then converts it to GeoJSON features using `topojson.feature`. The `d3.geoNaturalEarth1` projection and `d3.geoPath` render the countries as SVG paths, while a separate path for the sphere outlines the globe.

NNaveed945

93% match

Loading thumbnail…

Fork of World Map

This example displays a simple world map rendered with SVG paths. It depicts the Earth’s natural Earth projection with countries filled in blue and outlined in yellow, set against a green sphere. The code uses D3’s `geoNaturalEarth1` projection, `geoPath` for generating the path data, and `topojson.feature` to parse the world-atlas GeoJSON data loaded from a remote URL. The visualization appends each country path to the SVG canvas.

Cchandrakalavanukuri

93% match