Skip to content

An interactive US presidential, senate, house, and governor map for election results and projections. Written in HTML/CSS/JS

Notifications You must be signed in to change notification settings

jacksonjude/USA-Election-Map

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

USA Election Map

An interactive USA presidential, senate, house, and governor election map. Created with HTML/CSS/JS, map svg outlines from YAPms & US District Shapefiles, and map data from MIT Election Lab & Dave Leip's Atlas.

Features

  • Interactive and detailed map sources
    • Past results for presidential (1788-2020, counties for 1992-2020), senatorial (1960-2020), house (1976-2020), and gubernatorial (1980-2020) elections, with victory margin and voteshare breakdowns for each state & district
    • Pie chart for electoral vote counts by party and margin, national popular vote totals for past elections
    • Flip states and counties between election cycles
    • Fully editable custom maps that can be downloaded and uploaded as JSON or CSV files
  • Comparisons between different map sources
    • Can show shift between elections for states and counties
    • Can show margins of error between projections and election results
  • Countdown timer to upcoming elections and important events
  • Keyboard controls for advanced usage

Development

Running a fork locally is simple since this code only uses the base HTML/CSS/JS stack. Just clone the repo and open index.html in your browser to run.

Since the site uses svg files in the local svg-sources folder, your browser might prevent them from loading over the file:// protocol due to CORS restrictions (this is a well known issue: see more info and solution).

  • For Safari: go to Develop > Developer Settings > Disable local file restrictions.
  • For Chrome: open via command line to disable CORS:
    • Mac:
      "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome" --allow-file-access-from-files
      
    • Windows:
      "C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --allow-file-access-from-files
      
  • For Firefox: go to about:config and set the security.fileuri.strict_origin_policy flag to false

Another way to address the CORS issue is to run a local http server. On Mac (via Homebrew):

brew install http-server
cd <local repo path>
http-server

Then open the address provided in the Terminal window (by default, it seems to be http://localhost:8080).

TODO List

See the project issue board for upcoming features.

If you have any questions, suggestions, or feature ideas, feel free to open an issue here on GitHub. Alternatively, you can email jjcooley0@gmail.com.

About

An interactive US presidential, senate, house, and governor map for election results and projections. Written in HTML/CSS/JS

Topics

Resources

Stars

Watchers

Forks

Sponsor this project