d3 = require("d3@5")
topojson = require("topojson-client@3")
simple = require("simple-statistics@7.0.7/dist/simple-statistics.min.js")
//import the polygon base map data
basepolygons = FileAttachment("north_south_america_shapefiles.json").json()
americas_features = topojson.feature(basepolygons, basepolygons.objects.north_south_america_shapefiles)
csv_data = d3.csvParse(await FileAttachment("cleaned_primate_data@1.csv").text(),({lat, lng, accepted_name}) => [lat, lng, accepted_name])
primates = FileAttachment("cleaned_primate_data@1.csv").csv({typed: true})
mesh = topojson.mesh(basepolygons, basepolygons.objects.north_south_america_shapefiles, (a, b) => a !== b)
Plot.plot({
width: 800,
height: 600,
marginLeft: 0,
marginRight: 0,
projection: "Equirectangular",
fx: { tickFormat: (d) => `${d}’s`, padding: 0 },
facet: { data: primates, x: (d) => Math.floor(d.max_ma / 10) * 10 },
marks: [
Plot.geo(mesh, { clip: "frame", strokeOpacity: 0.1 }),
Plot.dot(primates, { x: "lng", y: "lat", r: 1, fill: "currentColor" }),
Plot.geo(americas_features, { clip: "frame" })
]
})
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.
