Public
Edited
May 16, 2023
Insert cell
import {high_school_data} from "80ec05330bb3aa8b"
Insert cell
Plot.plot({
marks: [
Plot.barY(high_school_data, {x: "year", y: "percent", fill: "year", sort: {x: "y", reverse: false}}),
Plot.ruleY([0])
],
// y:{
// domain: [0.2,0.90]
// },
color:{
legend: true,
type: "categorical"
}
})
Insert cell
steve_jobs_data.csv
Type Table, then Shift-Enter. Ctrl-space for more options.

Insert cell
Plot.plot({
marks: [
Plot.barY(steve_jobs_data, {x: "name", y: "share", fill: "name", sort: {x: "y", reverse: true}}),
Plot.ruleY([0])
],
color:{
legend: true,
type:"categorical"
}
})
Insert cell
Insert cell
Plot.plot({
y: {grid: true},
color: {legend: true},
marks: [
Plot.rectY(olympians, Plot.binX({y: "count"}, {x: "weight", fill: "sex"})),
Plot.ruleY([0])
]
})
Insert cell
import {pizzaorders} from "@observablehq/data-vis-course-assignment"
Insert cell
Plot.plot({
marks: [
Plot.barY(pizzaorders, Plot.groupX({y: "sum"}, {x: "day_of_week", y: "orders", fill: "state"})),
Plot.ruleY([0])
],
y: {
label: "↑ Orders (x 1000)",
grid: true,
transform: d => d / 1000
},
color: {
legend: true
},
marginLeft: 50
})
Insert cell
Plot.plot({
// facet: {
// data: pizzaorders,
// x: "state"
// },
marks: [
Plot.lineY( pizzaorders, Plot.groupX({y: "sum"}, {x: "orderDate", y:"total", z: "category", stroke: "category"}))
],
color: {
legend: true
},
marginLeft: 50
})
Insert cell
import {viewof table} from "46b74073aac7e024"
Insert cell
Plot.plot({
marks: [
Plot.ruleY([0]),
Plot.lineY(table, {x: "year", y: "revenues",stroke:"Blue"}),
Plot.lineY(table, {x: "year", y: "expenses",stroke:"Red"})
]})
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