ICE-8 part-A Task1 - World Map

100%

ICE-8 part-A Task1 - World Map

✓ Published2🌍 Public

Last edited Apr 3, 2022

Created on Apr 2, 2022

This visualization presents a world map with natural Earth projection, overlaid with animated points representing geographic locations from a SPARQL query. The map uses d3.geoPath and d3.geoNaturalEarth1 to render country boundaries and the ocean sphere, while circles mark queried coordinates. Points emerge with a bounce transition, increasing in radius over time. Data comes from the Netwerk Digitaal Erfgoed API, and the code relies on topojson for country features and d3.json for map data.

AI-generated description

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

Similar vizzes

Loading thumbnail…

ICE-8 World Map (Dhanusree Kodali)

This visualization presents a world map with data points plotted from a SPARQL query against the Netwerk Digitaal Erfgoed API. It uses a natural Earth projection via `d3.geoNaturalEarth1` and renders country boundaries with `d3.geoPath` from TopoJSON data. Each retrieved location appears as an animated circle that transitions from zero to its final radius using `d3.easeBounce`, with staggered delays. The map is drawn with SVG elements styled in CSS, and the code relies on D3 v5 and the TopoJSON library.

DDhanusree Kodali

92% match

Loading thumbnail…

ICE 8 World Map using D3

This visualization presents a world map using D3.js with an equal-area natural Earth projection, plotting over 1,500 data points retrieved from a SPARQL endpoint. Each point is drawn as an SVG circle whose coordinates are projected from longitude and latitude values. The map itself is rendered with `d3.geoPath` using TopoJSON country outlines. Circles appear sequentially with a staggered `transition` delay, using a bounce easing function to animate their scale from zero to full size, creating a cascading effect across the globe.

Ssowmyanagula@my.unt.edu

90% match

Loading thumbnail…

ICE 8 World Map using D3

This example shows a world map with animated circles that plot 1,500 museum object locations retrieved from a SPARQL endpoint, using a Natural Earth projection via `d3.geoNaturalEarth1` and `d3.geoPath`. Each location appears sequentially with a bounce easing effect, transitioning from radius 0 to 8 pixels using `transition.attr`. The map is rendered as SVG, with country boundaries from TopoJSON (world-atlas) and a light blue sphere. The code uses D3 v5 and TopoJSON to fetch and draw geographic features.

Vvidhyanamini

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

88% 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

87% match

Loading thumbnail…

ICE 8 : D3 World map

An interactive D3 world map plots up to 1,500 museum object locations as animated circles. The map uses a Natural Earth projection via `geoNaturalEarth1` and renders country boundaries with `geoPath` from TopoJSON data. Circle positions come from a SPARQL query against the Network of Digital Heritage API, with latitude and longitude mapped through the projection. Each point appears sequentially with a bouncing `transition` effect, styled as white circles over goldenrod countries on a black sphere.

SShreeti Upreti

87% match

Loading thumbnail…

ICE-8 World map

This example displays a world map using the Natural Earth projection via d3.geoNaturalEarth1 and d3.geoPath. Landmasses are filled in DarkCyan, with graticules rendered in LightBlue and country borders drawn in black. The map is built with React, loading geographic data from world-atlas TopoJSON, using topojson.feature and topojson.mesh to extract land and interior boundaries. The visualization is rendered as SVG, with a Poppins font and an Eckert III projection noted in the HTML.

Vvagdevi-369

87% match

Loading thumbnail…

ICE 8 : World Map

This example displays a world map using a natural Earth projection, with countries rendered as filled paths and a contrasting sphere background. The visualization loads geographic data from the `world-atlas` TopoJSON dataset, converting it to GeoJSON with TopoJSON’s `feature` function. The code uses D3 v5’s `geoPath`, `geoNaturalEarth1`, and `select`, appending SVG paths for each country, while styling is defined in CSS classes for the sphere and country fills.

NNITIN0601

87% match