Petroff QuincuncialTwo point equidistantCylindrical Equal-Area ProjectionsSatellite ExplorerHufnagelGeoTIFF contours IIGs50Lee Oblated StereographicModified Stereographic AlaskaMiller Oblated StereographicInterrupted Homolosine OceansInterrupted Mollweide OceansFoucautGringorten QuincuncialWaterman’s ButterflyPolyhedral GnomonicGingeryGilbertFoucaut SinusoidalPolyhedral CollignonCollignonCylindrical Equal-AreaCraigCrasterCylindrical StereographicEckert IEckert IIEckert IIIEckert VEckert VIEisenlohrFaheyGinzburg IVGinzburg VGinzburg VIGinzburg VIIIGinzburg IXGringortenGuyouHammer RetroazimuthalHEALPixEckert IVHill EucyclicLagrangeLarrivéeLaskowski Tri-OptimalLittrowLoximuthalRobinsonRectangular PolyconicPolyconicPatterson CylindricalNell–HammerNatural Earth IIFlat-Polar QuarticFlat-Polar ParabolicMillerFlat-Polar SinusoidalTimesVan der Grinten IVan der Grinten IIVan der Grinten IIIVan der Grinten IVWagner IVKavrayskiy VIIWagner VIWagner VIIWiechelWinkel TripelInterrupted SinusoidalPeirce QuincuncialBottomleyWernerBonneAtlantisMollweide HemispheresInterrupted MollweideInterrupted Goode HomolosineGoode HomolosineBromleyInterrupted Boggs EumorphicSinu-MollweideMollweideSinusoidalBoggs EumorphicBerghaus StarBaker DinomicAugustArmadilloAitoffAiry’s Minimum-ErrorHammerBriesemeisterInterrupted Sinu-Mollweide
Satellite
projection = d3.geoSatellite()
.translate([width / 2, height / 2])
.scale(5500)
.center([-2, -1])
.rotate([76, -34, 32])
.tilt(25)
.distance(1.1)
.clipAngle(Math.acos(1 / 1.1) * 180 / Math.PI)
.precision(0.1)
map = {
const context = DOM.context2d(width, height);
const path = d3.geoPath(projection, context);
context.beginPath(), path(land), context.fill();
context.beginPath(), path(graticule), context.strokeStyle = "#aaa", context.globalAlpha = 0.4, context.stroke();
context.beginPath(), path(sphere), context.strokeStyle = "#000", context.stroke();
return context.canvas;
}
height = width * 1.6
sphere = ({type: "Sphere"})
graticule = d3.geoGraticule().step([1, 1])()
us = FileAttachment("us-land.json").json()
land = topojson.feature(us, us.objects.land)
topojson = require("topojson-client@3")
d3 = require("d3-geo@2", "d3-geo-projection@3")
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.
