Public
Edited
Nov 22, 2023
Insert cell
Insert cell
Plot.plot({
inset: 40,
projection: {
type: "mercator",
domain: {
type: "MultiPoint",
coordinates: [[-122.434469, 47.495315], [-122.224433, 47.495315], [-122.434469, 47.734151], [-122.224433, 47.734151]]}
},
marks: [
Plot.sphere({fill: "lightblue"}),
Plot.geo(states, { fill: "black", stroke: "black", opacity: 1}),
Plot.raster(collisions, {x: "X", y: "Y", r: 4, fill: "year"}),
Plot.text(['Seattle collisions'], {x:-122.2, y: 47.612, dy: -240, dx: -100, frameAnchor: "middle", fontSize: 18, fontStyle: "oblique", lineWidth: 70, textAnchor: "start", lineHeight: 1.2, clip: false, fill: "gray", opacity: 1}),
Plot.text(['Data: IBM course capstone | Design: Deepsha Menghani\nThreads: @IandLoveAndData | Mastodon: @deepsha'], {x:-122.2, y: 47.612, dy: 220, dx: -170, frameAnchor: "middle", fontSize: 11, fontStyle: "oblique", lineWidth: 70, textAnchor: "start", lineHeight: 1.2, fill: "gray", opacity: 1}),



],
height: 500,
width: 500,
})
Insert cell
Insert cell
Plot.plot({
inset: 40,
projection: {
type: "mercator",
domain: {
type: "MultiPoint",
coordinates: [[-122.434469, 47.495315], [-122.224433, 47.495315], [-122.434469, 47.734151], [-122.224433, 47.734151]]}
},
marks: [
Plot.sphere({fill: "lightblue"}),
Plot.geo(states, { fill: "black", stroke: "black", opacity: 1}),
Plot.raster(collisions, {x: "X", y: "Y", r: 4, fill: "hr", interpolate: interpolateinput}),
Plot.text(['Seattle collisions'], {x:-122.2, y: 47.612, dy: -240, dx: -100, frameAnchor: "middle", fontSize: 18, fontStyle: "oblique", lineWidth: 70, textAnchor: "start", lineHeight: 1.2, clip: false, fill: "gray", opacity: 1}),
Plot.text(['Data: IBM course capstone | Design: Deepsha Menghani\nThreads: @IandLoveAndData | Mastodon: @deepsha'], {x:-122.2, y: 47.612, dy: 220, dx: -190, frameAnchor: "middle", fontSize: 11, fontStyle: "oblique", lineWidth: 70, textAnchor: "start", lineHeight: 1.2, fill: "gray", opacity: 1}), //Options: nearest, barycentric, random-walk
],
insetBottom: 20,
insetTop: 20,
height: 500,
width: 500,
})
Insert cell
Insert cell
collisions_2017.csv
Type Table, then Shift-Enter. Ctrl-space for more options.

Insert cell
import {states} from "ff0a83b495637684"
Insert cell

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.
Learn more