41:null 42:["$","title",null,{"children":"The Bayesian coin flip. | D.S. Walker | Observable"}] 48:T45b,const bayesChart = display(Plot.plot({ title: "Bayesian updating for a coin's bias", subtitle: `Prior Beta(${priorAlpha}, ${priorBeta}) → Posterior Beta(${posteriorAlpha}, ${posteriorBeta}) after ${nTotalFlips} flips (${heads} heads, ${tails} tails); true p = ${trueP}`, width: 800, height: 460, marginRight: 100, x: {label: "Probability of heads (p)", domain: [0, 1]}, y: {label: "Density", grid: true}, color: {legend: true, domain: ["Prior", "Likelihood (scaled)", "Posterior"], range: ["#d1d5db", "#9ca3af", "#374151"]}, marks: [ Plot.ruleX([trueP], {stroke: "#6b7280", strokeDasharray: "4,3"}), Plot.text([{x: trueP, y: 0}], {x: "x", y: "y", text: () => "true p", dy: -8, dx: 20, fill: "#6b7280"}), Plot.areaY(densityData.filter(d => d.series === "Prior"), {x: "x", y: "density", fill: "series", fillOpacity: 0.15}), Plot.areaY(densityData.filter(d => d.series === "Posterior"), {x: "x", y: "density", fill: "series", fillOpacity: 0.25}), Plot.lineY(allData, {x: "x", y: "density", stroke: "series", z: "series", strokeWidth: 2, tip: true}), Plot.ruleY([0]) ] }));49:T63a,// Build a tiny pixel-art coin as a grid of SVG rects (retro bitmap style) function pixelCoinSVG(letter) { const n = 16; // bitmap grid size const px = 6; // rendered pixel size const cx = 7.5, cy = 7.5, r = 7.4; const font = { H: [ [1,0,0,0,1], [1,0,0,0,1], [1,0,0,0,1], [1,1,1,1,1], [1,0,0,0,1], [1,0,0,0,1], [1,0,0,0,1] ], T: [ [1,1,1,1,1], [0,0,1,0,0], [0,0,1,0,0], [0,0,1,0,0], [0,0,1,0,0], [0,0,1,0,0], [0,0,1,0,0] ], "?": [ [0,1,1,1,0], [1,0,0,0,1], [0,0,0,1,1], [0,0,1,0,0], [0,0,1,0,0], [0,0,0,0,0], [0,0,1,0,0] ] }[letter] ?? []; const fx0 = 5, fy0 = 4; const cells = []; for (let y = 0; y < n; y++) { for (let x = 0; x < n; x++) { const dx = x + 0.5 - cx, dy = y + 0.5 - cy; const dist = Math.hypot(dx, dy); if (dist > r) continue; let fill; if (dist > r - 1.5) fill = "#1f2937"; else if (dx < -1 && dy < -1 && dist < r * 0.55) fill = "#e5e7eb"; else fill = "#9ca3af"; const fxi = x - fx0, fyi = y - fy0; if (font.length && fyi >= 0 && fyi < font.length && fxi >= 0 && fxi < font[0].length && font[fyi][fxi]) { fill = "#111827"; } cells.push({x, y, fill}); } } const size = n * px; return svg``; } display(pixelCoinSVG("H"));4a:[] 46:{"id":"7b925c848d87673b","slug":"the-bayesian-coin-flip","title":"The Bayesian coin flip.","thumbnail":"085f2579a2fe685ce27d992453a2701d9a5ebffcacc58d171d93538d1771e3e2","access_level":"public","create_time":"$D2026-09-10T11:29:56.543Z","update_time":"$D2026-09-11T02:36:42.533Z","view_time":null,"first_public_time":"$D2026-09-11T03:46:22.099Z","has_unpublished_edits":null,"fork":true,"stars":0,"starred":false,"owner":{"type":"team","id":"07f3885d3acdc027","login":"dswalker","name":"D.S. Walker","avatar_url":"https://avatars-next.observableusercontent.com/e143eb3987f9b347440b049259d62ed409fdc48e1dda9e353f741c8162613fac","tier":"starter_2024","bio":"","following":false},"version":36,"publish_version":36,"role":null,"authored":false,"authors":[{"type":"individual","id":"559fe012966868e4","login":"dswalker","name":"D.S. Walker","avatar_url":"https://avatars-next.observableusercontent.com/e143eb3987f9b347440b049259d62ed409fdc48e1dda9e353f741c8162613fac","tier":null,"bio":"","following":false}],"members":[{"type":"team","id":"07f3885d3acdc027","login":"dswalker","name":"D.S. Walker","avatar_url":"https://avatars-next.observableusercontent.com/e143eb3987f9b347440b049259d62ed409fdc48e1dda9e353f741c8162613fac","tier":"starter_2024","role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"titling":"auto","title":"The Bayesian coin flip.","cells":[{"id":1,"value":"# The Bayesian coin flip.\n\nExplore how a **prior belief** about a coin's probability of heads gets updated into a **posterior belief** after observing some flips. Adjust the prior shape and the observed data below.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":3,"value":"import jStatModule from \"npm:jstat\";\nconst jStat = jStatModule.jStat ?? jStatModule;","pinned":true,"hidden":false,"mode":"js","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":4,"value":"const priorAlpha = view(Inputs.range([0.5, 20], {value: 2, step: 0.5, label: \"Prior α (successes-like)\"}));","pinned":true,"hidden":false,"mode":"js","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":5,"value":"const priorBeta = view(Inputs.range([0.5, 20], {value: 2, step: 0.5, label: \"Prior β (failures-like)\"}));","pinned":true,"hidden":false,"mode":"js","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":6,"value":"const nFlips = view(Inputs.range([0, 200], {value: 20, step: 1, label: \"Number of coin flips observed\"}));","pinned":true,"hidden":false,"mode":"js","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":7,"value":"const trueP = view(Inputs.range([0, 1], {value: 0.7, step: 0.01, label: \"True probability of heads (for simulated data)\"}));","pinned":true,"hidden":false,"mode":"js","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":10,"value":"$48","pinned":true,"hidden":false,"mode":"js","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":12,"value":"const flipHistory = view(Inputs.button(\"🪙 Flip a coin\", {\n value: [],\n reduce: (history) => [...history, Math.random() < trueP ? \"H\" : \"T\"]\n}));","pinned":true,"hidden":false,"mode":"js","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":13,"value":"","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":17,"value":"$49","pinned":true,"hidden":false,"mode":"js","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":14,"value":"const lastFlip = flipHistory[flipHistory.length - 1];\nconst manualHeads = flipHistory.filter((f) => f === \"H\").length;\nconst manualTails = flipHistory.length - manualHeads;\n\nconst coinAnimation = display(html`

