Published
Edited
Jan 6, 2021
2 forks
8 stars
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
import { countyShapes } from '@enjalot/county-boundaries'
Insert cell
Insert cell
Insert cell
md`# Georgia specific stuff

Data from the New York Times matched to @enjalot's county topojson using FIPS.

`
Insert cell
live_election_data = d3.json("https://static01.nyt.com/elections-assets/2020/data/api/2021-01-05/state-page/georgia.json")
Insert cell
geojson = {
const output = { "type": "FeatureCollection", features: []}
const results = d3.rollup(live_election_data.data.races[0].counties, v => v[0].results, k => k.fips)
const results2 = d3.rollup(live_election_data.data.races[1].counties, v => v[0].results, k => k.fips)
for (let shape of countyShapes.features) {
const result1 = results.get(shape.id)
const result2 = results2.get(shape.id)
if (!result1) {
continue
}
for (let [k, v] of Object.entries(result1)) {
shape.properties[k] = v
}
for (let [k, v] of Object.entries(result2)) {
shape.properties[k] = v
}
output.features.push(shape)
}
return output
}
Insert cell
featureset = projected_geojson
Insert cell
import { dot_density } from '@bmschmidt/dot-density'
Insert cell
redraw = {
const ctx = canvas.getContext("2d")
ctx.fillStyle = 'rgba(255, 255, 255, .05)'
ctx.fillRect(0, 0, width, height)
for (let i = 0; i < generated_points.x_array.length; i++) {
const num = generated_points.field_array[i]
ctx.fillStyle = colormap[fields[num]]
ctx.fillRect(generated_points.x_array[i], generated_points.y_array[i], 1, 1)
}
}
Insert cell
projected_geojson = {
const proj = d3
.geoProjection(d3.geoMercatorRaw)
.fitExtent( [[10, 10], [width, height]],
geojson
)
return d3.geoProject(geojson, proj)}
Insert cell
Insert cell
import {checkbox, slider, radio} from '@jashkenas/inputs'
Insert cell
generated_points = {
// The first call here will also generate the triangulation.
const points = dot_density(featureset, fields, N_REPRESENTED)
yield points
while (update_continuously == "yes") {
const points = dot_density(featureset, fields, N_REPRESENTED)
yield points
}
}
Insert cell
d3 = require("d3@v6", "d3-geo-projection")
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