Fork of world map

100%

Fork of world map

✓ Published0🌍 Public

Last edited Nov 9, 2025

Created on Nov 9, 2025

This fork visualizes a world map using a light pink color scheme, displaying country boundaries and a graticule over a styled globe background. The rendering uses D3 v7 with the `d3.geoNaturalEarth1` projection and `d3.geoGraticule` for grid lines, while country shapes are loaded from a world-atlas TopoJSON file and converted using `topojson.feature`. The code leverages `d3.select`, `d3.json`, and the D3 `path` generator to draw the geographic data as SVG paths.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of world map

This fork of a world map visualizes country boundaries using a Natural Earth projection, with each nation rendered as a violet SVG path with black strokes on a pink sphere. The code loads TopoJSON country data from the world-atlas package, converts it to GeoJSON using `topojson.feature`, and projects it with `d3.geoPath` and `d3.geoNaturalEarth1`. Hover effects are styled via CSS, while the map is static without zoom or interaction.

Sshreyasribearelly@gmail.com

91% match

Loading thumbnail…

Fork of world map

This visualization displays a world map using a natural Earth projection, with countries rendered in red against an orange sphere. The map is drawn as SVG paths using `d3.geoNaturalEarth1` and `d3.geoPath`, with geographic data loaded from a TopoJSON file hosted on GitHub. The code imports `feature` from `topojson` to convert the TopoJSON topology into GeoJSON features, then appends each country path to the SVG. Styling is defined in a separate CSS file, outlining countries with black strokes.

Bbhargavarathod

90% match

Loading thumbnail…

Fork of World Map

This example uses D3 to render a fork of a world map, displaying country boundaries as light green vector shapes on a white background through an SVG canvas. The visualization applies a Natural Earth projection using `d3.geoNaturalEarth1` and generates the geographic paths with `d3.geoPath`. It loads GeoJSON data from the `world-atlas` package, parses the countries using `topojson`, and draws each feature onto the SVG. The output is a static equirectangular-style map highlighting national borders with subtle black strokes.

NNaimisha-M

90% match

Loading thumbnail…

Fork of World Map

This visualization displays a world map with country boundaries and graticules, rendered as SVG paths. The map uses a natural Earth projection via `geoNaturalEarth1` and `geoPath` from D3 v5, with land areas filled in orange against a black sphere backdrop. It loads geographic data from World Atlas TopoJSON and processes it with `topojson.feature` and `topojson.mesh` to extract land polygons and interior borders between countries, which are stroked in light blue. The React components encapsulate the data-loading hook and mark-rendering logic.

Bbhargavarathod

90% match

Loading thumbnail…

Fork of Map

A world map rendered as an SVG displays all countries in light blue with white borders, centered using a Natural Earth projection. The visualization loads GeoJSON country boundaries from the world-atlas TopoJSON file via `d3.json`, converts the data with `topojson.feature`, and draws each country as a `path` element using `d3.geoPath` with the `d3.geoNaturalEarth1` projection. The map is static, with styling applied through a CSS class, and handles data-loading errors in the console.

Ppvvaishnavi93@gmail.com

89% match

Loading thumbnail…

Fork of World Map

This visualization displays a world map using a natural Earth projection, with land masses rendered in a light purple fill on a white spherical background. The example loads GeoJSON data derived from the world-atlas TopoJSON file and uses `d3.geoNaturalEarth1` for projection, `d3.geoPath` for path generation, and `topojson.feature` for data conversion. A sphere is drawn first to provide the globe’s outline, followed by country paths. The stylesheet defines distinct colors for the sphere, land, and extra strokes, though the latter two are not actively applied in the current code.

MMahendraGullinkala

89% match

Loading thumbnail…

Fork for the world map

This visualization displays a global map with countries rendered in yellow against a purple sphere, using a natural Earth projection. The code employs D3 v5’s `select`, `json`, `geoPath`, and `geoNaturalEarth1` functions, alongside the TopoJSON `feature` API to convert topojson country boundaries into SVG paths. The map data is fetched from a GitHub-hosted worldmap.json file, with each country drawn as a filled path with a black stroke. The static SVG canvas is sized at 1600×1000 pixels.

Rrohinikotha

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

89% match