25:["$","title",null,{"children":"Simulating the 2016 Presidential Election | Data Viz Insights | Observable"}] 49:Tbd7,# Simulating the 2016 Presidential Election The 2016 US Presidential Election was a pivotal moment in our history. Clearly, the difference between the candidates was so stark and the electorate so divided that the outcome was always going to be of crucial importance. Regardless of your political stance, one clearly negative effect from a data science perspective is the erosion in confidence in polls and, potentially, in statistical techniques in general. Political scientist Lloyd Gruber [put it this way](http://eprints.lse.ac.uk/67227/1/blogs.lse.ac.uk-How%20political%20scientists%20got%20Trump%20exactly%20wrong.pdf): > One of the major casualties of the 2016 election season has been the reputation of political science... In reality, though, the proper statistical analysis of polls can only lead to probabilistic statements - not definitive predictions. While it is certainly the case that many pundits stated with confidence that Hillary Clinton would win the 2016 Presidential election, most reputable analysts were less confident and stated their results in a proper probabilistic fashion. [FiveThirtyEight's forecast](https://projects.fivethirtyeight.com/2016-election-forecast/), in particular gave Clinton only a 71% chance of victory - favorable, but hardly a guarantee. To put that in a sporting context, I applied the regression analysis from [this paper](https://statsbylopez.files.wordpress.com/2016/01/lab4.pdf) and found that NFL kickers make field goals from 47 yards about 71% of the time. If you're a football fan and your team is about to kick a 47 yard field goal to win the game in the waning moments, you're certainly not walking away thinking it's a done deal! In this notebook (which is the second of two parts), we're going to take a simplified look at FiveThirtyEight's simulation procedure to get some sense of how they went from state by state estimates to a nationwide estimate - a problem that's complicated by our electoral college. ## Recap [Last time](https://observablehq.com/d/0430ace55fce3a25) we learned that, from a well designed poll of voters, it's possible to make a probabilistic assessment of the outcome of an election that's determined by simple popular vote. The short version of that goes something like so: - We survey ${tex`n`} people and find proportions ${tex`\hat{p}_1`} and ${tex`\hat{p}_2`} that prefer candidates 1 and 2. - The outcome should be related to the difference ${tex`\hat{p}_1 - \hat{p}_2`} - Furthermore, the distribution of ${tex`\hat{p}_1 - \hat{p}_2`} is well understood; it depends not only on ${tex`\hat{p}_1`} and ${tex`\hat{p}_2`} but also on the sample size ${tex`n`}. - In the image below, - ${tex`\hat{p}_1 = 0.48`}, - ${tex`\hat{p}_2 = 0.45`}, and - ${tex`n=1000`}. - We might interpret - the blue area as the probability that candidate 1 defeats candidate 2, - the red area as the probability that candidate 2 defeats candidate 1. - Computing the those quantities is the realm of calculus, numerical analysis, and statistics.4a:T5be,electoral_map_2016 = { stateShapes.features = stateShapes.features.filter( (o) => parseInt(o.id) <= 56 ); let w = 900; let h = 530; let svg = d3 .create("svg") .attr("viewBox", [0, 0, w, h]) .attr("width", "100%") .style("max-width", `${w}px`); let proj = d3.geoAlbersUsa().fitSize([w, h], stateShapes); let path = d3.geoPath().projection(proj); let map = svg.append("g"); let state_group = map.append("g"); state_group .selectAll("path.state") .data(stateShapes.features) .join("path") .attr("d", path) .attr("stroke-width", "1") .attr("stroke", "#ddd") .attr("stroke-linejoin", "round") .attr("fill", function (s) { let d = data.find( (o) => o.state == s.properties.name && o.candidate == "Hillary Clinton" ); return d3.interpolateRdBu(d.winprob); }) .each(function (d, b, c) { // console.log([d, b, c, this]); let winprobs = data.filter((o) => d.properties.name == o.state); let trump_info = winprobs.find((o) => o.candidate == "Donald Trump"); let clinton_info = winprobs.find((o) => o.candidate == "Hillary Clinton"); let tip = `

${clinton_info.state}

Clinton: ${d3.format( "0.1%" )(clinton_info.winprob)}
Trump: ${d3.format("0.1%")( trump_info.winprob )}

