Activity-8.5.2

100%

Activity-8.5.2

✓ Published0🌍 Public

Last edited Jul 19, 2023

Created on Jul 10, 2023

This example displays a map of Nepal, rendered as an SVG using a Mercator projection. It loads world-atlas GeoJSON data from a CDN and filters it for the Nepal geometry. The code uses D3 v5 functions like `d3.json`, `d3.geoMercator`, `d3.geoPath`, and the `topojson-client` library to project and draw the country's boundary.

AI-generated description

An example showing the capabilities of VizHub:

Loads D3 via UNPKG.
Demonstrates use of import from "d3".
Demonstrates use of import from local ES6 modules.

MIT Licensed

Similar vizzes

Loading thumbnail…

Assignment 2.6.2

This example displays a choropleth map of Nepal, rendered as a green SVG path with a red stroke. It fetches the world-atlas GeoJSON dataset from a CDN and isolates the Nepal geometry using TopoJSON. The code projects the shape with a Mercator projection via `d3.geoMercator` and draws it using `d3.geoPath`, styling it with inline attributes.

Ppjdhungana@gmail.com

89% match

Loading thumbnail…

Activity-8.5.1

This example displays an interactive world map using a spherical projection, rendered as SVG paths. It loads geographic data from a TopoJSON file via `world-atlas@2`, converting it to GeoJSON features with `topojson.feature`. The visualization supports zooming through `d3.zoom`, and styles continents with `d3.geoPath` and `geoEquirectangular`. Hovering over countries changes their fill color to maroon.

Ppjdhungana@gmail.com

84% match

Loading thumbnail…

Activity 8 Country

This example displays a map of India using a Mercator projection, rendered as an SVG path. It loads country boundary data from the world-atlas TopoJSON file hosted on jsDelivr, then extracts India’s geometry with `topojson.feature`. The code uses `d3.geoMercator` and `d3.geoPath` to project and draw the shape, fitting it to a 960×500 viewport via `fitSize`.

LLakshmanRangisetti

82% match

Loading thumbnail…

Activity 8 Task 5-2 Country

This example displays a map of India rendered as an SVG path, centered within a 960-by-500 viewport. It uses D3 version 5 and TopoJSON to load the world-atlas dataset, extract the country’s geometry by name, and project it with a Mercator projection fitted to the country’s bounds. The `d3.geoPath` generator then draws the boundary, with no additional styling or interactive elements.

VVishnu Sudireddy

82% match

Loading thumbnail…

Activity 8 Country

This example displays a map of India, rendered as a single SVG path using a Mercator projection fitted to the country’s boundaries. The code loads the World Atlas TopoJSON dataset, extracts the India geometry, and draws it with D3’s `d3.geoMercator` and `d3.geoPath` functions. It reads geographic data from a remote JSON file and projects it to a 960 by 500 pixel canvas.

NNagateja99

82% match

Loading thumbnail…

Activity 8 Country

This example displays a map of India rendered as an SVG path, centered and scaled using a Mercator projection. The code loads world country boundaries from the World Atlas TopoJSON dataset via `d3.json`, extracts India’s geometry with `topojson.feature`, and fits it to a 960×500 viewport using `d3.geoMercator().fitSize`. A single path drawn with `d3.geoPath` visualizes the country’s outline. The visualization demonstrates loading external JSON, filtering TopoJSON features, and projecting geographic data entirely with D3 v5.

Mmn0658

82% match

Loading thumbnail…

Activity 8_Task5_2

This example displays a choropleth-style map of India rendered as an SVG path using D3 v5. It loads world-atlas TopoJSON data, extracts the India geometry, and applies a Mercator projection with `d3.geoMercator` and `d3.geoPath`. The map is fitted to a 960x500 viewport using `fitSize`, and the resulting path is drawn onto an SVG element. The code demonstrates TopoJSON client usage and geographic path generation.

AArun Pratap

82% match

Loading thumbnail…

Activity 8 Country

This example displays a map of India using a Mercator projection. It fetches country boundary data from the world-atlas TopoJSON source, isolates the geometry for India, and renders it as a single SVG path using `d3.geoMercator()` and `d3.geoPath()`. The code highlights a minimal workflow for drawing a single country with D3.

NNukaShravanKumar

81% match