Published
Edited
Apr 30, 2019
1 fork
2 stars
md`# Heatmap of Monthly Average Air Quality across Multiple Years`
vega = require("vega-embed@3")
d3 = require('d3')
data = d3.csv('https://gist.githubusercontent.com/ptrknow/911546be7201dbdc17e57342bf1d2dbe/raw/1e1e4caeb0051a19abdc45aa6797be69c2cd9eb9/average_across_years.csv')
vega({
data: { values: data },
width: 1000,
height: 400,
title: 'Monthly Average of Air Quality',
mark: 'rect',
selection: { highlight: {type: "single"}} ,
encoding: {
x: { field: 'Month of Year', type: 'o' },
y: { field: 'District', type: 'n' },
color: {
field: 'AQHI',
type: 'q',
// We use "blueorange" color scheme instead of the default "viridis"
// because it is closer to the convention that red means hot and
// blue means cold. We also set the domain to between 0 and 40, to
// have a consistent color encoding when plotting the minimum
// temperature
scale: { scheme: 'blueorange', domain: [1.5, 5.5] }
},
opacity: {
condition: { selection: "highlight", value: 1},
value: 0.5
}
}
})
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.
