Move threshold back a few pixels and label it

[ggordn3r]

Beta testers showed a misunderstanding of the dashed line on the right. Rather than interpreting it as the threshold (as intended), the testers seem to take it as some maximum limit, then are annoyed that the bars aren't proportional. Owen also brought this up back in #41 (now closed)

I suggest the following slight design changes to clarify the threshold:

1) Move it back a few pixels, so that winners remain clearly "over" it rather than "at" it. Mathematically, it's a little inaccurate, but it removes any ambiguity around who won and who didn't. 2) Increase the size of the dashes and space in between them (more like - - - - than ----) 3) Add a label somewhere like "[25%] to win" that varies with the threshold value. 4) Indicate somehow that bars significantly over the threshold continue past the scope of the visible chart. (For example, tapering to an arrow like ===|=> ?)

Sample confused beta tester:

Please use the width of the page to accurately show the size of the results columns: The 38% for Cool weather is not proportionate to the other percentages! When it moves to 25% after redistribution of excess, the bar barely moves! Sawyer Morgan sawyer.morgan8@gmail.com

[iambateman]

I pushed a tweak. Let me know what you think.

Note:

if(width >= 101){
      return 103;
}

If it's 101% or 102%, it'll still show 103% to accentuate. the change.

[ggordn3r]

I think those tweaks are sufficient to test. Let's see if we get any further comments from users before making additional changes.