Public
Edited
Nov 16, 2022
Insert cell
Insert cell
data101 = FileAttachment("data101.xlsx").xlsx()
Insert cell
nycSpreadsheet = FileAttachment("data101.xlsx").xlsx()//最后是个文件格式
Insert cell
nycData = nycSpreadsheet.sheet(0, { headers: true })//0大概是从第一行开始?
Insert cell
Inputs.table(nycData)
Insert cell
Plot.plot({
marks: [
Plot.dot(nycData, {x: "date", y: "medianAskingPrice"})
]
})
Insert cell
Plot.plot({
marks: [
Plot.dot(nycData, {x: "date", y: "medianAskingPrice", fill: "neighborhood"})
],
marginLeft: 100
})
Insert cell
Plot.plot({
marks: [
Plot.dot(nycData, {x: "date", y: "medianAskingPrice", fill:"neighborhood"})
],
color: { legend: true},
marginLeft: 100,
marginRight: 100
})
Insert cell
Plot.plot({
marks: [
Plot.dot(nycData, {x: "date", y: "medianAskingPrice", r: "priceCutShare", fill:"neighborhood"})//r是圆的半离散的数据是单一的颜色,定序的数据是渐变的颜色
],
color: { legend: true},
marginLeft: 100
})
Insert cell
Plot.plot({
marks: [
Plot.ruleY([0]),
Plot.dot(nycData, {x: "date", y: "medianAskingPrice", r: "priceCutShare", fill:"medianAskingPrice"})//定序数据是渐变的颜色
],
color: { legend: true},
marginLeft: 100
})
Insert cell
Plot.plot({
marks: [
Plot.ruleY([0]),
Plot.dot(nycData, {x: "date", y: "medianAskingPrice", r: "priceCutShare", fill:"neighborhood"}),
Plot.dot(nycData, {x: "date", y: "medianRecordedSalesPrice", r: "priceCutShare", stroke:"neighborhood"})//两组数据,通过fill和stroke区分数据,y值不一样,看y值的区别。
],
color: { legend: true},
marginLeft: 100
})
Insert cell
Plot.plot({
marks: [
Plot.ruleY([0]),
Plot.line(nycData, {x: "date", y: "medianAskingPrice", stroke:"neighborhood"}),//线的绘图
Plot.dot(nycData, {x: "date", y: "medianAskingPrice", fill:"neighborhood",r: "priceCutShare"}),//和点连在一起了
],
color: { legend: true},
marginLeft: 100
})
Insert cell
Plot.plot({
grid: true,//这是加格子
marks: [
Plot.ruleY([0]),
Plot.line(nycData, {x: "date", y: "medianAskingPrice", stroke:"neighborhood"}),
Plot.dot(nycData, {x: "date", y: "medianAskingPrice", r: "priceCutShare", fill:"neighborhood"}),
Plot.line(nycData, {x: "date", y: "medianRecordedSalesPrice", stroke:"neighborhood"}),
Plot.dot(nycData, {x: "date", y: "medianRecordedSalesPrice", r: "priceCutShare", stroke:"neighborhood"}),
],
color: { legend: true},
marginLeft: 100
})
Insert cell
Plot.plot({
facet: {
data: nycData,
y: "borough",
marginRight: 100,
},
marks: [
Plot.frame({stroke: "lightgray"}),
Plot.ruleY([0]),
Plot.line(nycData, {x: "date", y: "medianAskingPrice", stroke:"neighborhood", z: "neighborhood"}),
Plot.dot(nycData, {x: "date", y: "medianAskingPrice", fill:"neighborhood", r: "priceCutShare"}),
],
color: { legend: true},
marginLeft: 100
})
Insert cell
Plot.plot({
marks: [
Plot.barX(nycData, {x: "medianAskingPrice", y: "date", fill:"neighborhood"})
]
})
Insert cell
Plot.plot({x: {domain: [0, 100]}, grid: true})
Insert cell
Plot.plot({x: {domain: [-100, 100]}, y: {domain: [-100, 100]}, grid: true})
Insert cell
Plot.plot({x: {domain: [new Date("2022-01-01"), new Date("2023-01-01")]}, grid: true})
Insert cell
Plot.plot({x:{type:"log", domain: [1e0,1e5], tickFormat: ","},grid:true})
Insert cell
viewof pivot = Inputs. range([-15,15], {step: 0.01, value: 0, label: "Pivot"})
Insert cell
Plot.plot({
color: {
type:"diverging",
pivot
},
marks:[
Plot.cell([-15,-14,-13,-12,-11,-10,-9,-8,-7,-6,-5,-4,-3,-2,-1,0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15],{x:d => d,fill: d => d})
]
})
Insert cell
Insert cell
Plot.plot({
color: {
scheme: schemeq
},
marks: [
Plot.cell([1, 2, 3, 4, 5, 6, 7, 8, 9, 10], {x: d => d, fill: d => d})
]
})
Insert cell
Insert cell
gistemp = FileAttachment("gistemp.csv").csv({typed: true})
Insert cell
Plot.plot({
grid: true,
color: {
type: "diverging",
scheme: "BuRd"
},
marks: [
Plot.ruleY([0]),
Plot.dot(gistemp, {x: "Date", y: "Anomaly", stroke: "Anomaly"})
]
})
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