World Map ICE 8 Sai Nikitha

100%

World Map ICE 8 Sai Nikitha

✓ Published0🌍 Public

Last edited Apr 10, 2023

Created on Apr 10, 2023

This example displays a world map using an equirectangular projection, with all countries rendered as grey SVG paths with black borders. It uses the TopoJSON `feature` API to extract country geometries from the world-atlas dataset, and D3 v5’s `geoPath` and `geoEquirectangular` to generate the paths. A white sphere outline represents the Earth’s boundary. Hovering over any country turns it blue via a CSS `:hover` rule, providing an interactive visual response without additional JavaScript.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

World Map ICE 8

This visualization displays a global world map using the equirectangular projection, with countries rendered as individual SVG paths filled in brown and outlined in black. The sphere background is shaded blue, and hovering over any country highlights it in a darker orange. It uses D3 v5’s `geoPath` and `geoEquirectangular` functions together with TopoJSON’s `feature` method to convert country boundaries from the world-atlas dataset. The map is drawn entirely with SVG elements, and interactivity is handled by CSS hover selectors.

Mmboinapally17

90% match

Loading thumbnail…

ICE-8 World Map

This example displays a world map using an equirectangular projection, rendered as an SVG with D3 v5. The visualization shows all countries from the world-atlas TopoJSON dataset, filled in yellow with red borders, and highlights each country in gray on hover. It uses `d3.geoPath` with a `geoEquirectangular` projection and processes the TopoJSON data through the `feature` method from the topojson library to generate geographic paths.

IIndhuKrishnaraj

89% match

Loading thumbnail…

Nikhil ICE 8 WORLD MAP

This visualization presents a world map using the equirectangular projection, rendering countries as green paths on a blue spherical background. It loads geographic data from the `world-atlas` TopoJSON dataset, which is converted to GeoJSON using the `topojson.feature` function. The map is drawn with D3 v5’s `geoPath` and `geoEquirectangular` APIs into an SVG, with static styling applied via CSS classes for the sphere and country outlines.

NNikhilMakkena

89% match

Loading thumbnail…

World Map ICE 8

This example displays a world map using an equirectangular projection, with individual countries colored brown against a blue sphere background. Hovering over a country highlights it in dark orange. The visualization is rendered as SVG using D3 v5, with geographic paths generated by `d3.geoPath` and country boundaries derived from the world-atlas TopoJSON dataset. The `geoEquirectangular` projection defines the map layout, while CSS hover rules handle the interactive highlighting.

EEeshwarReddy

89% match

Loading thumbnail…

WorldMap ICE by Tejaswi_Tummala

This example displays a world map using a simple equirectangular projection, with countries rendered as white paths with red outlines on a bisque-colored sphere. It relies on D3 v5’s `geoEquirectangular` and `geoPath` to generate the SVG paths, and TopoJSON’s `feature` method to parse country boundaries from the world-atlas `countries-110m.json` dataset. The map highlights countries in gray on hover, and the visualization is entirely constructed with SVG elements.

Tttummala17

89% match

Loading thumbnail…

Fork of World Map ICE-8

This example displays a world map using an equirectangular projection, with countries rendered as white paths with green strokes on a teal sphere. It loads geographic data from the world-atlas TopoJSON file, converting it to GeoJSON with `topojson.feature` and projecting it via `d3.geoEquirectangular` and `d3.geoPath`. The map supports hover interactions, highlighting countries in green when the mouse passes over them.

Nnikhitha693

88% match

Loading thumbnail…

ICE:8 World Map

This example displays a world map rendered as an SVG, using an equirectangular projection to plot countries from the world-atlas TopoJSON dataset. A light blue sphere path provides the ocean background, while each country is drawn as a brown filled path with black strokes. The visualization is built with D3 v5, specifically using `d3.geoEquirectangular()` for projection, `d3.geoPath()` to generate SVG path data, and the TopoJSON client’s `feature()` function to extract GeoJSON from the loaded data.

SSharmaAshwini

88% match

Loading thumbnail…

ICE - 8 - World Map

This example displays an interactive world map using an equirectangular projection, with countries rendered as SVG paths and a light blue sphere representing the globe. The map loads GeoJSON data from a hosted JSON file, processed through TopoJSON’s `feature` method, and draws each country with a green fill and black stroke. Hovering over a country highlights it in a warm peach color. The visualization uses D3 v5 APIs including `d3.geoEquirectangular`, `d3.geoPath`, and `d3.select`, with React as the underlying framework.

IIndiraSiripurapu

88% match