zoneSourceData = d3.csv("https://gist.githubusercontent.com/jwcarroll/f1c96ce9809f427d8bb0ae88350ecc71/raw/6f70ced1185c40076560d6ebb23947d7fe8a6a2b/zone-chart.csv")
zoneData = fromPairsMultipleValues(
getFilteredZoneData(sourceZip, zoneSourceData)
.flatMap(d => d.flatMap(({"destination_zip":zip, "zone":zone}) => mapZip(zip).map(
z => [z, parseInt(zone, 10)])
)
)
);
color = d3.scaleQuantize([1, 10], ["#ffffcc","#ffeda0","#fed976","#feb24c","#fd8d3c","#fc4e2a","#e31a1c","#bd0026","#800026"])
function getSmallestZone(threeDigitZip, data){
const minZone = Math.min.apply(null, data[threeDigitZip]);
return minZone === Infinity
? NaN
: minZone;
}
function getFilteredZoneData(sourceZip, zoneData){
const sourceZips = sourceZip.split(",");
return sourceZips.map(z => zoneData.filter(d => d.source_zip === z));
}
function fromPairsMultipleValues(pairs) {
var index = -1,
length = pairs == null ? 0 : pairs.length,
result = {};
while (++index < length) {
var pair = pairs[index];
if(!result[pair[0]]){
result[pair[0]] = [];
}
result[pair[0]].push(pair[1]);
}
return result;
}
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.