`; tippy(this, { content: tip, allowHTML: true, theme: "light-border" }); }); return svg.node(); }4b:T734,### A much simpler question Let's tackle a much simpler question first. Let's suppose I've got five shirts and three pairs of pants in the following colors: - Shirts: 3 black and 2 grey - Pants: 2 black and 1 gray I walk into my dark closet, blindly grab a shirt and pair of pants and throw them on. What's the probability that I've got black pants and a grey shirt? #### Straightforward solution This is not so bad because I can list out all the possibilities. - Black shirt, black pants: ${tex`\displaystyle \frac{3}{5}\times\frac{2}{3} = \frac{2}{5}`} - Black shirt, gray pants: ${tex`\displaystyle \frac{3}{5}\times\frac{1}{3} = \frac{1}{5}`} - Gray shirt, black pants: ${tex`\displaystyle \frac{2}{5}\times\frac{2}{3} = \frac{4}{15}`} - Gray shirt, gray pants: ${tex`\displaystyle \frac{2}{5}\times\frac{1}{3} = \frac{2}{15}`} You might notice that ${tex.block`\frac{2}{5} + \frac{1}{5} + \frac{4}{15} +\frac{2}{15} = \frac{6+3+4+2}{15}=1.`} This seems reasonable since exacty one of those outcomes must happen. #### Complications In the above situation, there were 4 possible scenarios to consider. What if I included a black or gray jacket? Now there are ${tex`2^3=8`} different configurations. How about a hat and tie as well? Now there are ${tex`2^5 = 32`} different configurations. In the US election scenario, there are 50 states plus DC that contribute different electoral counts to the overall result. That yields ${tex.block`2^{51} = 2,251,799,813,685,248`} different scenarios to consider. Good luck with that! #### Simulation The idea behind simulation is to repeat a computer experiment that models the situation thousands of times and count the number of successes. In the pants/shirt example, we might write the following function that generates the possibilities at random in their correct proportion:4c:Ta71,simulation_map = { increase_variability; stateShapes.features = stateShapes.features.filter( (o) => parseInt(o.id) <= 56 ); let w = 900; let h = 530; let container = d3.create("div").style("max-width", `${w}px`); // .style("position", "relative"); let info = container .append("div") // .style("position", "absolute") // .style("top", "10px") // .style("left", "20px") .text(""); let svg = container .append("svg") .attr("viewBox", [0, 0, w, h]) .attr("width", "100%") .style("max-width", `${w}px`); let proj = d3.geoAlbersUsa().fitSize([w, h], stateShapes); let path = d3.geoPath().projection(proj); let map = svg.append("g"); let state_group = map.append("g"); state_group .selectAll("path.state") .data(stateShapes.features) .join("path") .attr("d", path) .attr("stroke-width", "2") .attr("stroke", "#eee") .attr("stroke-linejoin", "round") .attr("fill", "lightgray"); let clinton_wins = 0; let trump_wins = 0; container.node().map_simulate = map_simulate; return container.node(); function map_simulate(variability) { let simulation = simulate(variability); if (simulation["Donald Trump"] > 269) { trump_wins = trump_wins + 1; info.html( `Trump wins ${simulation["Donald Trump"]} to ${ simulation["Hillary Clinton"] }
Trump wins: ${trump_wins} - Clinton wins: ${clinton_wins}
Percentage Trump wins: ${d3.format("0.2%")( trump_wins / (trump_wins + clinton_wins) )}` ); } else if (simulation["Hillary Clinton"] > 269) { clinton_wins = clinton_wins + 1; info.html( `Clinton wins ${simulation["Hillary Clinton"]} to ${ simulation["Donald Trump"] }
Trump wins: ${trump_wins} - Clinton wins: ${clinton_wins}
Percentage Trump wins: ${d3.format("0.2%")( trump_wins / (trump_wins + clinton_wins) )}` ); } state_group .selectAll("path") .attr("fill", "lightgray") .each(function (d, i) { let el = this; let state_name = d.properties.name; let winner = simulation.state_results.find( (s) => s.state == state_name ); if (winner) { winner = winner.candidate; let color = winner == "Donald Trump" ? d3.interpolateRdBu(0.2) : d3.interpolateRdBu(0.8); Promises.delay(20 * i).then(function () { d3.select(el).attr("fill", color); }); } else { ("pass"); } }); return simulation; } }4d:[{"id":"964432b9d5956474127baaacd3dce7aadbc2c5670d52cc37f45b912e2d46cdd09cd4f952f6384535a78eb9e02c0eaac449650d6d5079203d53f0f76751159782","href":"https://static.observableusercontent.com/files/964432b9d5956474127baaacd3dce7aadbc2c5670d52cc37f45b912e2d46cdd09cd4f952f6384535a78eb9e02c0eaac449650d6d5079203d53f0f76751159782","name":"fiveThirtyEightStateAnalysis.csv","type":"text/csv","lastModified":1694443865545.784,"size":3218}] 29:{"id":"dfb299f80506aaf9","slug":null,"title":"Simulating the 2016 Presidential Election","thumbnail":"6ab59d8c2dee995eb3df5fe49cd9c245d7491301ba2f48660307e1c9cea17005","access_level":"public","create_time":"$D2023-09-11T14:51:05.545Z","update_time":"$D2023-09-15T11:05:44.209Z","view_time":null,"first_public_time":"$D2023-09-11T14:51:53.257Z","has_unpublished_edits":null,"fork":true,"stars":0,"starred":false,"owner":{"type":"team","id":"e59531852f3a26f9","login":"data-viz-insights","name":"Data Viz Insights","avatar_url":"https://avatars-next.observableusercontent.com/307a2fe144554c3274dc52c733e9dcb2a90d30a16bdd26ad4e2317c6c1f99dab","tier":"education_2026","bio":"","followed_by_you":false,"follows_you":false},"version":612,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"c3301e515dd08a41","login":"mcmcclur","name":"Mark McClure","avatar_url":"https://avatars-next.observableusercontent.com/e615e819ce83d43faef607e48c53c5ff63943aa0ba9f5848499bd02fef7396f4","tier":null,"bio":"I'm a professor of mathematics at the University of North Carolina Asheville. I've also done a fair amount of consulting work over the years focusing on scientific and data visualization.\n\nI'm happy to be part of the first Observable Ambassador's cohort.","followed_by_you":false,"follows_you":false}],"members":[{"type":"individual","id":"c3301e515dd08a41","login":"mcmcclur","name":"Mark McClure","avatar_url":"https://avatars-next.observableusercontent.com/e615e819ce83d43faef607e48c53c5ff63943aa0ba9f5848499bd02fef7396f4","tier":null,"role":"editor"},{"type":"team","id":"e59531852f3a26f9","login":"data-viz-insights","name":"Data Viz Insights","avatar_url":"https://avatars-next.observableusercontent.com/307a2fe144554c3274dc52c733e9dcb2a90d30a16bdd26ad4e2317c6c1f99dab","tier":"education_2026","role":"viewer"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"titling":"auto","title":"Simulating the 2016 Presidential Election","cells":[{"id":0,"value":"$49","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":394,"value":"Plot.plot({\n marks: [\n Plot.areaY(\n d3.range(-0.1, 0, 0.001).map((x) => [x, pdf(default_parameters)(x)]),\n { x: (d) => d[0], y: (d) => d[1], fill: \"red\" }\n ),\n Plot.areaY(\n d3.range(0, 0.2, 0.001).map((x) => [x, pdf(default_parameters)(x)]),\n { x: (d) => d[0], y: (d) => d[1], fill: \"blue\" }\n ),\n Plot.line(\n d3.range(-0.1, 0.2, 0.001).map((x) => [x, pdf(default_parameters)(x)]),\n { strokeWidth: 3 }\n ),\n Plot.ruleX([0]),\n Plot.ruleY([0]),\n Plot.axisY({ x: 0 })\n ]\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":398,"value":"## FiveThirtyEight\n\nThe outstanding statisticians at [FiveThirtyEight](https://fivethirtyeight.com/) published their final forecast of the 2016 presidential election in the early morning of election day. You can [see their forecast here](https://projects.fivethirtyeight.com/2016-election-forecast/). As shown on that webpage, they had\n\n- Hillary Clinton with a 71.4% chance to win and\n- Donald Trump with a 28.6% chance to win.\n\nThey've also got a map indicating the odds for each individual state. Here's a rough reproduction of that map:","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":148,"value":"$4a","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":400,"value":"The key question is: \n\n> *how do they go from those individual estimates to a nationwide estimate*?","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":404,"value":"$4b","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":350,"value":"function dress_once() {\n let pants = Math.random();\n let shirt = Math.random();\n if (pants < 2 / 3 && shirt < 3 / 5) {\n return [\"black\", \"black\"];\n } else if (2 / 3 < pants && shirt < 3 / 5) {\n return [\"gray\", \"black\"];\n } else if (pants < 2 / 3 && 3 / 5 < shirt) {\n return [\"black\", \"gray\"];\n } else {\n return [\"gray\", \"gray\"];\n }\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":464,"value":"We could run it once:","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":459,"value":"one_try = dress_once()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":467,"value":"So that time it was ${one_try[0]} pants and a ${one_try[1]} shirt. I suppose I could just re-execute that a bunch of times and count up the results. Better yet, I could automate:","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":352,"value":"d3\n .range(100000)\n .map(dress_once)\n .filter((a) => a[0] == \"gray\" && a[1] == \"gray\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":473,"value":"### Simulating the election\n\nThe map below does something similar but for the election. We'll have to play with it in class!","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":210,"value":"viewof simulate_button = {\n increase_variability;\n let button = Inputs.button(\"Simulate once\");\n return button;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":224,"value":"viewof increase_variability = Inputs.toggle({\n label: \"Increase variability:\",\n value: true\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":205,"value":"$4c","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":339,"value":"viewof simulate_lots_button = Inputs.button(\"Simulate lots\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":345,"value":"In 1000 simulations with${\n increase_variability ? \"\" : \"out\"\n } increased variability, Trump won ${trump_victory_county} times.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":326,"value":"## Simulation functions","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":255,"value":"// React to button pushes\n{\n if (simulate_button > 0) {\n simulation_map.map_simulate(increase_variability);\n }\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":55,"value":"trump_victory_county = {\n simulate_lots_button;\n let results = d3.range(1000).map(() => simulate(increase_variability));\n return results.filter((o) => o[\"Donald Trump\"] > 269).length;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":606,"value":"simulate()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":49,"value":"function simulate(add_variability) {\n let results = d3.rollup(\n data,\n (a) => simulate_state_once(a, add_variability),\n (o) => o.state\n );\n let tally = { \"Donald Trump\": 0, \"Hillary Clinton\": 0, state_results: [] };\n results.forEach(function (o) {\n if (o) {\n tally[o.candidate] = tally[o.candidate] + o.votes;\n tally.state_results.push(o);\n }\n });\n return tally;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":121,"value":"function simulate_state_once(data, shift) {\n let hil_info = data.find((o) => o.candidate == \"Hillary Clinton\");\n let don_info = data.find((o) => o.candidate == \"Donald Trump\");\n let p1 = hil_info.winprob;\n let p2 = don_info.winprob;\n if (shift) {\n let d = p1 - p2;\n let p11 = p1;\n let p22 = p2;\n let s = Math.random() / 4;\n p1 = p11 * (1 - s) + p22 * s;\n p2 = p22 * (1 - s) + p11 * s;\n }\n let p = Math.random();\n if (p < p1) {\n return Object.assign({}, hil_info);\n } else if (p1 < p && p < p1 + p2) {\n return Object.assign({}, don_info);\n } else {\n return null;\n }\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":324,"value":"## Data and imports","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":19,"value":"data = {\n let data = await FileAttachment(\"fiveThirtyEightStateAnalysis.csv\").csv({\n typed: true\n });\n data.forEach((o) => (o.winprob = o.winprob / 100));\n\n return data;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":141,"value":"import { stateShapes } from \"@observablehq/us-county-datasets\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":194,"value":"tippy_style = html``","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":192,"value":"tippy = require(\"tippy.js\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":477,"value":"default_parameters = ({\n p1: 0.48, // The proportion of voters who lke Candidate 1\n p2: 0.45, // The proportion of voters who lke Candidate 2\n n: 1000, // The sample size\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":365,"value":"function pdf(parameters) {\n let m0 = parameters.p1 - parameters.p2;\n let s = Math.sqrt((parameters.p1 + parameters.p2 - m0 ** 2) / parameters.n);\n let pdf = (x) =>\n Math.exp(-((x - m0) ** 2 / (2 * s ** 2))) / (Math.sqrt(2 * Math.PI) * s);\n\n pdf.m0 = m0;\n pdf.s = s;\n\n return pdf;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":534,"value":"function integrate(ff, a, b) {\n return adaptiveSimpson(ff, a, b, {\n tolerance: 1e-11,\n maxDepth: 8,\n minDepth: 7\n });\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":510,"value":"import { adaptiveSimpson } from \"@rreusser/integration@3056\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W4d","stdlib":"1"}} 24:null