Public
Edited
Oct 26, 2023
8 forks
17 stars
Spilhaus shoreline mapNew Jersey State PlaneCustom cartesian projectionU.S. state choroplethWorld choroplethSpike mapBubble mapChoroplethRotating orthographicOceansWinding orderOrthographic shadingSolar TerminatorU.S. airports VoronoiStar mapSolar pathRaster tilesThreshold ChoroplethMapbox Vector TilesRaster Tiles (Canvas)Raster & vector IIClipped map tilesGraticule labels (stereographic)Sketchy EarthCloud ContoursCountries by AreaVector fieldRaster & vectorVector tilesHexbin mapAntimeridian CuttingWorld AirportsWorld Airports DelaunayWorld airports Voronoiprojection.reflectXTesting projection visibilityNon-contiguous cartogramVersor ZoomingThree-Axis RotationContext to CurveOrthographic to equirectangularU.S. Map with Puerto RicoProjection TransitionsZoom to bounding boxZoomable Raster & VectorWorld Map (SVG)Web Mercator tilesU.S. Map (Canvas)Bivariate choroplethProjection comparisonCassiniWorld tourU.S. State CapitalsWorld map (canvas)U.S. MapConic Equal-AreaTransverse MercatorVersor draggingStereographicGnomonicOrthographicMercatorAzimuthal Equal-AreaAzimuthal EquidistantEquirectangularConic ConformalTobler–MercatorConic EquidistantNatural EarthEqual EarthOrthographic (SVG)Quantile Choropleth
Tissot’s indicatrix
Also listed in…
Gallery
circles = {
const step = 10;
const circle = d3.geoCircle().center(d => d).radius(step / 4).precision(10);
const coordinates = [];
for (let y = -80; y <= 80; y += step) {
for (let x = -180; x < 180; x += step) {
coordinates.push(circle([x, y]).coordinates);
}
}
return {type: "MultiPolygon", coordinates};
}
height = {
const [[x0, y0], [x1, y1]] = d3.geoPath(projection.fitWidth(width, outline)).bounds(outline);
const dy = Math.ceil(y1 - y0), l = Math.min(Math.ceil(x1 - x0), dy);
projection.scale(projection.scale() * (l - 1) / l).precision(0.2);
return dy;
}
outline = ({type: "Sphere"})
graticule = d3.geoGraticule10()
land = topojson.feature(world, world.objects.land)
world = FileAttachment("land-50m.json").json()
d3 = require("d3-geo@3", "d3-geo-projection@4")
import {projectionInput} from "@d3/projection-comparison"
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
