Public
Edited
Jun 7, 2023
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
data = FileAttachment("seattle-weather.csv").csv({typed: true})
Insert cell
Insert cell
Inputs.table(data)
Insert cell
Insert cell
Insert cell
Plot // Plot is available in Observable by default
Insert cell
Insert cell
Insert cell
Insert cell
// type your code here
Plot.plot({
marks: [
Plot.line(data, {x: "date", y: "temp_min", stroke:"blue"}),
Plot.line(data, {x: "date", y: "temp_max", stroke:"red"})
],
width
})

Insert cell
viewof k = Inputs.range([1,60], {step:1, value:7, label:"k"})
Insert cell
Plot.plot({
marks: [
Plot.line(data, Plot.windowY(
{x: "date", y: "temp_min", stroke:"blue", k:k})
),
Plot.line(data, Plot.windowY({x: "date", y: "temp_max", stroke:"red", k:k}))
],
width
})
Insert cell
Insert cell
Insert cell
// type your code here


Insert cell
Insert cell
Insert cell
// type your code here
Plot.plot({
marks: [
Plot.areaY(data, Plot.windowY(
{x: "date", y1: "temp_min", y2: "temp_max", fill:"blue", k:28})
)//,
//Plot.line(data, Plot.windowY({x: "date", y: "temp_max", stroke:"red", k:k}))
],
width,
grid: true
})

Insert cell
// type your code here
Plot.plot({
marks: [
Plot.line(data, Plot.windowY(
{x: "date",
y: d => d.temp_max - d.temp_min,
stroke:"blue",
k:28}))
],
width,
grid: true
})
Insert cell
Insert cell
{
let x = 5;
let y = 6;
return{x, y}
}
Insert cell
Insert cell
// type your code here
data



Insert cell
Plot.plot({
marks: [
Plot.line(data, {x: 'date', y: d => (d.temp_min + d.temp_max) / 2})
]
})
Insert cell
Insert cell
Insert cell
Insert cell
// Type your code here
Plot.plot({
marks: [
//Plot.line(data, {x:"date", y:"precipitation"})
Plot.rectY(data,
Plot.binX({y: "sum"},
{x: "date",
y:"precipitation",
thresholds: d3.timeMonth.every(1)}))
],
width
})

Insert cell
Insert cell
Insert cell
// type your code here
Plot.plot({

color: {transform: d => Math.sqrt(d)},
facet: {
data: data,
y: d => d.date.getUTCFullYear()
},
marks: [
Plot.cell(data, {
x: d => d3.utcWeek.count(d3.utcYear(d.date), d.date),
y: d => d.date.getUTCDay(),
fill: 'precipitation'
})
]
})

Insert cell
Insert cell
data
Insert cell
Insert cell
// type your code here


Insert cell
Insert cell
Insert cell
// type your code here


Insert cell
Insert cell
Insert cell
// type your question here


Insert cell
// type your code here


Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
import {Q, A, styles, viewof showAll} with { data } from "@observablehq/plot-exploration-penguins";
Insert cell
styles
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