data = [
[0, premium, "Yearly Premium 1", "Plan 1"],
[0, premium1, "Yearly Premium 2", "Plan 2"],
[deductible, deductible + premium, "Deductible 1", "Plan 1"],
[deductible1, deductible1 + premium1, "Deductible 2", "Plan 2"],
[maxCosts, oopMax + premium, "Out-of-pocket max 1","Plan 1"],
[maxCosts1, oopMax1 + premium1, "Out-of-pocket max 2","Plan 2"],
]
dataPadded = [
...data,
[xDomain[1], oopMax + premium, "","Plan 1"],
[xDomain[1], oopMax1 + premium1, "","Plan 2"]
]
xDomain = d3.extent([...data.map(d => d[0]+1000), 0, 15000])
yDomain = d3.extent([...data.map(d => d[1]), 0, 6000])
// deductible + coinsurance * (maxCosts - deductible) = oopMax
maxCosts = ((coinsurance - 1) * deductible + oopMax) / coinsurance
// deductible + coinsurance * (maxCosts - deductible) = oopMax
maxCosts1 = ((coinsurance1 - 1) * deductible1 + oopMax1) / coinsurance1
fn = x => {
let y = premium;
y += Math.min(x, deductible);
x = Math.max(0, x - deductible);
if (x === 0) return y;
y += x * coinsurance;
return Math.min(y, oopMax + premium);
}
randomCosts = d3.range(1000).map(d3.randomExponential(.001))
histogramThresholds = d3.range(0, 6000, 500)
histogramDomain = [0, 5000]
arrows = {
const aBins = d3.bin().domain(histogramDomain).thresholds(histogramThresholds)(randomCosts)
const bBins = d3.bin().domain(histogramDomain).thresholds(histogramThresholds)(randomCosts.map(fn))
const arrows = [];
for (let i = 0; i < aBins.length; i++) {
const {x0, x1} = aBins[i];
const y1 = aBins[i].length;
const y2 = bBins[i].length;
arrows.push({x: (x0 + x1) / 2, y1, y2});
}
return arrows;
}
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.
