Skip to main content
SimilarExport ZIP
100%

ICE 8 TASK 1.1

✓ Published0🌍 Public
Uuguggila@gitam.in
Last edited Nov 10, 2025
Created on Nov 10, 2025

This visualization shows a static world map using a Natural Earth projection, with country boundaries drawn as light gray SVG paths against a blue ocean sphere. It uses D3 v7 and topojson-client to load and convert the world-atlas TopoJSON dataset at 110m resolution. The map renders each country via `d3.geoPath` and adds a tooltip title showing the country name from the TopoJSON properties.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

ICE 8-1

This visualization displays a world map using the Natural Earth projection, with countries filled in pastel green and separated by white borders. The map loads country boundaries from the world-atlas TopoJSON dataset via d3.json, then converts them to GeoJSON features using topojson.feature. Each country path is rendered as an SVG element through d3.geoPath, and hovering reveals the country name through an appended SVG title tooltip. The code relies on d3.v7 and the topojson library for geographic data handling.

Aanirudhrao345@gmail.com
91% match
Loading thumbnail…

ICE8 - World Map

This visualization displays a world map using a natural Earth projection, with countries rendered as filled SVG paths and a light blue sphere representing the globe. The map loads geographic data from the world-atlas TopoJSON dataset, then converts it to GeoJSON features via the topojson library’s `feature` function. The D3.js `geoNaturalEarth1` projection and `geoPath` API generate the country boundaries, which are styled with a pale fill and semi-transparent black strokes against a white background.

Mmosesimmanuelvemana@my.unt.edu
90% match
Loading thumbnail…

ICE 8 world map

This example displays a world map rendered from TopoJSON country boundaries, with each country filled in light blue and outlined in blue. The visualization uses d3.geoPath with a d3.geoNaturalEarth1 projection to convert geographic data into SVG paths. It loads the worlddata.csv file from a GitHub gist, extracts the country features using the topojson.feature API, and maps them onto a 960x500 SVG canvas.

Ggayathri
90% match
Loading thumbnail…

ICE-8 WORLD MAP

This visualization displays a world map using a natural Earth projection, rendering countries as green filled polygons with blue strokes. The code loads geographic data from the world-atlas TopoJSON source and converts it using `topojson.feature`, then applies `d3.geoPath` with `d3.geoNaturalEarth1` to generate SVG paths. A blue sphere outline highlights the globe’s boundary. The countries appear as static shapes without interaction, with styling defined via CSS classes for the sphere and country paths.

Ssaidhiraj16
89% match
Loading thumbnail…

ICE 8 World Map

This example displays a world map using a natural Earth projection, rendering countries as white shapes with dark blue outlines against a light blue ocean sphere. It loads geographic data from the world-atlas TopoJSON dataset via `d3.json`, converts it to GeoJSON with TopoJSON’s `feature` function, and draws paths using `d3.geoPath` and `d3.geoNaturalEarth1`. The visualization is built with D3 v5 and rendered as SVG elements.

SSnapika
89% match
Loading thumbnail…

ICE-8 World Map

This visualization displays a world map using a Natural Earth projection, rendering each country as a distinct SVG path colored in a muted green with thin gray borders. It loads world country boundaries in TopoJSON format from the world-atlas package, converts them to GeoJSON using the topojson library, and draws them with d3.geoPath. The map is centered and scaled within a 960-by-500-pixel SVG canvas.

HHarshithmullapudi@my.unt.edu
89% match
Loading thumbnail…

ICE-8 World Atlas

This visualization displays a world map using the Natural Earth projection, filling landmasses in green with black borders and the ocean sphere in orange. It loads country boundaries from a TopoJSON file via the `json` method, then converts them to GeoJSON using `feature` from Topojson. The map is rendered as SVG paths with `d3.geoPath` and `d3.geoNaturalEarth1`. The code asynchronously fetches data and appends country paths to the SVG, with styling defined in external CSS.

Llikith1266
89% match
Loading thumbnail…

ICE 8 World Map with Topojson Data

This visualization displays a world map rendered as an SVG, with country boundaries drawn from TopoJSON data sourced from the world-atlas dataset. It uses D3 v5’s `d3.geoPath` and `d3.geoEquirectangular` to project and draw each country as a blue path with white strokes, while a white sphere outlines the globe. The `topojson.feature` method converts the TopoJSON topology into GeoJSON features for rendering. Hovering over any country changes its fill color to orange via CSS.

Ddivyakota99
89% match