Last active
October 3, 2016 14:09
-
-
Save dwillis/c59d3abf381e3ce5c4160ce2f8f534d0 to your computer and use it in GitHub Desktop.
Provisional ballots
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <html> | |
| <head> | |
| <style> | |
| #landline_container { | |
| width:95%; | |
| max-width:600px; | |
| } | |
| #landline_tooltip { | |
| position:absolute; | |
| background:rgba(222, 222, 222, 0.95); | |
| z-index:999999; | |
| font-family: Helvetica, Arial, sans-serif; | |
| font-weight:bold; | |
| font-size:12px; | |
| padding:5px; | |
| border-radius:2px; | |
| box-shadow:0 0 5px #444; | |
| display:none; | |
| } | |
| #landline_tooltip h2 { | |
| margin:0; | |
| padding:0; | |
| font-size:14px; | |
| } | |
| .tooltip_sub { | |
| font-size:12px; | |
| font-weight:normal; | |
| display:inline-block; | |
| line-height:14px; | |
| } | |
| </style> | |
| <!-- Bring your own copy of jQuery/Underscore/Raphael here --> | |
| <!-- To support IE < 9, include jQuery 1.x --> | |
| <script src="https://code.jquery.com/jquery-3.1.1.min.js" integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script> | |
| <script src="//cdnjs.cloudflare.com/ajax/libs/underscore.js/1.6.0/underscore-min.js"></script> | |
| <script src="//cdnjs.cloudflare.com/ajax/libs/raphael/2.1.2/raphael-min.js"></script> | |
| <script src="//propublica.s3.amazonaws.com/assets/voter-id-litigation/landline.js"></script> | |
| <script src="//propublica.s3.amazonaws.com/assets/voter-id-litigation/landline.stateline.js"></script> | |
| <script src="//propublica.s3.amazonaws.com/assets/voter-id-litigation/states_packaged.js"></script> | |
| <script src="//propublica.s3.amazonaws.com/assets/voter-id-litigation/states_options.js"></script> | |
| <!-- Create a tooltip container --> | |
| <script type="text/jst" id="landline_tooltip_tmpl"> | |
| <h2><%= n %></h2> | |
| <span class="tooltip_sub"> | |
| <% if (pct == "No Data") { %>No Data Available<% } else { %> | |
| <%= pct %>% provisional ballots cast | |
| <% } %> | |
| </span> | |
| </script> | |
| <script> | |
| var provisional = {"02":["Alaska",6.04],"01":["Alabama",0.37],"05":["Arkansas",0.24],"04":["Arizona",7.89],"06":["California",8.13],"08":["Colorado",2.42],"09":["Connecticut",0.06],"11":["District of Columbia",13.13],"10":["Delaware",0.11],"12":["Florida",0.5],"13":["Georgia",0.53],"15":["Hawaii",0.16],"19":["Iowa",0.31],"16":["Idaho",0.0],"17":["Illinois",0.82],"18":["Indiana",0.18],"20":["Kansas",3.48],"21":["Kentucky",0.02],"22":["Louisiana",0.34],"25":["Massachusetts",0.41],"24":["Maryland",2.92],"23":["Maine",0.04],"26":["Michigan",0.06],"27":["Minnesota",0.0],"29":["Missouri",0.23],"28":["Mississippi","No Data"],"30":["Montana",1.13],"37":["North Carolina",1.13],"38":["North Dakota",0.0],"31":["Nebraska",1.86],"33":["New Hampshire",0.0],"34":["New Jersey",2.65],"35":["New Mexico",0.97],"32":["Nevada",0.82],"36":["New York",6.89],"39":["Ohio",3.69],"40":["Oklahoma",0.4],"41":["Oregon",0.1],"42":["Pennsylvania",0.85],"44":["Rhode Island",0.52],"45":["South Carolina","No Data"],"46":["South Dakota",0.12],"47":["Tennessee",0.29],"48":["Texas",0.64],"49":["Utah",5.23],"51":["Virginia",0.33],"50":["Vermont",0.01],"53":["Washington",0.21],"55":["Wisconsin",0.0],"54":["West Virginia","No Data"],"56":["Wyoming","No Data"]} | |
| </script> | |
| </head> | |
| <body> | |
| <div id="landline_container"></div> | |
| <script> | |
| $(function() { | |
| // Initialize the map | |
| var map = new Landline.Stateline("#landline_container", "states", options); | |
| // Set up the tooltip template | |
| var tmpl = _.template($("#landline_tooltip_tmpl").html()); | |
| // Add tooltips, and cache the existing style | |
| // to put it back in place on mouseout | |
| map.on('mouseover', function(e, path, data) { | |
| data.existingStyle = (data.existingStyle || {}); | |
| data.existingStyle["fill"] = path.attr("fill"); | |
| data.existingStyle["strokeWidth"] = path.attr("stroke-width"); | |
| path.attr("fill", "#999").attr("stroke-width", 1); | |
| }); | |
| map.on('mousemove', function(e, path, data) { | |
| $("#landline_tooltip").html(tmpl({ | |
| n : data.get('n'), | |
| pct : provisional[data.fips][1] | |
| })).css("left", e.pageX + 20).css("top", e.pageY + 20).show(); | |
| }); | |
| map.on('mouseout', function(e, path, data) { | |
| $("#landline_tooltip").hide(); | |
| _(data.existingStyle).each(function(v, k) { | |
| path.attr(k, v); | |
| }); | |
| }); | |
| // Census data convenience functions | |
| var provColor = function(prov) { | |
| if (prov == "No Data") return "rgb(255,255,255)"; | |
| if (prov < 1.0) return "rgb(186,228,179)"; | |
| if (prov < 5.0) return "rgb(116,196,118)"; | |
| if (prov < 10.0) return "rgb(49,163,84)"; | |
| return "rgb(0,109,44)"; | |
| }; | |
| // Color states by income level | |
| _(provisional).each(function(ary, fips) { | |
| map.style(fips, "fill", provColor(ary[1])); | |
| }) | |
| // Draw the map | |
| map.createMap(); | |
| }); | |
| </script> | |
| <p>Percentage of ballots cast in 2012 in each state that were provisional ballots. Source: "Waiting in Line to Vote", Charles Stewart III and Stephen Ansolabehere.</p> | |
| <div id="landline_tooltip"></div> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment