Skip to main content
SimilarExport ZIP
100%

ice8

✓ Published0🌍 Public
MMounika0927
Last edited Mar 29, 2023
Created on Mar 29, 2023
Forked from Simple World Map

This interactive world map demonstrates the use of three projections: Mercator, orthographic, and Albers USA, though the default view is orthographic. Users can drag to rotate the Earth and zoom with the mouse wheel. Clicking on countries switches between projections, with the United States triggering a Mercator projection. The code employs `d3.geoPath`, `d3.geoGraticule`, and `topojson.feature` to render country boundaries from the world-atlas dataset, including dynamic updates on projection changes.

AI-generated description

A basic world map.

See also:

MIT Licensed

Similar vizzes

Loading thumbnail…

ice8

This interactive map displays world countries and a graticule on a rotatable orthographic projection, with a click on the United States switching to a Mercator projection. The visualization uses D3’s `d3.geoPath`, `d3.geoProjection`, and `d3.geoGraticule` to render SVG paths, and supports dragging to rotate the globe. Country boundaries come from the world-atlas TopoJSON dataset, while names map via ISO codes from a TSV file. The animation transitions between projections using D3’s `.transition().duration(750)`.

MMounika0927
92% match
Loading thumbnail…

ICE-8 World Map

This interactive world map lets users explore country boundaries by clicking on them, which switches the projection between Mercator and orthographic views, with the United States triggering a third Albers USA projection. Built with D3 v6 and TopoJSON, the visualization uses d3.geoPath to render country shapes from world-atlas data, while d3.drag and d3.zoom enable rotating the orthographic globe and panning/zooming the map. A graticule overlay and country hover effects are drawn as SVG paths, with transitions animating projection changes.

Ddheeraj1509
91% match
Loading thumbnail…

ice8

This interactive world map visualization displays country boundaries over a graticule, with smooth rotation and zoom controls. Users can drag to reorient the orthographic projection, scroll to zoom, and click countries to switch between Mercator and orthographic views. The code uses `d3.geoPath`, `d3.geoOrthographic`, and `d3.geoMercator` projections, with TopoJSON data from world-atlas and country names from a TSV file. The visualization renders in SVG with animated transitions, graticule overlays, and hover highlighting. Drag interactions rotate the projection using `projection.rotate`, while zoom transforms affect the entire SVG group.

PPujitha14challagulla
90% match
Loading thumbnail…

ICE-8-Ali-Shah

This example presents an interactive world map using a rotating orthographic globe, with the option to switch to a Mercator projection. Users can drag to rotate the globe and click on a country to change projections, such as zooming into the United States. The visualization loads geographic data from the world-atlas TopoJSON and TSV files, rendering country boundaries and graticules via `d3.geoPath`. It leverages D3.js v6, including `d3.geoOrthographic`, `d3.geoMercator`, `d3.drag`, and `d3.zoom`, with SVG elements for crisp rendering.

AAli Shah Solanki
89% match
Loading thumbnail…

ICE-8(11630234)

This visualization displays a world map using an orthographic projection, with country boundaries rendered as SVG paths. Users can click on any country to switch projections: clicking the United States switches to a Mercator projection, while clicking any other country returns to the orthographic view. The map supports dragging to rotate the globe and zooming via `d3.drag` and `d3.zoom`. Data is loaded from the World Atlas TopoJSON files, with country names mapped from TSV data. The code uses `d3.geoPath`, `d3.geoOrthographic`, `d3.geoMercator`, and `d3.geoGraticule`.

KKovvuri Supraj
89% match
Loading thumbnail…

Fork of Fork of ice8

This interactive globe visualization displays world country boundaries on a draggable, rotatable orthographic projection. Users click countries to toggle between global orthographic and Mercator projections, with the United States triggering a specialized Albers USA view. The code uses d3.geoPath for rendering, d3.drag for rotation, d3.zoom for scaling, and d3-geo-projection for alternate projections. Country boundaries come from TopoJSON world-atlas data, with names matched via TSV, rendered as SVG paths with hover highlighting and smooth update transitions.

Aajaysonu
86% match
Loading thumbnail…

World_Map_ICE_8

This example displays an interactive world map using the Eckert III projection, rendered as an SVG with React and D3 v5. It fetches geographic data from the world-atlas TopoJSON file and uses `d3.geoNaturalEarth1` with `fitSize` to project the map, while `d3.geoPath` draws the country boundaries. The code also includes support for switching to a U.S. counties view, using `d3.geoAlbersUsa` and the us-atlas dataset, though only the world map is activated by default.

CChandrashekharRamamuthi
86% match
Loading thumbnail…

Fork of Fork of Fork of World Map

This example presents an interactive world map that toggles between Mercator, orthographic, and Albers USA projections. Users can drag to rotate the orthographic globe and click countries to switch projections, with the United States triggering a Mercator view. Built with d3-geo, topojson, and world-atlas data, it uses d3.geoPath for rendering countries and graticules, d3.drag for rotation, and d3.zoom for panning. The SVG output features styled country polygons with hover effects and smooth transition animations during projection changes.

Ssaiteja0725
85% match