Skip to main content
100%

d3.carto.map - globe mode

✓ Published0🌍 Public
AAlan McConchie
Last edited Jan 13, 2016
Created on Jan 13, 2016

The d3.carto.map globe mode example renders an interactive globe with multiple map layers, using D3 v3 and the d3.carto.map library. The visualization combines a stamen.trianglegrid tile layer with a recursively generated tile layer, overlaid with GeoJSON country polygons. Countries with names shorter than six characters are extracted and rendered as SVG features with a distinct styling, while the full country set is drawn to canvas. The globe supports pan and zoom via the control buttons, and a minimap rectangle indicates the current viewport. Layer toggles are provided in a control panel, allowing users to switch between tile layers and feature sets. The example demonstrates d3.carto.map's ability to blend multiple data sources and rendering modes (canvas and SVG) in a 3D globe context.This example demonstrates **d3.carto.map** in globe mode, showcasing a full-featured interactive map with multiple data layers and rendering modes. Built with D3 v3, it combines a rotatable globe with tile layers, GeoJSON features rendered to canvas, and selected countries drawn as SVG. Users can toggle layers, pan, and zoom, with styling for country borders, roads, rivers, and custom point markers. The map also includes a minimap with extent rectangle and modal info popups, illustrating the library's capacity for rich, multi-layer cartographic visualization.

AI-generated description

A globe using orthographic projection with raster tiles from d3.carto.map.

The globe is covered by a triangular tesselation of the square mercator extent, projected onto a globe.

Similar vizzes