Mathematical engineer. Software developer at Act Now Coalition.
Plot.plot({
marks: [
Plot.dot(cars, {x: "power (hp)", y: "economy (mpg)"})
]
})
Plot.plot({
marks: [
Plot.dot(cars, {x: "power (hp)", y: "economy (mpg)", r: "weight (lb)", fill: "cylinders"})
],
color: {
domain: [3, 4, 6, 8],
legend: true
}
})
Plot.plot({
marks: [
Plot.dot(carMakes, {x: "power (hp)", y: "make", fill: "cylinders", r: "economy (mpg)", title: "name",
sort: {y: "x", reverse: true}})
],
color: {
domain: [3, 4, 6, 8],
legend: true
},
marginLeft: 100
})
Plot.plot({
marks: [
Plot.dot(olympians, {x: "weight", y: "sport", sort: {y: "x"}})
],
y: {
domain: ["triathlon", "gymnastics", "equestrian", "athletics", "judo", "weightlifting"]
},
marginLeft: 100,
width
})
Plot.plot({
marks: [
Plot.tickX(olympians, {x: "weight", y: "sport", sort: {y: "x"}})
],
y: {
domain: ["triathlon", "gymnastics", "equestrian", "athletics", "judo", "weightlifting"]
},
marginLeft: 100,
width
})
Plot.plot({
marks: [
Plot.ruleY([0]),
Plot.lineY(aapl, {x: "Date", y: "Close"})
]
})
Plot.plot({
marks: [
Plot.ruleY([0]),
Plot.lineY(industries, {x: "date", y: "unemployed", z: "industry", stroke: "industry", title: "industry"})
],
color : {
legend: true
}
})
Plot.plot({
marks: [
Plot.line(tdf, {x: "distance", y: "elevation"}),
// Plot.ruleY([0])
],
width
})
Plot.plot({
marks: [
Plot.line(driving, {x: "miles", y: "gas", curve: "catmull-rom", marker: "circle"}),
// Plot.text(driving, {filter: d => d.year % 5 === 0, x: "miles", y: "gas", text: d => `${d.year}`, dy: -8})
]
})
Plot.plot({
marks: [
Plot.barY(alphabet, {x: "letter", y: "frequency", sort: {x: "y", reverse: true}}),
Plot.ruleY([0])
]
})
Plot.plot({
marks: [
Plot.barY(alphabet, {x: "letter", y: "frequency", sort: {x: "y", reverse: true}}),
Plot.ruleY([0])
]
})
Plot.plot({
marks: [
Plot.line(alphabet.sort((a, b) => d3.ascending(a.frequency, b.frequency)),
{x: "letter", y: "frequency", sort: {x: "y", reverse: true}}),
Plot.ruleY([0])
]
})
Plot.plot({
marks: [
Plot.line(alphabet.sort((a, b) => d3.ascending(a.letter, b.letter)), {x: "letter", y: "frequency"}),
Plot.ruleY([0])
]
})
laserStrikes
Type Table, then Shift-Enter. Ctrl-space for more options.
Plot.plot({
marks: [
Plot.barY(laserStrikes, Plot.groupX({y: "count"}, {x: "year", fill: "steelblue"})),
Plot.ruleY([0])
]
})
import {Plot} from "@mkfreeman/plot-tooltip"
import {driving} from "@observablehq/plot-line"
import {tdf} from "@observablehq/plot-line"
import {laserStrikesCleaned as laserStrikes} from "@observablehq/excel-add-columns"
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.
