Create Component for Vote Commitment Map breakdown

[andrewtremblay]

New Design Pending after Recent User Test: Hold off on implementing this issue

Using an existing svg map of the US https://commons.wikimedia.org/wiki/File:Blank_US_Map_(states_only).svg

Create a react component that shows the commitment of each state on a given issue:

Requirements

Each state must show:

• [ ] Non-committed (White)
• [ ] Committed Yea (Blue)
• [ ] Committed Nay (Red)
• [ ] Mixed commitment:
  • [ ] Partial Yea/Nay (Red/Blue)
  • [ ] Partial Non-commitment/Nay (Red/White)
  • [ ] Partial Non-commitment/Yea (Blue/White)
• [ ] Mark states to be lower in opacity (light-red with white stripes as seen in Montana, light-blue with dark blue stripes as seen in Illinois)
• [ ] Smaller/Northeast states show up as additional circles
  • [ ] VT, NH, MA, RI. CT, NJ, DE, MD, DC
• [ ] Show "our confidence" level in lower right corner

Design

[ethanbb]

Design clarification: should a state that is "partially" committed be shaded in proportion to how many of its representatives support each position, or should the stripes always be equal width (looks better but maybe misleading)?

Also, what does "Mark states to be lower in opacity" mean?

[fleenshop]

@ethanbb This is being edited after the testing we held today... please hang on. (The intent had been equal width -- this is the Senate map, so if it's split, it was always split evenly between the two senators. The House map is by district. But anyway, that's moot. Like wise, the intent with the "lower opacity" -- i.e., the dark red and faded red, and dark blue and faded blue. Moot after testing. Will post a revision.)

[andrewtremblay]

Closing as duplicate of issue #51