calliope-project / calliope-explore Goto Github PK
View Code? Open in Web Editor NEWA web-based UI to explore Calliope model results
Home Page: https://explore.callio.pe
A web-based UI to explore Calliope model results
Home Page: https://explore.callio.pe
It might be nice to also allow for filtering of the decision space based on spatially-explicit information, similar to what we do in the paper in our section about the "Different spatial configurations". For instance, users might want to filter the decision space not just in terms of "low biofuel utilisation" overall but in terms of "low biofuel utilisation in region X (say, Ireland)".
This feature would be even more relevant alongside a simultaneous implementation of the sliders based on deployed capacity (Issue #19). Capacity-based sliders and spatially-explicit filtering would allow users to reproduce precisely what we do in the paper, e.g., filtering options based on "low wind deployment in Britain and Ireland".
Currently, 'storage discharge' vs 'heat electrification' is the default scatter plot. Is this the most meaningful pair of indicators to have as a default?
Possible improvements could be (in order of difficulty of implementation as well as of degree of improvement):
a) agree on the "most meaningful" pair of indicators and use that as a default
b) let the user be free to choose which pair of indicators to have on the scatter, and which others to have as sliders
c) substitute all sliders and the scatter with a 2-d scatter (SPORE-plot) similar to what is there in the paper (Figure 4)
See the second subsection here which shows how we could have SPORE plots for each metric, with the ability to select a range and have it highlight the remaining connected scatter items in other subplots.
The mobile version of the interface looks good. However, the sliders and the spore plots span almost the entire width of the mobile screen. As a result, scrolling up and down becomes a bit tricky, since it is hard not to accidentally zoom in on the spore plots, or modify the sliders, while moving the finger up and down.
A possible improvement could be to slightly reduce the width of the sliders and spore plots. Or perhaps there are better solutions for mobile that I'm not aware of.
It would be good to have a few lines of the text in the interface itself to guide the user about "how to use" the tool.
For instance, explaining that they have to click on points on the scatter (SPORES) to visualise anything.
It would be perhaps worth also explaining what the indicators are, and how they are normalised
Currently, all slides range from 0 to 1. However, some of those have a much narrower 'actual' range. For instance, Gini is something like 0.7-1 only.
Would it make more sense to set the sliders' range to the min-max range of data? This should be done, however, in a way that is consistent with the scatter plot, which instead shows (correctly) all ranges from 0 to 1. One option would be to keep all slides with a 0-1 range while simultaneously 'stopping' the slider at the edges of the min-max data range.
See the first subsection here, where just hovering over a scatter item will change what one sees in another subplot (in our case, the maps / flows).
For some users (e.g., other modellers, technical people and more), it might be helpful to have the option to unlock alternative sliders based on deployed capacity. For instance, see Figure S14 of the associated paper.
Such sliders should not be added to the same page on which we have the default ones to avoid too much information, but rather be an alternative way of filtering the options that users can unlock optionally, say by clicking a button.
Some figures have different legend order on the left most map plot, which is very obvious when clicking around on lots of SPORES; e.g. on/offshore is flipped between 175 and 186.
Always show full legend in same order - with entries greyed out or crossed out if a tech is not deployed?
As well as our 9 metrics, it probably makes sense to have normalised primary energy supply for each SPORE as scatters. This would be onshore/offshore wind, PV (generic?), nuclear, biofuel+waste, and hydro.
Sliders can be vertical by passing vertical=True
to RangeSlider()
, so that the slider layout can be made to reflect the layout of the strip plot below, but this requires changes to the layout and CSS to work.
Just spit out the data as-is but merge it a pre-generated DataFrame with the units before rendering it
It would be good to know if users download data / take an image snapshot (#7) for a given metric subsetting. We can then build a picture of the kind of ranges people are honing in on.
To help the reader understand the map figure panels, perhaps a description that pops up on hover, or one that is obvious from a button click, could be added. It would basically be the paper figure caption but without reference to the choice of SPORES.
Once metrics have been subset by a user, it would be nice to have that downloadable as a snapshot image of the page or as a URL that when they navigate back to will reapply the same subsetting.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.