Overhauled GHG section

[danrademacher]

New design:

Currently looks like this:

The full-width bar charts are the same as the lower left ones in current build, except (a) they are wider and (b) the order of categories should always be electric, steam, gas.

Note that there is variant text that shows when a building is already 100% electric. For the three bullet points at the bottom and the link on right. Icons stay the same

Congratulations! Your building is all electric and carbon neutral.

PLAN – Is your building as efficient as it can be?

REDUCE – Check out City Light’s incentives

RENEWABLES – Get even greener

https://www.seattle.gov/city-light/business-solutions/renewable-energy-services

┆Issue is synchronized with this Asana task

[tomay]

• [x] "Variant" described above is still TO DO

• [x] Also, we need some sort of page break when top blue alert is hidden (because no performance chart):

[tomay]

The second chart on this one for COLMAN BUILDING is overflowing, as if the values are adding up to more than 100%: https://greeninfo-network.github.io/seattle-building-dashboard/#seattle/2020?layer=energy_star_score&sort=energy_star_score&order=desc&lat=47.60475&lng=-122.33566&zoom=15&building=678&report_active=true

Looks like they are running the correct values through a function fixPercents() which actually makes each measure 1% larger, for a total of 102%. Maybe some of them it actually fixes?

The function itself is inscrutable, without comments:

    fixPercents: function(fuels, prop) {
      const values = fuels.map((d, i) => {
        const decimal = +((d[prop].pct_raw % 1));
        const val = Math.floor(d[prop].pct_raw);
        return {
          idx: i,
          val,
          iszero: val === 0,
          decimal: val === 0 ? 1 : decimal
        };
      }).sort((a, b) => {
        return b.decimal - a.decimal;
      });

      const sum = d3.sum(values, d => d.val);

      let diff = 100 - sum;

      values.forEach(d => {
        if (diff === 0) return;

        diff -= 1;
        d.val += 1;

        d.iszero = false;
      });

I'm only seeing this issue on the one building so far. WASH MUTUAL TOWER (1201 THIRD AVE) is another with all three fuel types, but there is no overflow. https://greeninfo-network.github.io/seattle-building-dashboard/#seattle/2019?layer=energy_star_score&sort=energy_star_score&order=desc&lat=47.60845&lng=-122.33613&zoom=15&building=399&report_active=true

[tomay]

COURTYARD BY MARRIOTT - SEATTLE 100% Electric:

Current threshold is 99% per Terry's comment in #4:

You can use electricity_pct > 0.99 or something