Skip to main content
SimilarExport ZIP
100%

ICE8_SBA

✓ Published1🌍 Public
SSai Bhavana Akkineni
Last edited Jul 9, 2022
Created on Jul 7, 2022
Forked from World Map

This visualization displays a world map using a Natural Earth projection, with countries rendered as green polygons and the sphere filled with deep sky blue to represent oceans. The d3 library’s `geoPath` and `geoNaturalEarth1` projection are employed to transform geographic data, and `topojson` is used to extract country features from a JSON file hosted on a CDN. The map is drawn as SVG paths, with landmasses outlined in black for clarity.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

See also React Starter.

MIT Licensed

Similar vizzes

Loading thumbnail…

ICE-8 world map

This visualization displays a world map using a natural Earth projection, with countries rendered as light green filled paths with subtle dark strokes against a blue sphere background. The map is built with D3 v5’s `geoNaturalEarth1` projection and `geoPath`, drawing geographical features from TopoJSON data loaded via `json()`. Country boundaries are extracted using `topojson.feature` and appended as SVG paths to the document, demonstrating a straightforward choropleth-free geographic rendering.

VVaishnavi6199
90% match
Loading thumbnail…

ICE-8 world map

This visualization displays a world map using a natural Earth projection, with countries rendered as light green filled paths with subtle dark strokes against a blue sphere background. The map is built with D3 v5’s `geoNaturalEarth1` projection and `geoPath`, drawing geographical features from TopoJSON data loaded via `json()`. Country boundaries are extracted using `topojson.feature` and appended as SVG paths to the document, demonstrating a straightforward choropleth-free geographic rendering.

VVaishnavi6199
90% match
Loading thumbnail…

ICE-8 world map

This visualization displays a world map using a natural Earth projection, with countries rendered as light green filled paths with subtle dark strokes against a blue sphere background. The map is built with D3 v5’s `geoNaturalEarth1` projection and `geoPath`, drawing geographical features from TopoJSON data loaded via `json()`. Country boundaries are extracted using `topojson.feature` and appended as SVG paths to the document, demonstrating a straightforward choropleth-free geographic rendering.

VVaishnavi6199
90% match
Loading thumbnail…

ICE 8- World Map

This visualization displays a world map using a natural Earth projection, rendered as SVG paths. Countries appear in green with brown outlines against a steel-blue sphere, conveying a simple geographic overview. The map draws country boundaries from the world-atlas JSON dataset, which is loaded and processed using D3’s `json` and `geoPath` functions with the `geoNaturalEarth1` projection, while TopoJSON’s `feature` extracts the country geometries. The code builds the map with D3 v5, appending sphere and country paths to the SVG canvas.

AAmruthaVee
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
90% match
Loading thumbnail…

ICE 8 (World Map)

This visualization displays a world map using a natural Earth projection, with each country rendered as a distinct SVG path. The map is initially presented as a grey sphere with countries shown in their default color, and hovering over a country highlights it in blue with a white outline. The code uses D3.js v5 and the topojson library to fetch geospatial data from the world-atlas dataset and convert it into geographic features via `d3.geoPath` and `projection`. The rendering approach leverages the `geoNaturalEarth1` projection for a visually balanced earth representation.

Pprashanth yamala
89% match
Loading thumbnail…

ICE - 8: World Map

This visualization displays a world map using a natural Earth projection, rendered as SVG paths. Countries are filled with green and outlined with subtle strokes, while the surrounding sphere is colored light blue. The code uses D3 v5's `geoNaturalEarth1` projection and `geoPath` to generate paths, with TopoJSON's `feature` extracting country boundaries from the world-atlas dataset. It appends a sphere path first, then loads country geometries asynchronously from the CDN-hosted TopoJSON file.

PPYATA SHARAN
89% 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
89% match