float emissions over map in new column

[acircleda]

I moved the map into a new column and used CSS to float emissions over the map. We can use the right column to include all the educational materials we would like.

[KKulma]

thanks for the PR @acircleda and apologies for the delay reviewing it! I like the idea of having a clear space for all the metrics and any additional info, however, in the current form the map size is significantly reduced. What do you think about adding an absolutePanel() instead, similar to the app here or just a table, like here?

[KKulma]

@acircleda also, have a look at the absolute-panel branch. It's not finished but I think it gives us an idea if this is the style we like

[acircleda]

I'm not sure about the absolute panel. From a UX perspective, the floating panel does not seem related to the input field at the top and it was not intuitive that it could be moved.

The look I was going for was the map on one side and then metrics or graphics related to the emissions on the right (where the red box below is). For example what % the flight is of our allowable carbon budget, how much arctic ice is melted, etc (like here or here). You said it was significantly reduced. How small was it? The map is a nice touch, but do you think it should be the focus (take up a lot of space) compared to other information?

Instead of putting the form in there, we could put the results. With additional information below? I'm just not sure if we want the map to be the focus. What do you think?

[KKulma]

I think we have a very similar idea in mind and we only need to iron out some details :) Things that I think we agree on:

• the map should not be the main focus
• in the results output, we should have the chosen footprint metric highlighted but also other metrics from {footprint} displayed
• in the results output, calculated footprint should be explained in more tangible terms, e.g. allowable carbon budget, car miles, melted ice, etc.

Now, my thinking behind the absolute-panel draft was that:

• flight class and the footprint metric options need to be displayed, no matter whether we calculate the footprint for IATA code, cities or coordinates. They don't have to be in the absolute panel but I think they should be "static" compared to the menu that changes with the radio button options.
• I like the idea of the absolute panel because we can remove it altogether before the inputs are in and then it can take as much space as we like - so it can be bigger than it is now
• finally, I don't want to the map to dominate the app, but at the same time I don't think that having a blank space on half of the screen before we enter the inputs is particularly pleasing, so I'm happy to discuss any alternatives, really 👍

Hope it all makes more sense now!

[acircleda]

• the map should not be the main focus

  • agree

• in the results output, we should have the chosen footprint metric highlighted but also other metrics from {footprint} displayed

  • I agree with this, but they will need to be displayed textually, as both Ch4 and N2O are far smaller (less than 1) and so cannot be visualized on a chart with similar axes.

• in the results output, calculated footprint should be explained in more tangible terms, e.g. allowable carbon budget, car miles, melted ice, etc.

  • Yes! Perhaps we should focus on getting these down first so we can see what we will include and how much room they will take up?

• flight class and the footprint metric options need to be displayed, no matter whether we calculate the footprint for IATA code, cities or coordinates. They don't have to be in the absolute panel but I think they should be "static" compared to the menu that changes with the radio button options.

  • I agree. We should remove them from the conditional panels then. We should also include a check box for raditative forcing, and have it selected by default.

• I like the idea of the absolute panel because we can remove it altogether before the inputs are in and then it can take as much space as we like - so it can be bigger than it is now

• finally, I don't want to the map to dominate the app, but at the same time I don't think that having a blank space on half of the screen before we enter the inputs is particularly pleasing, so I'm happy to discuss any alternatives, really

  • We could pre-fill with an example? Or we can keep the map at the bottom and the results appear between the form and the map rather than side-by-side?

[KKulma]

Sounds good. Let's start with the examples of the context for the emissions results, then, and then we can decide how to deal with the text area for them. All the other suggestions I captured in the Issues.

I was thinking about one more suggestion: perhaps we could streamline the input flow a bit by offering a single input for City and IATA - we could display a city name with IATA code in the brackets in the UI.

Additionally, we could group airports by country (we could use select input groups for that). Not strictly necessary, but I think it would keep things tidier and would encourage data exploration.

What do you think?