Day 21: RasterDay 10: North AmericaDay 30: My favoriteDay 8: AfricaDay 14: EuropeDay 9: HexagonsTurkey vulture migrations in South AmericaDay 3: PolygonsDay 18: AtmosphereDay 29: PopulationDay 2: LinesDay 28: Is this a chart or a mapDay 23: 3DDay 11: RetroDay 20: OutdoorsDay 16: OceaniaDay 13: ChoroplethProjection importsDay 6: AsiaDay 4: Bad mapDay 17: FlowDay 1: Points
Day 7 - Navigation
Plot.plot({
insetLeft: 50, insetTop: 50,
insetRight: 50, insetBottom: 50,
marginBottom: 20,
color: {legend: false, type: "categorical", range: ["orange", "#008080"], style: {fontSize: "21px"}},
width: 600,
projection: {
type: "mercator",
domain: {type: "MultiPoint",coordinates: [[ -124.4920, 32.5243 ],
[ -114.5562, 32.5243 ],
[ -124.4920, 42.0195 ],
[ -114.5562, 42.0195 ]]
}},
marks: [
Plot.sphere({fill:"gray"}),
Plot.geo(states, {fill: "white", opacity: 1, stroke: "black", strokeWidth: 5, filter: d=>d.properties.name == "California"}),
Plot.voronoi(amtrak_locations, {x: "Longitude", y: "Latitude", fill: "Division", opacity: 0.2, stroke: "gray", title: d=>d.statename + "\n" + d.Division, filter: d=>d.State== "CA"}),
Plot.density(amtrak_locations, {x: "Longitude", y: "Latitude", fill: "Division", r:1, opacity: .1, title: d=>d.statename + "\n" + d.Division, filter: d=>d.State== "CA"}),
Plot.dot(amtrak_locations, {x: "Longitude", y: "Latitude", fill: "Division", r: 5, title: d=>d.statename + "\n" + d.Division, filter: d=>d.State== "CA"}),
Plot.dot(amtrak_locations, {x: "Longitude", y: "Latitude", fill: "white", r: 3, title: d=>d.statename + "\n" + d.Division, filter: d=>d.State== "CA"}),
Plot.text([`California Amtrak\nstation network`], {x:-124.4920, y:40.5243, dx: 220, dy:-0, frameAnchor: "middle", fontSize: 30, fontStyle: "oblique", fontWeight: "bold", lineWidth: 70, textAnchor: "start", lineHeight: 1.2, clip: false, fill: "#ccc", opacity: 1}),
Plot.text(['Pacific\n\n\n '],{x:-124.4920, y:32.5243, dy: -85, rotate: -32, fontSize: 25, fill: "#003747", opacity: 0.8, lineHeight: 1.2, fontStyle: "italic", fontWeight: "Bold"}),
Plot.text([' \n\n\nSouthwest'],{x:-124.4920, y:32.5243, dy: -85, rotate: -32, fontSize: 25, fill: "#a35900", opacity: 0.8, lineHeight: 1.2, fontStyle: "italic", fontWeight: "Bold"}),
Plot.text([`Data: data.world | Design: Deepsha Menghani | Threads: IandLoveandData | Mastodon: Deepsha`], {x:-126.4920, y:32.5243, dy:30, frameAnchor: "middle", fontSize: 14, fontStyle: "oblique", lineWidth: 70, textAnchor: "start", lineHeight: 1.2, clip: false, fill: "#ccc", opacity: 1})
],
})
amtrack_locations.csv
Type Table, then Shift-Enter. Ctrl-space for more options.
import {nation} from "ff0a83b495637684"
import {states} from "ff0a83b495637684"
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.
