seattleWeatherTyped = FileAttachment("seattle-weather.csv").csv({typed: true})
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')
)
.render()
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')
)
.render()
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"]})
)
.render()
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(170)
.height(190)
.render()
vl.markPoint()
.data(seattleWeatherTyped)
.title("Seattle Daily Max Temperatures 2012- 2015")
.encode(
vl.x().fieldT('date'),
vl.y().fieldQ('temp_max'),
)
.render()
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({
domain: ['sun', 'fog', 'drizzle', 'rain', 'snow'],
range: ["#E7BA52", "#C7C7C7", "#AEC7E8", "#1F77B4", "#9467bd"]})
)
.render()
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({
domain: ['sun', 'fog', 'drizzle', 'rain', 'snow'],
range: ["#E7BA52", "#C7C7C7", "#AEC7E8", "#1F77B4", "#9467bd"]}),
vl.size().fieldQ('precipitation').scale({range: [5, 350]})
)
.render()
vl.markCircle()
.data(seattleWeatherTyped)
.title("Seattle Max Temperatures 2012- 2015")
.encode(
vl.x().fieldT('date').timeUnit('month-date'),
vl.y().fieldQ('temp_max'),
vl.color().fieldN('weather')
.scale({
domain: ['sun', 'fog', 'drizzle', 'rain', 'snow'],
range: ["#E7BA52", "#C7C7C7", "#AEC7E8", "#1F77B4", "#9467bd"]}),
vl.size().fieldQ('precipitation').scale({range: [5, 350]})
)
.render()
vl.markCircle()
.data(seattleWeatherTyped)
.title("Seattle Max Temperatures 2012- 2015")
.encode(
vl.x().fieldT('date').timeUnit('month-date'),
vl.y().fieldQ('temp_max'),
vl.color().fieldN('weather')
.scale({
domain: ['sun', 'fog', 'drizzle', 'rain', 'snow'],
range: ["#E7BA52", "#C7C7C7", "#AEC7E8", "#1F77B4", "#9467bd"]}),
vl.size().fieldQ('precipitation').scale({range: [5, 350]}),
vl.column().fieldN('weather')
)
.width(150)
.height(160)
.render()
vl.markPoint()
.data(seattleWeatherTyped)
.title("Seattle Max Temperatures 2012- 2015")
.encode(
vl.x().fieldT('date').timeUnit('month-date'),
vl.y().fieldQ('temp_min'),
vl.color().fieldN('weather')
.scale({
domain: ['sun', 'fog', 'drizzle', 'rain', 'snow'],
range: ["#E7BA52", "#C7C7C7", "#AEC7E8", "#1F77B4", "#9467bd"]}),
vl.size().fieldQ('precipitation').scale({range: [5, 350]})
)
.render()
vl.markCircle()
.data(seattleWeatherTyped)
.title("Seattle Daily Max Temperatures 2012- 2015")
.encode(
vl.x().fieldT('date'),
vl.y().fieldQ('wind'),
vl.color().fieldN('weather')
.scale({
domain: ['sun', 'fog', 'drizzle', 'rain', 'snow'],
range: ["#E7BA52", "#C7C7C7", "#AEC7E8", "#1F77B4", "#9467bd"]})
)
.render()
vl.markPoint()
.data(seattleWeatherTyped)
.title("Seattle Daily Min Temperatures 2012- 2015")
.encode(
vl.x().fieldQ('temp_min'),
vl.y().fieldQ('wind'),
)
.render()
vl.markPoint()
.data(seattleWeatherTyped)
.encode(
vl.x().fieldQ('temp_max'),
vl.y().fieldQ('temp_min'),
vl.color().fieldN('weather')
)
.width(300)
.render()
vl.markBar()
.data(seattleWeatherTyped)
.encode(
vl.x().fieldN('weather'),
vl.y().fieldQ('wind'),
vl.color().fieldN('weather')
)
.width(300)
.render()
vl.markCircle()
.data(seattleWeatherTyped)
.encode(
vl.x().fieldT('date').timeUnit('month-date'),
vl.y().fieldQ('wind'),
vl.color().fieldN('weather')
.scale({
domain: ['sun', 'fog', 'drizzle', 'rain', 'snow'],
range: ['#e7ba52', '#a7a7a7', '#aec7e8', '#1f77b4', '#9467bd']
})
)
.render()
import {vl} from '@vega/vega-lite-api-v5'
import {printTable} from '@jonfroehlich/data-utilities'
import {printTableTypes} from '@jonfroehlich/data-utilities'
import {toc} from "@jonfroehlich/collapsible-toc"
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.
