16TH INTERNATIONAL CONFERENCE ON GEOMETRY AND GRAPHICS 4–8 AUGUST, 2014, INNSBRUCK, AUSTRIA
©2014 ISGG
ENERGETICAL STREAMS VISUALIZATION USING INTERACTIVE SANKEY DIAGRAMS Daniele Ciminieri1, Raphaël Ménard2, Guillaume Meunier2, Paolo Ciuccarelli1 1 2 Politecnico di Milano, Italy Elioth, France ABSTRACT: The topics of energy and environment are nowadays much discussed in the research context, as issues like climate change and global pollution become more and more pressing; such knowledge is also relevant for common people though, as it concerns the whole natural environment. Communicating the research is not easy, as the topic itself include the description of complex systems and processes. In this paper a novel, interactive method for representing energy fluxes is described, based on the well known Sankey diagrams. First, the notion of energy and its underlying conceptual model will be introduced. Every stream needed by life and society can be described as debit, credit and stock. These metabolic patterns are the foundation of the systemic model “the limits to growth” formalized in 1972 by the Club of Rome. All of those streams are linked together in space and in time and create a balance that will be discussed in the paper. Sankey diagrams will then be introduced: invented by Riall Sankey to analyze the thermal efficiency of steam engines, they have since been applied to depict the energy and material balances of complex systems. This visual model is built upon a network graph made of nodes and weighted edges, and may be considered the easiest and most intuitive way to represent incoming and outgoing flows from arbitrary elements. The advancement in web technologies allows the development of interactive and modular visualizations that facilitate the comprehension of the scope and the complexity of the phenomenon, as well as their diffusion through a web application accessible by any modern browser. ”The Reforme energy simulator” is a web platform proposing a solution to the issues raised by this research, enabling the visual analysis and interaction with the energy fluxes taking place in a set of spaces. Users may explore a preset scenario focusing on the French and Parisian area ranging on 300 years, or submit their own data regarding an arbitrary region and get their respective visualization automatically generated. Keywords: Energy, streams, diagram, Sankey, Data, visualization, web, simulator. 1. INTRODUCTION More than two centuries ago, almost all of the energy consumed by humanity was provided by direct or derived forms of solar energy. In the first half of the 21st century, almost all of the world's energy consumption comes from our stock: coal, gas, oil, nuclear fissile. Renewables are a very small minority in the Paper #169
totality of the world used energy. The average conversion efficiency of solar energy irradiation remains exceedingly low: about 80W to 2100W consumed on average per person in the early 21st century. Yet on average about 170W / m² of energy lies on the earth's surface. Most of our energetic needs are satisfied by our stocks. However, the problems caused by this approach (depletion of the non-renewable
energy sources, high CO2 and other pollutants levels), push us towards a resolarization of our consumption model. All the flows necessary for life and society can be described by a model composed of debit, credit and stock (see equation 1): water, energy, materials, population, economy, pollution etc. On the basis of this metabolic scheme, and in the context of a request of the Club of Rome, a team led by Donella and Dennis Meadows produced a world famous report in 1972, The Limits to Growth [7]. đ?‘‚đ?‘“đ?‘“đ?‘’đ?‘&#x; − đ??ˇđ?‘’đ?‘šđ?‘Žđ?‘›đ?‘‘ = ∆đ?‘†đ?‘Ąđ?‘œđ?‘?k
area taken into account, and let them insert information about their own territories in order to visualize them. The second section, FORmalization, aims at providing a mathematical formal model of demand, offer and stock to precisely define the qualitative dimensions of energy. Finally the third section, MEtamorphosis, focuses on the future transformations that could be enacted to cope with the need of balancing energy demand and offer, ranging from a global scale (by presenting possible future scenarios) down to a local one (by proposing urban solar infrastructures that can relocalize the energy basins).
(1)
According to this relation, the inevitable end of energy stocks will impose an unavoidable equality between debit and credit. Therefore, a certain energy supply will forcibly be generated by: -
2. THE DESIGN PROCESS As discussed above, one of the aim of the project is to develop a digital, interactive visualization of the energetic model described. The design of such tool was carried on by the DensityDesign lab (which is part of the Reforme team). Based on past experiences in developing interactive visualization applications for a general public [1, 6], the platform structure as well as the views and the interfaces were discussed with the domain experts in the team, in order to understand the main goals that should have been achieved and the best approaches to reach them. The main issue in the design of the visualization was to communicate the complexity of the proposed model while preserving its completeness, and to stress the importance of the consequences deriving from its perpetuation. In order to introduce non-expert users to the topic and let them fully comprehend the problem starting from the data, a communicative approach [5] was chosen, hence graphically stressing the most important insights and avoiding a purely analytical visualization of the information. Also, by providing multiple levels of interactions (more specifically exploration and reconfiguration, see [10]), we encourage the user to engage with the application and discover him-
Solar energy and derived forms; Geothermal energy; Tidal energy.
On average and on a global scale, the deposit provided by the last two is negligible compared to terrestrial solar radiation. 1.1 The Reforme project Reforme is an interdisciplinary research project participating to the Ignis Mutat Res programme organized by the French ministry of culture and communications. Its aim is to address the issue described in the previous section, analyze it and propose tools and novel approaches to expose its critical points and foster new urbanization patterns. The project is structured in three main sections: REpresentation, aimed at representing in a simple and didactical way the flows of demand, offer and stock in space and time. The analysis is focused on the French territory, scaling down to a single zone of Paris. The final output of this section, which is also the main topic of this paper, is the realization of an interactive web platform which will help the users understand the energetic landscape of the 2
self new meanings and interesting patterns deriving from the representation of data.
The diagram itself takes its name from the irish engineer Riall Sankey, who used it to depict the energy flows of steam engines (see Figure 1). In more recent years, it was widely used to represent dynamic processes like transport flows [3] or trade exchanges [4]. A web tool to design interactive Sankey diagrams can be found in [8]: the application takes as input an XML file describing the data and renders the graph thourgh a Java applet, enabling users to zoom, pan, select a particular flow to get additional details and animate the whole system. We tried pushing further the technical implementation, using native web technologies. The visualization is drawn in SVG format, allowing its accessibility from computers as well as tablets and smartphones, while also mantaining an acceptable level of interaction.
2.1 The Sankey diagram Talking specifically about the most suitable way to visualize the energetic model, different visual tools were taken into account. Many diagrams have been developed to describe architectures based on flows; in particular, the Sankey diagram is one of the most widely used due to its completeness and ease of reading. It shows not only the transfers involved but also the quantitative distribution of values in the transfers, instantly returning an intuitive overview of the system.
2.2 Raw data As discussed before, the data used to build the visualization is mainly focused on the french and parisien area, and ranging from 1750 to 2050 in five steps (1750, 1850, 1950, 2000, 2050). In particular, for each time step, we take into account 5 spaces: -
Earth Europe France Paris Business district
Each space is contained into the previous one. For each step at each time, we have many information regarding its energetic equilibrium, i.e.:
Figure 1 - Sankey's original 1898 diagram showing energy efficiency of a steam engine A first prototype of this model can be seen in the “Napoleon’s Russian campaign of 1812� map by Charles Joseph Minard, drawn in 1861. Such illustration shows the losses of the french troops during their march through the russian territory, and has been acknowledged by Edward Tufte as one of the best statistical graphics ever drawn [9].
3
Population (absolute) Surface (in Km2) Stock (in TEP) Demand (in TEP) Offer (in TEP) Energy exchanges with the other spaces (in TEP)
THE PLATFORM The platform is composed by two main modules: -
outgoing energy flows. On the inside, each circle as two arcs (see figure 3). The dark grey inner arc describes two values of the space stock: its amount Sp with respect to the world total for the current year (mapped to the angle of the arc), and its variation over time St (mapped to the height of the arc). Similar mappings are used for population in the outer green circles: Pp is the population percentage compared to the world total, while Ps Represent its variation over time. The flow O coming from the sun represents the offer, i.e. the solar energy actually exploited by the target space. Note that this is a minimal part of the overall solar radiation.
The simulator, a visualization of the model developed in the project focusing on the french area; A user data driven section, where information on a custom space may be inserted in order to be visualized.
Both modules rely on the same visualization model, built upon the data collected for the Reforme project. In this main view the screen is divided into three main horizontal sections, described below. 2.3 Flows and exchanges The first section is the Sankey diagram of the flows of energy exchanged between the spaces taken into account; the aim of this visualization is to let the user understand the generic architecture of the model, and to convey the role and importance of the renewable energies in the global energetic equilibrium. The view is automatically generated for each year taken into account from the research project. Changes over time can be seen by selecting a specific year from the button set in the top left panel of the page.
Figure 3: Detail of a territory in the Sankey diagram The flow D going out from each space is the demand, i.e. the amount of energy needed by the territory. The sum of all the demand flows is the global consumption of energy. Finally, the red arcs ei represent the energy net exchanges between spaces. Note that all the energy data presented above (demand, offer, stock and exchanges) can be shown both as absolute values (measured in Joules) or as relative values by dividing them by the space population or surface amount. By pointing the mouse or tapping on a specific arc or flow of the visualization, the user can see its value on a popup. Clicking or tapping on a space will instead cause it to merge
Figure 2: Sankey diagram of the simulator The fundamental building block of the view are the spaces, represented by horizontally aligned circles. Each space is a node of the Sankey diagram, hence having incoming and 4
with its leftmost sibling (e.g. clicking on the Parc Des Ports space will cause it to merge with the Paris space). If a space is already grouped, clicking on it will cause it to expand and reveal the previously merged spaces. The buttons merge all and expand all allow the user to see the union of speaces as a single territory (so that he can see the diagram relative to the entire world), and to reset the view to its default, i.e. with every single space shown.
sible as described before. 2.5 Trends The aim of this section is to guide the user in finding connections between the trends of the values shown in the previous sections over time. The correlation between population, solar yield and stock variation is clearly visible, as the lines of each variable are drawn on the same graph (see figure 5). Note that the graph is purely qualitative and the scales of the variable values are not respected. The view acts only as a comparison between the trends, to understand how the variation of a variable affects the others.
2.4 Ins and outs The second section is focused on the single spaces, showing the details of their incoming and outgoing energy amounts. Each space is represented by a skyline image (see figure 4); once again the D and O vectors are shown, indicating the demand and offer of the territory (or their density). Exchanged are also shown, but in this section they are grouped in two main arrows: Ein (incoming exchanges) and Eout (outgoing exchanges).
Figure 5: Line graph of Population, demand and solar yield over time
3. USER DATA DRIVEN VISUALIZATION As discussed before, a second module of the platform lets the user build his own visualization by inserting data of a custom space. This feature is important not only to get a more complete understanding of the model, but to see how it fits for an environment that the user already knows. By looking at the visual output resulting from personal data, one can see new perspectives and find hidden issues of his territory (how much stock energy is needed to fullfill the demand of my city? How much my country depends on foreign forniture? And so
Figure 4: inputs and outputs of a space Under the space the user can find visual information about the territory stock. The light grey area Stot represents the maximum value of stock over time, while Sa is its actual value. Finally, Su is the stock amount used to fullfill the demand, i.e. Su = O-D. Interaction is similar to the previous section: by hovering or tapping on an arrow or area, the user may read its value as a number in a popup; clicking on a territory causes it to merge with its leftmost sibling, and ungrouping i salso pos5
on). The data input procedure is provided by a set of interactive graphs (see figure 6). Each graph is bound to a variable of the model (offer, demand, stock, etc), and its evolution over time is determined by 5 main steps, corresponding to the years taken into account by the research (1750, 1850, 1950, 2000, 2050). By moving the handle of a given variable in a given time, the user automatically changes its value in the model. Such change is reflected in real time in the visualization, which is a custom instance of the one presented in the previous section. Hence the final outcome gets built step by step, and may be modified at any time.
The back-end framework, Django, is a powerful yet easy to use application server wirtten in Python. It was chosen for its seamless integration with the MySQL database and the possibility to quickly code user authentication and database administration pages. 5. CONCLUSIONS In this paper, an interactive visualization for representing energy flows was presented. The application addresses a general public and aims at highlighting the importance of renewable energy sources in the current and future scenarios. The data underlying the visualization is focused on the french and parisien zone, ranging from 1750 to 2050 in order to follow the evolution of the human footprint on environment. In order to visually express the complexity of the energetic model, Sankey diagrams among other visual tools were used. Moreover, several levels of interaction have been included in order to foster the exploration of the application and the discovery of relevant patterns and findings. In addition to the scenario taken into account as example, the user has the possibility to add information about an arbitrary territory and get the resulting visualization as output.
Figure 6: user data input view Compared to filling a form, which is the standard way to insert data on the web, this graph-driven interface provides a more engaging and direct input method. This approach may be preferable when dealing with non expert users, as the speed and ease of use are relevant as much as precision and reliability.
REFERENCES [1] Azzi, M., Caviglia, G., Ricci, D., Ciuccarelli, P., Bontempi, L., & Bonetti, E. Dust: A Visualization Tool Supporting Parents’ School-Choice Evaluation Process. Parsons Journal for Information Mapping, 3(4). 2010. [2] Bostock, M., Ogievetsky, V., & Heer, J. D³ data-driven documents. Visualization and Computer Graphics, IEEE Transactions on, 17(12), 2301-2309. 2011 [3] Cox D., Patterson R. Visualization Study of the NSFNET. http://archive.ncsa.uiuc.edu/SCMS/DigLib/t ext/technology/Visualizaion-Study-NSFNE T-Cox.html
4. TECHNICAL DETAILS The Reforme simulator was developed as a web platform focused heavily on the front-end side. The need for complex visualizations and interactions was fullfilled by a heavy use of javascript: in particular the d3.js library [2] was adopted for the main views, while the angular.js library was chosen to handle the data underlying the views. In order to make the application usable from tablets and responsive to various screen sizes we used the Bootstrap CSS framework. 6
[4] Krempel L., Plümper T. International Division of Labor and Global Economic Processes: An Analysis of the International Trade in Automobiles, Journal of World-Systems Research, Vol. V, 3, 487-498, 1999 [5] Masud, L., Valsecchi, F., Ciuccarelli, P., Ricci, D., & Caviglia, G. From data to knowledge-visualizations as transformation processes within the data-information-knowledge continuum. In Information Visualisation (IV), 2010 14th International Conference (pp. 445-449). IEEE. 2010. [6] Mauri, M., Pini, A., Ciminieri, D., & Ciuccarelli, P. Weaving data, slicing views: a design approach to creating visual access for digital archival collections. In Proceedings of the Biannual Conference of the Italian Chapter of SIGCHI (p. 21). ACM. 2013. [7] Meadows D.H., Goldsmith E., Meadow P. The limits to growth. Universe books, New York, 1972. [8] Riehmann, P., Hanfler, M., & Froehlich, B. Interactive sankey diagrams. In Information Visualization, 2005. INFOVIS 2005. IEEE Symposium on (pp. 233-240). IEEE. 2005 [9] Tufte, E. R., & Graves-Morris, P. R. The visual display of quantitative information (Vol. 2). Cheshire, CT: Graphics press. 1983 [10] Yi, J. S., ah Kang, Y., Stasko, J. T., & Jacko, J. A. Toward a deeper understanding of the role of interaction in information visualization. Visualization and Computer Graphics, IEEE Transactions on, 13(6), 1224-1231. 2007.
3. Guillaume Meunier, project manager, Elioth. 4. Paolo Ciuccarelli, scientific coordinator at DensityDesign lab and associate professor, Design faculty, Politecnico di Milano.
ABOUT THE AUTHORS 1. Daniele Ciminieri, research assistant, DensityDesign lab, Design faculty, Politecnico di Milano. 2.
Raphaël Ménard, director, Elioth. 7