Public
Edited
Apr 28, 2023
Insert cell
Insert cell
Insert cell
Insert cell
seattleWeatherTyped = FileAttachment("seattle-weather.csv").csv({typed: true})
Insert cell
Insert cell
Insert cell
vl.markBar()
.data(seattleWeatherTyped)
.title("Histogram of Daily Max Temperatures in Seattle")
.encode(vl.x().fieldQ("temp_max").bin(true),
vl.y().aggregate("count"))
.render()
Insert cell
Insert cell
vl.markBar()
.data(seattleWeatherTyped)
.title("Histogram of Daily Max Temperatures in Seattle")
.encode(vl.x().fieldQ("temp_max").bin(true),
vl.y().aggregate("count"),
vl.color().fieldN("weather"))
.render()
Insert cell
Insert cell
vl.markBar()
.data(seattleWeatherTyped)
.title("Histogram of Daily Max Temperatures in Seattle")
.encode(vl.x().fieldQ("temp_max").bin(true),
vl.y().aggregate("count"),
vl.color().fieldN("weather").scale({range: ["#AEC7E8", "#C7C7C7", "#1F77B4", "#9467bd", "#E7BA52"]}))
.render()
Insert cell
Insert cell
vl.markBar({tooltip: true})
.data(seattleWeatherTyped)
.title("Histogram of Daily Max Temperatures in Seattle (2012-2015)")
.encode(
vl.x().fieldQ('temp_max').bin(true),
vl.y().aggregate("count"),
vl.color().fieldN('weather')
.scale({
range: ["#aec7e8", "#c7c7c7", "#1f77b4","#9467bd", "#e7ba52"],
}),
vl.column().fieldN('weather')
)
.width(130)
.height(150)
.render()
Insert cell
Insert cell
Insert cell
vl.markPoint()
.data(seattleWeatherTyped)
.title("Seattle Daily Max Temperatures 2012 - 2015")
.encode(
vl.x().fieldT('date'),
vl.y().fieldQ('temp_max'))
.render()
Insert cell
Insert cell
vl.markCircle()
.data(seattleWeatherTyped)
.title("Seattle Daily Max Temperatures 2012 - 2015")
.encode(
vl.x().fieldT('date'),
vl.y().fieldQ('temp_max'),
vl.color().fieldN('weather').scale({range: ["#AEC7E8", "#C7C7C7", "#1F77B4", "#9467bd", "#E7BA52"]}))
.render()
Insert cell
Insert cell
vl.markCircle()
.data(seattleWeatherTyped)
.title("Seattle Daily Max Temperatures 2012 - 2015")
.encode(
vl.x().fieldT('date'),
vl.y().fieldQ('temp_max'),
vl.color().fieldN('weather').scale({range: ["#AEC7E8", "#C7C7C7", "#1F77B4", "#9467bd", "#E7BA52"]}),
vl.size().fieldQ('precipitation').scale({range: [20, 500]}))
.render()
Insert cell
Insert cell
vl.markCircle()
.data(seattleWeatherTyped)
.title("Seattle Daily Max Temperatures 2012 - 2015")
.encode(
vl.x().fieldT('date').timeUnit('monthdate'),
vl.y().fieldQ('temp_max'),
vl.color().fieldN('weather').scale({range: ["#AEC7E8", "#C7C7C7", "#1F77B4", "#9467bd", "#E7BA52"]}),
vl.size().fieldQ('precipitation').scale({range: [20, 500]}))
.render()
Insert cell
Insert cell
vl.markCircle({tooltip: true})
.data(seattleWeatherTyped)
.title("Seattle Max Temperatures 2012 - 2015")
.encode(
vl.x().fieldT('date').timeUnit('monthdate'),
vl.y().fieldQ('temp_max'),
vl.color().fieldN('weather')
.scale({
range: ["#aec7e8", "#c7c7c7", "#1f77b4","#9467bd", "#e7ba52"],
}),
vl.column().fieldN('weather'),
vl.size().fieldQ('precipitation').scale({range: [20, 500]})
)
.width(130)
.height(150)
.render()
Insert cell
Insert cell
Insert cell
Insert cell
vl.markPoint({tooltip: true})
.data(seattleWeatherTyped)
.title("Wind patterns in Seattle 2012 - 2015")
.encode(
vl.x().fieldT('date').timeUnit('monthdate'),
vl.y().fieldQ('wind'),
vl.color().fieldN('weather')
.scale({
range: ["#aec7e8", "#c7c7c7", "#1f77b4","#9467bd", "#e7ba52"],
})
)
.render()
Insert cell
Insert cell
vl.markCircle()
.data(seattleWeatherTyped)
.title('Seattle Daily Max Temperatures 2012-2015 for Different Precipitation Levels')
.encode(
vl.x().fieldT('date').timeUnit('monthdate').title("date"),
vl.y().fieldQ('temp_max').title("Max Temp"),
vl.color().fieldN('weather').scale({range: ["#AEC7E8", "#C7C7C7", "#1F77B4", "#9467bd", "#E7BA52"]}),
vl.size().fieldQ('precipitation').scale({range: [10, 500]}),
vl.column().fieldN('precipitation').bin(true))
.width(130)
.height(150)
.render()
Insert cell
Insert cell
vl.markCircle({opacity: 0.6, tooltip: true})
.data(seattleWeatherTyped)
.title("Relationship Between Wind and Max Temperatures in Seattle 2012 - 2015")
.encode(
vl.x().fieldQ('wind'),
vl.y().fieldQ('precipitation'),
vl.color().fieldN('weather'),
vl.tooltip([
{field : "date", type : "temporal"},
{field : "temp_max", title : "max temp" },
{field : "temp_min", title : "min temp" },
{field : "precipitation"},
{field : "wind"},
{field : "weather"},
])
).render();
Insert cell
Insert cell
Insert cell
import {vl} from '@vega/vega-lite-api-v5'
Insert cell
import {printTable} from '@jonfroehlich/data-utilities'
Insert cell
import {printTableTypes} from '@jonfroehlich/data-utilities'
Insert cell
import {toc} from "@jonfroehlich/collapsible-toc"
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