Public
Edited
Mar 28, 2023
Insert cell
Insert cell
screenshot20230327At141548 = FileAttachment("Screenshot 2023-03-27 at 14.15.48.png").image()
Insert cell
screenshot20230327At141643 = FileAttachment("Screenshot 2023-03-27 at 14.16.43.png").image()
Insert cell
screenshot20230327At141723 = FileAttachment("Screenshot 2023-03-27 at 14.17.23.png").image()
Insert cell
steve_jobs_data = [
{name: "IBM", share: 0.39},
{name: "Apple", share: 0.20},
{name: "Palm", share: 0.10},
{name: "Motorola", share: 0.07},
{name: "Nokia", share: 0.03},
{name: "Other", share: 0.21},
]
Insert cell
Plot.plot({
marks: [
Plot.barY(steve_jobs_data, {x: "name", y: "share", sort: {x: "y", reverse: true}}),
Plot.ruleY([0])
]
})
Insert cell
import {DonutChart} from "@d3/donut-chart"
Insert cell
DonutChart(steve_jobs_data, {name: d => d.name, value: d => d.share, innerRadius: 50})
Insert cell
import {PieChart} from "@d3/pie-chart"
Insert cell
chart = PieChart(steve_jobs_data, {
name: d => d.name,
value: d => d.share,
width,
height: 500
})
Insert cell
screenshot20230327At141751 = FileAttachment("Screenshot 2023-03-27 at 14.17.51.png").image()
Insert cell
screenshot20230327At141841 = FileAttachment("Screenshot 2023-03-27 at 14.18.41.png").image()
Insert cell
screenshot20230327At142119 = FileAttachment("Screenshot 2023-03-27 at 14.21.19.png").image()
Insert cell
screenshot20230327At142157 = FileAttachment("Screenshot 2023-03-27 at 14.21.57.png").image()
Insert cell
high_school_data = [
{year: 2007, percent: 0.75},
{year: 2008, percent: 0.75},
{year: 2009, percent: 0.78},
{year: 2010, percent: 0.79},
{year: 2011, percent: 0.80},
{year: 2012, percent: 0.81},
{year: 2013, percent: 0.82},
{year: 2014, percent: 0.83},
]
Insert cell
screenshot20230327At142248 = FileAttachment("Screenshot 2023-03-27 at 14.22.48.png").image()
Insert cell
Insert cell
html`<img src="${await FileAttachment("IMG_5527.JPG").url()}" style="height: 800px"/>`
Insert cell
banks performance - Sheet1 (1).csv
Type Table, then Shift-Enter. Ctrl-space for more options.

Insert cell
Plot.plot({
x: {
axis: null,
domain: bankperf.bank
},
y: {
grid: true,
tickFormat: "s"
},
color: {
domain: bankperf.Month,
legend: true
},
facet: {
data: bankperf,
x: "bank"
},
marks: [
Plot.barY(bankperf, Plot.groupX({y: "sum"}, {x: "Month", y: "price", fill: "Month"})),
Plot.ruleY([0])
]
})
Insert cell
screenshot20230326At232355 = FileAttachment("Screenshot 2023-03-26 at 23.23.55.png").image()
Insert cell
screenshot20230326At232408 = FileAttachment("Screenshot 2023-03-26 at 23.24.08.png").image()
Insert cell
screenshot20230326At232434 = FileAttachment("Screenshot 2023-03-26 at 23.24.34.png").image()
Insert cell
sport_factors.csv
Type Table, then Shift-Enter. Ctrl-space for more options.

Insert cell
viewof selectedData = Inputs.select(d3.group(sport_factors, d => d.factor), {label: "Factor"})
Insert cell
Plot.plot({
marks: [
Plot.ruleY([0]),
Plot.lineY(selectedData, {x: "year", y: "percent", z: "factor"})
],
y :{
domain: [d3.min(selectedData, d => d.percent), d3.max(selectedData, d => d.percent)]
}
})
Insert cell
d3.min(selectedData, d => d.percent)
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