Public
Edited
Apr 7, 2023
Insert cell
Insert cell
data = worldPhones.filter((d) => d.region === "Europe")
Insert cell
webrplt = Plot.plot({
style: {
background: "#001e38",
color: "#c6cdd7",
padding: "30px"
},
inset: 10,
marginLeft: 50,
caption: "Data from AT&T (1961) The World's Telephones",
x: {
label: null,
type: "band"
},
y: {
label: "Number of ☎️ (K)",
grid: true
},
marks: [
Plot.barY(
worldPhones.filter((d) => d.region === "Europe"),
{ x: "year", y: "phones", fill: "#4a6d88" }
),
Plot.ruleY([0])
]
})
Insert cell
data
X
year
Y
phones
Color
#65a7ff
Size
Facet X
Facet Y
Mark
bar
Type Chart, then Shift-Enter. Ctrl-space for more options.

Insert cell
Plot.auto(data, { x: "year", y: "phones", color: "#65a7ff", mark: "bar" }).plot({})
Insert cell
Insert cell
temp = (await FileAttachment("temp@1.json").json()).map((d) => {
d.day = new Date(d.day);
return d;
})
Insert cell
Plot.plot({
color: {
legend: true
},
marks: [Plot.lineY(temp, { x: "day", y: "tagCount", stroke: "valueType" })]
})
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