Skip to main content
SimilarExport ZIP
100%

Fork of ICE 8- WORLD MAP OF AMARNATH

✓ Published1🌍 Public
AAmar09nath
Last edited Apr 4, 2022
Created on Apr 3, 2022

This example displays a simple world map rendered in an SVG using a Mercator projection. The map is drawn with light green country polygons on a cyan background, with a title above it. The code uses D3 v4’s `d3.geoPath` and `d3.geoMercator` to project geographic data, and TopoJSON’s `topojson.feature` to extract country boundaries from the world-atlas dataset. The map is placed in a React-free HTML page with basic CSS styling.

AI-generated description

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

See also React Starter.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Fork of ICE 8- WORLD MAP OF AMARNATH

This example displays a static world map rendered with SVG paths, with each country filled in light green against a cyan background. The visualization uses D3 v4’s `d3.geoPath` and `d3.geoMercator` projection to draw geographic boundaries from TopoJSON data loaded via `topojson.feature`. The code fetches the world-atlas countries-10m dataset and appends a path element for each country, with basic margin and positioning handled through SVG attributes. No interactivity or data encoding beyond the map itself is present.

KKolliTeja
95% match
Loading thumbnail…

ICE 8- WORLD MAP OF AMARNATH

This example shows a static world map rendered as brown landmasses on a green SVG background, centered within a bordered HTML page. The visualization uses D3 v4’s `d3.geoPath` with a Mercator projection and TopoJSON data from the world-atlas package. The code fetches the land-10m.json file, converts its features via `topojson.feature`, and appends each as a `<path>` element to the SVG. A simple `styles.css` file sets the page background and centers the chart.

AAmar09nath
90% match
Loading thumbnail…

Fork of World Map : ICE-8

This example visualizes a world map using an azimuthal equidistant projection, with countries rendered as light green SVG paths over a blue sphere. It loads geographic data from the world-atlas TopoJSON dataset via `d3.json`, converts it to GeoJSON features using `topojson.feature`, and draws them with `d3.geoPath` and `geoAzimuthalEquidistant`. The code imports these functions from the d3 v5 and topojson libraries within a React framework context.

Aarcothanmukha
86% match
Loading thumbnail…

Fork of World_Map_ICE_8_2

This example renders a world map using the Eckert III projection, showing country boundaries as simple white-filled polygons with black outlines on a gray background. The visualization is built with React, which manages state and fetches GeoJSON country data from a CDN-hosted world atlas. D3.js version 5 handles the map projection and drawing through the `geoNaturalEarth1` and `geoPath` APIs, while the TopoJSON client converts the raw data into geographic features. The SVG output is styled with the Poppins font and presented in a fixed 900×500 viewport.

CChandrashekharRamamuthi
86% match
Loading thumbnail…

Fork of World_Map_ICE_8

This is a world map visualization rendered with SVG, depicting country borders and interior boundaries. The map uses an Eckert III projection, with landmasses filled in a light purple and graticules drawn in blue. It displays countries from the world-atlas TopoJSON dataset, with internal boundaries between countries highlighted in red. The visualization is built using React and D3, employing `d3.geoNaturalEarth1`, `d3.geoPath`, and `d3.geoGraticule` for geographic projections and path rendering, while `topojson.feature` and `topojson.mesh` process the spatial data.

VVAbhiram99
85% match
Loading thumbnail…

Fork of WORLD MAP FOR ICE-8

This visualization displays a world map rendered as green countries against a blue spherical backdrop. The map is built using D3.js v5 and the topojson library, with the geoNaturalEarth1 projection and geoPath function generating country boundaries. Country data comes from the world-atlas countries-110m.json dataset loaded via JSON. The React framework is not visibly used in the code; instead, the SVG rendering appends country paths directly after fetching and processing the geographic features.

Eeravellisaimeghana
85% match
Loading thumbnail…

Fork of ICE8 World Map

This example renders a world map using a Natural Earth projection via d3.geoNaturalEarth1 and d3.geoPath. Country boundaries are drawn as SVG paths from TopoJSON data loaded from a GitHub gist, with each country filled in teal and outlined with a faint red stroke. A light blue sphere path forms the globe’s background. The code uses d3.select, d3.json, and topojson.feature to process the geographic features.

KKolliTeja
85% match
Loading thumbnail…

Fork of ICE8 - World Map

This example shows a world map rendered as an SVG, with countries filled in light green and oceans in blue using a Natural Earth projection. It loads GeoJSON country boundaries from the world-atlas TopoJSON dataset and converts them with the `feature` method from TopoJSON. The visualization uses `d3.geoPath` with `d3.geoNaturalEarth1` to draw the sphere outline and country paths, with styling applied through CSS classes.

KKarnisrikanth
85% match