Fork of World Map

100%

Fork of World Map

✓ Published1🌍 Public

Last edited Apr 1, 2022

Created on Apr 1, 2022

This interactive map visualizes world countries using the Orthographic and Mercator projections, rendered as SVG paths. Users can drag to rotate the globe and click countries to switch between projections, with the United States uniquely triggering the Mercator view. The visualization uses `d3.geoPath`, `d3.geoGraticule`, and `d3.drag` for interaction, loading country boundaries from `world-atlas` JSON and names from TSV data. Hovering highlights countries, and a zoom API adjusts the SVG group’s transform.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Fork of Fork of World Map

This interactive map displays world countries using an orthographic projection by default, rendered as SVG paths. Users can rotate the globe by dragging, with d3.drag and d3.geoPath updating the projection dynamically. Clicking the United States switches to a Mercator projection via d3.geoMercator, while other clicks revert to orthographic. Country boundaries come from the world-atlas TopoJSON dataset, with names from a TSV file. Zooming is handled through d3.zoom, applying a transform to the map group.

DDivyaVellanki

95% match

Loading thumbnail…

Fork of Fork of Fork of Fork of World Map

This interactive map displays world countries using an orthographic projection that can be rotated by dragging, with a click on the United States switching to a Mercator projection. Built with D3.js and the d3-geo-projection library, it renders countries and a graticule as SVG paths via d3.geoPath. Country names come from a TSV file, while geometries load from world-atlas GeoJSON. The visualization also supports zooming through d3.zoom, and includes hover highlighting and animated projection transitions.

DDivyaVellanki

95% match

Loading thumbnail…

Fork of Fork of Fork of Fork of World Map

This interactive map displays world country boundaries using a draggable orthographic projection within an SVG. Users can click individual countries to toggle the view between the orthographic and Mercator projections. The visualization leverages d3.geoPath, d3.geoOrthographic, and d3.geoMercator from d3-geo-projection, with topojson for country features and world-atlas data. Drag interactions rotate the globe via projection.rotate, while zoom transformations adjust the SVG group. Country names are loaded from a TSV file and applied on click.

Ssaiteja0725

94% match

Loading thumbnail…

Fork of Fork of Fork of World Map

This example displays an interactive world map using D3.js and the d3-geo-projection library. Users can drag to rotate the orthographic projection and click on individual countries to toggle between orthographic and Mercator projections; clicking the United States switches to a US-focused AlbersUSA projection. The visualization renders country boundaries as SVG paths via d3.geoPath, with a graticule overlay, and uses d3.drag and d3.zoom for interaction. It loads geographic data from TopoJSON (world-atlas) and country names from a TSV file.

Bbindhureddy98

94% match

Loading thumbnail…

Fork of Fork of Fork of World Map

This interactive visualization displays a world map with multiple projection options, defaulting to an orthographic view. Users can drag to rotate the globe and click on countries to toggle between Mercator and orthographic projections—clicking the United States switches to Mercator, while other countries return to orthographic. The map uses topojson data from the world-atlas package to render country boundaries and includes a graticule overlay. Built with d3-geo-projection and d3-geoPath, it supports zooming and panning via d3.zoom, with SVG paths and transition animations for smooth updates.

DDivyaVellanki

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

93% match

Loading thumbnail…

Fork of Fork of Fork of World Map

This interactive world map visualizes geographic data using multiple map projections. Users can rotate the globe by dragging and switch between Mercator, orthographic, and Albers USA projections by clicking on countries. The visualization renders country boundaries as SVG paths using d3.geoPath, with data from the world-atlas package. A graticule overlays the map, and interactive zooming is enabled through d3.zoom while rotation utilizes d3.drag, both updating the projection's rotate and scale parameters dynamically.

DDivyaVellanki

93% match

Loading thumbnail…

Fork of Fork of World Map

This interactive map renders world countries from the `world-atlas` TopoJSON dataset, using a choice of either the orthographic or Mercator projection from `d3-geo-projection.v3`. Users can click a country to toggle between the two projections, and the map supports drag-to-rotate via `d3.drag()` and zooming through `d3.zoom()`, which applies an SVG transform. Country names are joined from a TSV file, and all paths are generated with `d3.geoPath`, with hover highlighting provided by CSS.

Bbindhureddy98

93% match