pixel flipper, data sifter. trying to see what I can while I'm here
chartp03
hex = hexbytime.get(time2)
import {hexdata, hexbytime, california, countyShapes} from "@enjalot/purpleair-historical-data"
// Choose a couple counties that define the extent I care about
countyExtent = ({
type: "FeatureCollection",
// features: countyShapes.features.filter(d => (
// d.properties.name == "Tehama" ||
// d.properties.name == "San Benito") && d.id.slice(0,2) == "06")
features: countyShapes.features.filter(d => (
d.properties.name == "Marin" ||
d.properties.name == "Alameda") && d.id.slice(0,2) == "06")
// features: countyShapes.features.filter(d => (
// d.properties.name == "Marin" ||
// d.properties.name == "Santa Clara") && d.id.slice(0,2) == "06")
})
projection.scale()
originalScale = 25355.18980109889
scaleRatio = projection.scale() / originalScale
projection = d3.geoAlbersUsa()
.fitSize([width, height], countyExtent)
pixelRadius = 10 * scaleRatio
hexbin = d3.hexbin().extent([[0, 0], [width, height]]).radius(pixelRadius)
dayExtent = d3.extent(hexdata, d => d.day)
days =
d3.timeHour
.range(new Date(dayExtent[0]*1000), new Date(dayExtent[1]*1000))
.map(d => +d/1000)
height = 500
colorPM1 = d3.scaleLinear()
.domain([0,50, 100, 150, 200, 250])
.range(["green", "yellow", "orange", "red", "maroon", "maroon"])
opacityPM1 = d3.scaleLinear()
.domain([0,50, 100, 150, 200, 250])
.range([0.1, 0.5, 0.75, 0.9, 0.9, 0.9])
colorP03 = d3.scaleLinear()
.domain([1,1000, 5000, 10000, 20000, 25000])
// .range(["green", "yellow", "orange", "red", "maroon", "maroon"])
.range(["#eee", "#ccc", "#aaa", "#888", "#666", "#444", "#111"])
opacityP03 = d3.scaleLinear()
.domain([1,1000, 5000, 10000, 20000, 25000])
.range([0.1, 0.5, 0.75, 0.9, 0.9, 0.9])
timeFormat = d3.timeFormat("%Y-%m-%d %H:%M")
import {Scrubber} from "@mbostock/scrubber"
import {legend} from "@d3/color-legend"
d3 = require("d3@6.0.0-rc.3", "d3-hexbin@0.2")
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.
