25:["$","title",null,{"children":"Probability Simulation | G-bob | Observable"}] 49:Tc30,viewof container = (async () => { const coinCanvas = html`

`; const coinCtx = coinCanvas.getContext("2d"); const probCanvas = html`

`; const probCtx = probCanvas.getContext("2d"); const probData = []; const coins = [ {x: 200, y: coinCanvas.height/2, side: "H"}, {x: 300, y: coinCanvas.height/2, side: "T",} ]; let numFlips = 0; let numTwoHeads = 0; const flipCoin = (coin) => { coin.side = (Math.random() < 0.5) ? "H" : "T"; }; const drawCoin = (coin) => { coinCtx.beginPath(); coinCtx.arc(coin.x, coin.y, 50, 0, 2 * Math.PI); if (coins[0].side === "H" && coins[1].side === "H") { coinCtx.fillStyle = "blue"; } else { coinCtx.fillStyle = "red"; } coinCtx.fill(); coinCtx.strokeStyle = "black"; coinCtx.lineWidth = 2; coinCtx.stroke(); coinCtx.closePath(); coinCtx.beginPath(); coinCtx.font = "bold 36px sans-serif"; coinCtx.textAlign = "center"; coinCtx.textBaseline = "middle"; coinCtx.fillStyle = "white"; coinCtx.fillText(coin.side, coin.x, coin.y); coinCtx.closePath(); coinCtx.beginPath(); coinCtx.font = "20px sans-serif"; coinCtx.textAlign = "center"; coinCtx.textBaseline = "bottom"; coinCtx.fillStyle = "black"; coinCtx.fillText(`Flips: ${numFlips}`, coinCanvas.width/2, coinCanvas.height - 10); coinCtx.closePath(); }; const drawCoins = () => { coinCtx.clearRect(0, 0, coinCanvas.width, coinCanvas.height); coins.forEach(drawCoin); }; const drawProb = () => { probCtx.clearRect(0, 0, probCanvas.width, probCanvas.height); probCtx.beginPath(); probCtx.moveTo(50, probCanvas.height - 50 - probData[0] * (probCanvas.height - 50)); for (let i = 1; i < probData.length; i++) { probCtx.lineTo(50 + (i / probData.length) * (probCanvas.width - 50), probCanvas.height - 50 - probData[i] * (probCanvas.height - 50)); } probCtx.strokeStyle = "black"; probCtx.lineWidth = 2; probCtx.stroke(); probCtx.closePath(); }; const flipButton = html``; flipButton.onclick = async () => { for (let i = 0; i < 100; i++) { coins.forEach((coin) => { flipCoin(coin); }); drawCoins(); numFlips++; if (coins[0].side === "H" && coins[1].side === "H") { numTwoHeads++; } probData.push(numTwoHeads / numFlips); if (probData.length > probCanvas.width) { probData.shift(); } drawProb(); await new Promise((resolve) => setTimeout(resolve, 500)); } }; const container = html`

`; container.appendChild(coinCanvas); container.appendChild(flipButton); container.appendChild(probCanvas); Plot.plot({ y:{domain:[0,1]}, x:{domain:[0,numFlips],tickFormat:".0f"}, marks:[ Plot.ruleX([numFlips]), Plot.ruleY(numTwoHeads), Plot.line({x:numFlips,y:numTwoHeads/numFlips}) ] }) return container; })(); 4a:[] 29:{"id":"f4e21d6b4e53c77e","slug":null,"title":"Probability Simulation","thumbnail":"77b3e02c037450fe48e428d9f0f2c220e5c802285cd9e87552bf5954e1cb8b4d","access_level":"public","create_time":"$D2023-04-17T21:37:00.137Z","update_time":"$D2023-04-20T03:09:04.778Z","view_time":null,"first_public_time":"$D2023-04-17T21:37:00.137Z","has_unpublished_edits":null,"fork":false,"stars":0,"starred":false,"owner":{"type":"team","id":"bbe4644830e68b05","login":"will-greller","name":"G-bob","avatar_url":"https://avatars-next.observableusercontent.com/2043133f8e69b47c6e1f036b2b7f43e2427b7a022575dc30a2cc8b89fe70cf74","tier":"starter_2024","bio":"","followed_by_you":false,"follows_you":false},"version":143,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"915d846b9c783b84","login":"will-greller","name":"G-bob","avatar_url":"https://avatars-next.observableusercontent.com/2043133f8e69b47c6e1f036b2b7f43e2427b7a022575dc30a2cc8b89fe70cf74","tier":null,"bio":"","followed_by_you":false,"follows_you":false}],"members":[{"type":"individual","id":"915d846b9c783b84","login":"will-greller","name":"G-bob","avatar_url":"https://avatars-next.observableusercontent.com/2043133f8e69b47c6e1f036b2b7f43e2427b7a022575dc30a2cc8b89fe70cf74","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"titling":"auto","title":"Probability Simulation","cells":[{"id":0,"value":"# Probability Simulation","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":5,"value":"$49","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W4a","stdlib":"1"}} 24:null