EJ Fox & Ian Johnson
streaming data, code, acid, design
eav
voteByCounty.get(fips)
fips
+eavsByCounty.get(fips)["A1a|2016"]
calculatePercent(countySVG.id)
eavsByCounty.get(countySVG.id)
projection = d3.geoAlbersUsa().fitSize([width - 10, height - 30], countyShapes)
minCounty = d3.min(countyShapes.features, d => calculatePercent(d.id))
diffScale = d3
.scaleSequential(d3.interpolateGreys)
// .domain(diffExtent)
.domain([minCounty, 1])
turf.centroid(countyShapes.features[0])
center = d => {
return projection(turf.centroid(d).geometry.coordinates) || [0, 0];
}
allYearsFlat = FileAttachment("allYearsFlat@1.csv").csv({ typed: false })
allYearsFlat.filter(d => d.State_Full == "WISCONSIN")
eavsByCounty = new Map(
allYearsFlat.map(d => {
let s = String(d.FIPSCode);
return [s.slice(0, s.length - 5).padStart(5, "0"), d];
})
)
statePctConfig = ({
min: simPct[0] * 100,
max: simPct[1] * 100
})
pctByState = {
let seed2 = "hi";
let chance = new Chance(seed2);
return new Map(
stateShapes.features.map(d => {
let s = String(d.FIPSCode);
return [d.id, chance.floating(statePctConfig)];
})
);
}
pctByCounty = {
let seed = "hi";
let chance = new Chance(seed);
return new Map(
allYearsFlat.map(d => {
let s = String(d.FIPSCode);
s = s.slice(0, s.length - 5).padStart(5, "0");
let statePct = pctByState.get(s.slice(0, 2));
return [
s,
chance.floating({
min: statePct - 10,
max: _.clamp(statePct + 10, 100)
})
];
return [s.slice(0, s.length - 5).padStart(5, "0"), statePct];
})
);
}
voteJitter = 5 // The amount added or subtracted from state percentage
voteByCounty = {
let seed = "hi";
let chance = new Chance(seed);
return new Map(
countyShapes.features.map(d => {
let fips = d.id;
let eave = eavsByCounty.get(fips);
if (!eave) return [fips, 0];
let countyActiveVoters = eave["A1a|2016"];
let statePct = pctByState.get(fips.slice(0, 2));
let countyPct = chance.floating({
min: statePct - voteJitter,
max: _.clamp(statePct + voteJitter, 100)
});
return [fips, Math.floor(countyActiveVoters * (countyPct / 100))];
})
);
}
import { legend } from "@d3/color-legend"
countySVG
fips = countySVG ? countySVG.id : ""
eav = eavsByCounty.get(fips)
eav ? eav : ""
height = 500
pop2016 = demographicsData[2016].get(fips)["B01003_001E"]
pop2018 = demographicsData[2018].get(fips)["B01003_001E"]
format = d3.format(",d")
import {
demographicsData,
selectedFields,
niceLabel,
countyShapes,
stateShapes
} from "@enjalot/us-county-datasets"
d3 = require("d3@6")
FileAttachment("keyLables.json").json()
turf = require('https://bundle.run/turf@3.0.14')
import { twitch } from "@codingwithfire/twitch"
import { rangeSlider } from "@mootari/range-slider"
Chance = require("chance")
_ = require('lodash')
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.