${lastFlip ?? \"?\"}

${flipHistory.length ? (lastFlip === \"H\" ? \"Heads!\" : \"Tails!\") : \"Click the button above to flip a coin\"}

Manual flips: ${flipHistory.length} (${manualHeads} heads, ${manualTails} tails) — added to the ${nFlips} simulated flips below

`);","pinned":true,"hidden":false,"mode":"js","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":8,"value":"// Simulate a baseline batch of coin flips (from the slider) with a fixed seed for reproducibility\nconst rng = d3.randomLcg(42);\nconst flips = d3.range(nFlips).map(() => rng() < trueP ? 1 : 0);\nconst simHeads = d3.sum(flips);\nconst simTails = nFlips - simHeads;","pinned":true,"hidden":false,"mode":"js","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":15,"value":"// Combine the manually-flipped coins with the simulated batch\nconst heads = simHeads + manualHeads;\nconst tails = simTails + manualTails;\nconst nTotalFlips = nFlips + flipHistory.length;\nconst posteriorAlpha = priorAlpha + heads;\nconst posteriorBeta = priorBeta + tails;","pinned":true,"hidden":false,"mode":"js","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":9,"value":"const xGrid = d3.range(0, 1.001, 0.002);\n\nconst densityData = [\n ...xGrid.map((x) => ({x, density: jStat.beta.pdf(x, priorAlpha, priorBeta), series: \"Prior\"})),\n ...xGrid.map((x) => ({x, density: jStat.beta.pdf(x, posteriorAlpha, posteriorBeta), series: \"Posterior\"}))\n];\n\n// Likelihood (scaled to be visually comparable): proportional to p^heads * (1-p)^tails\nconst likelihoodRaw = xGrid.map((x) => Math.pow(x, heads) * Math.pow(1 - x, tails));\nconst likelihoodMax = d3.max(likelihoodRaw);\nconst posteriorMax = d3.max(densityData.filter(d => d.series === \"Posterior\"), d => d.density);\nconst likelihoodData = xGrid.map((x, i) => ({\n x,\n density: likelihoodMax > 0 ? (likelihoodRaw[i] / likelihoodMax) * posteriorMax : 0,\n series: \"Likelihood (scaled)\"\n}));\n\nconst allData = [...densityData, ...likelihoodData];","pinned":true,"hidden":false,"mode":"js","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":11,"value":"const priorMean = priorAlpha / (priorAlpha + priorBeta);\nconst posteriorMean = posteriorAlpha / (posteriorAlpha + posteriorBeta);\nconst posteriorVar = (posteriorAlpha * posteriorBeta) / (Math.pow(posteriorAlpha + posteriorBeta, 2) * (posteriorAlpha + posteriorBeta + 1));\nconst posteriorSD = Math.sqrt(posteriorVar);\nconst ci = [jStat.beta.inv(0.025, posteriorAlpha, posteriorBeta), jStat.beta.inv(0.975, posteriorAlpha, posteriorBeta)];\n\ndisplay(md`\n**Observed data:** ${heads} heads out of ${nTotalFlips} flips (empirical rate: ${(nTotalFlips ? heads / nTotalFlips : 0).toFixed(3)})\n\n**Prior mean:** ${priorMean.toFixed(3)} → **Posterior mean:** ${posteriorMean.toFixed(3)} (± ${posteriorSD.toFixed(3)} SD)\n\n**95% credible interval for p:** [${ci[0].toFixed(3)}, ${ci[1].toFixed(3)}]\n`);","pinned":true,"hidden":false,"mode":"js","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W4a","stdlib":"2"}} 47:"$46:body"