Public
Edited
Sep 1, 2023
Insert cell
Insert cell
data.json
Type Table, then Shift-Enter. Ctrl-space for more options.

Insert cell
Plot.plot({
y: {grid: true},
symbol: {legend: true},
marks: [
Plot.dot(data, {x: (d) => d.shooterPosition.x, y: (d) => d.shooterPosition.y, fill: (d) => d.shotTypes.includes('miss') ? 'red' : 'green' }),
Plot.tip(data, Plot.pointer({
x: (d) => d.shooterPosition.x, y: (d) => d.shooterPosition.y,
title: (d) => [d.shooter, d.shotTypes.join(', '), d.goalie].join('\n'),
}))
]
})
Insert cell
shootingPercentage = []
Insert cell
Type JavaScript, then Shift-Enter. Ctrl-space for more options. Arrow ↑/↓ to switch modes.

Insert cell
Plot.plot({
marginBottom: 100,
x: {label: null, tickRotate: 90},
y: {grid: true},
color: {legend: true},
marks: [
Plot.barY(data, Plot.groupX({y: 'count'}, {x: "shooter"})),
Plot.ruleY([0])
]
})
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