Difference between revisions of "GUI (user interface)"
(48 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
− | [[User Guide | [Home]]] - [[Access to the platform | [Access to the platform]]] - [[Observations | [Observations]]] - [[Forecast Models | [Forecast Models]]] - [[Static Layers | [Static Layers]]] - | + | [[User Guide | [Home]]] - [[Access to the platform | [Access to the platform]]] - [[Observations | [Observations]]] - [[Forecast Models | [Forecast Models]]] - [[Static Layers | [Static Layers]]] - [[Events | [Events]]] - [[Tools | [Tools]]] |
<span style="font-size:110%">This section is devoted to give users a deeper insight about: | <span style="font-size:110%">This section is devoted to give users a deeper insight about: | ||
− | *[[GUI (user interface)#Control Map|Control Map]] | + | *[[GUI (user interface)#Switch Language|Switch Language]] |
+ | *[[GUI (user interface)#Control Map|Control Map]] | ||
*[[GUI (user interface)#Toolbar|Toolbar]] | *[[GUI (user interface)#Toolbar|Toolbar]] | ||
*[[GUI (user interface)#Display|Display]] | *[[GUI (user interface)#Display|Display]] | ||
Line 10: | Line 11: | ||
− | [[File: | + | |
+ | [[File:IU_01d_eng.JPG|1000px|thumb|centre|GUI (user interface).]] | ||
+ | |||
+ | |||
+ | == Switch Language == | ||
+ | At present, '''DewetraWorld''' is offered in 4 languages: | ||
+ | * English | ||
+ | * French | ||
+ | * Spanish | ||
+ | * Italian (default) | ||
+ | |||
+ | To change the default settings, click on your account at the top right corner. <br> | ||
+ | A menu will pop up (see figure below) | ||
+ | |||
+ | [[File:IU_02z.JPG|800px|thumb|centre]] | ||
+ | |||
+ | Left-click on the flag corresponding to the language you want to set: the system will update all the labels and menu accordingly. <br> | ||
+ | |||
Line 18: | Line 36: | ||
* Google Map: consists of the world political map, toponyms are shown with respect to the zoom level; | * Google Map: consists of the world political map, toponyms are shown with respect to the zoom level; | ||
* Google Satellite: consists of the world's physical map obtained from the composition of high-resolution satellite images; | * Google Satellite: consists of the world's physical map obtained from the composition of high-resolution satellite images; | ||
+ | * Google Terrain: world physical map in which are graphically displayed mountain ranges, lakes, rivers, depressions, et c. | ||
* Google Hybrid (default): represents the combination of the two aforementioned maps. | * Google Hybrid (default): represents the combination of the two aforementioned maps. | ||
In addition to these main options, the user can upload every background map released by open source consortia (eg., [https://www.openstreetmap.org OpenStreetMap]) such as Standard, Cycle Map, Transport Map, MapQuestOpen, Humanitarian, et c. | In addition to these main options, the user can upload every background map released by open source consortia (eg., [https://www.openstreetmap.org OpenStreetMap]) such as Standard, Cycle Map, Transport Map, MapQuestOpen, Humanitarian, et c. | ||
Line 39: | Line 58: | ||
* [[Forecast Models]]: lists all the available forecast systems (numerical weather prediction models, hydrological models, landslide susceptibility models; | * [[Forecast Models]]: lists all the available forecast systems (numerical weather prediction models, hydrological models, landslide susceptibility models; | ||
* [[Static Layers]]: provides all the information needed to design a comprehensive risk scenario such as the exposures or the hazard maps | * [[Static Layers]]: provides all the information needed to design a comprehensive risk scenario such as the exposures or the hazard maps | ||
− | * Tools: enables some ancillary functions such as | + | * [[Events]]: is the category that groups all the layers concerning disasters happened in the past such as floods, earthquakes, fires, et c. |
− | * Search: is the | + | * [[Tools]]: enables some ancillary functions such as Add a WMS, Risk Scenarios, et c. |
− | + | * Search: is the tool allowing the users to search for any element visualized by the platform such as weather stations, toponyms, et c. | |
− | [[File:IU_03_eng.JPG| | + | [[File:IU_03_eng.JPG|1200px|thumb|centre|Toolbar.]] |
== Display == | == Display == | ||
− | The time range of the data the system is visualizing are shown in the '''Display'''. Within this area | + | The time range of the data the system is visualizing are shown in the '''Display'''. Within this area users may find: |
* the initial date of the time range selected by the users | * the initial date of the time range selected by the users | ||
Line 54: | Line 73: | ||
* the current date | * the current date | ||
− | By default, the application will | + | By default, the application will set the limits of the time range between "now" (i.e., current date and UTC time) and 24 hours before (which is assumed as the beginning of the period of the analysis). |
− | [[File:IU_04.JPG| | + | [[File:IU_04.JPG|600px|thumb|centre|Display.]] |
Line 64: | Line 83: | ||
* the two <u>calendar</u> icons allow the users to modify, respectively, the starting date and the end of the time range. By clicking on the buttons, you can set both start and end dates (minutes, hours, day, month and year) of any time window into the past and view the data available at that time (the so-called ''deferred time'' mode). | * the two <u>calendar</u> icons allow the users to modify, respectively, the starting date and the end of the time range. By clicking on the buttons, you can set both start and end dates (minutes, hours, day, month and year) of any time window into the past and view the data available at that time (the so-called ''deferred time'' mode). | ||
* the <u>clock-shaped</u> icon sets back the dates of beginning and end of the time range to the default mode | * the <u>clock-shaped</u> icon sets back the dates of beginning and end of the time range to the default mode | ||
− | |||
− | |||
− | |||
== Layer List == | == Layer List == | ||
Line 72: | Line 88: | ||
− | [[File: | + | [[File:IU_06b.JPG|400px|thumb|centre|An example of a dynamic layer list.]] |
Each element of the list can be turned on or off and therefore displayed or hidden on the map, by acting on the control menu next to the name. | Each element of the list can be turned on or off and therefore displayed or hidden on the map, by acting on the control menu next to the name. | ||
− | Its relative position on the list corresponds to the position of the layer on the map: usually, the latter layer | + | Its relative position on the list corresponds to the position of the layer on the map: usually, the latter layer that has been loaded overlaps the former ones. |
− | Anyway, users may change the priority of a layer, by left-clicking the layer icon next | + | Anyway, users may change the priority of a layer, by left-clicking on the layer icon next to the name in the '''Layer List''' and dragging it up or down. |
− | The available features for the dynamic layers ([[Observations]] and [[Forecast]]) | + | The available features for the dynamic layers ([[Observations]] and [[Forecast]]), for the [[Static Layers]] and for the [[Events]] are described in the dedicated sections. |
== Additional Tools == | == Additional Tools == | ||
− | The '''Additional Tools''' button is placed in the upper right of the dashboard, immediately below the [[Toolbar]] and includes in order, from left to the right, the tools '''Share''', '''info''', '''Print map''' and ''' | + | The '''Additional Tools''' button is placed in the upper right of the dashboard, immediately below the [[Toolbar]] and includes in order, from left to the right, the tools '''Share''', '''info''', '''Print map''', '''Measure''' and '''Report'''. |
[[File:IU_07.JPG|800px|thumb|centre|Additional Tools.]] | [[File:IU_07.JPG|800px|thumb|centre|Additional Tools.]] | ||
− | |||
− | |||
− | === | + | ===Info=== |
− | Info is activated by left-clicking '''i''' icon and allows the user to pull on the information associated to each layer that has been previously loaded. <br> | + | '''Info''' is activated by left-clicking '''i''' icon and allows the user to pull on the information associated to each layer that has been previously loaded. <br> |
− | In the following example, the application of '''info'' to the rainfall layer: the pop-up window opens in the upper right part of the screen displaying the rain depth of the point that has been clicked on. | + | In the following example, the application of '''info''' to the rainfall layer: the pop-up window opens in the upper right part of the screen displaying the rain depth of the point that has been clicked on. |
− | [[File:IU_08.JPG| | + | [[File:IU_08.JPG|400px|thumb|centre|In the example, the pop-up window containing the rainfall depth value provided by the rainfall map layer.]] |
Line 101: | Line 115: | ||
− | [[File:IU_09.JPG| | + | [[File:IU_09.JPG|400px|thumb|centre|In the example, the pop-up window containing the attributes of the Hospitals layer.]] |
To disable the info and return to the navigation mode, left-click again on the '''i''' icon. | To disable the info and return to the navigation mode, left-click again on the '''i''' icon. | ||
Line 108: | Line 122: | ||
The '''Print map''' button allows the user to open a pop-up window containing a preview of the '''Control Map''' displayed at the time: by clicking the ''Download Image'' button located at the lowerright corner of the pop-up window, the map can be downloaded in .png format and saved on user's own local disk. | The '''Print map''' button allows the user to open a pop-up window containing a preview of the '''Control Map''' displayed at the time: by clicking the ''Download Image'' button located at the lowerright corner of the pop-up window, the map can be downloaded in .png format and saved on user's own local disk. | ||
− | [[File:IU_10.JPG| | + | [[File:IU_10.JPG|1200px|thumb|centre|In the example, the pop-up window containing the print preview for the SPEI-6months.]] |
− | In case the user | + | In case the user does not want to download the map, the pop-up window can be closed by clicking on the X-shaped button in the upper right of the pop-up window. |
− | === | + | ===Measure Distance and Areas=== |
The '''Measure''' button allows you to open a drop-down menu through which you can choose to '''Create a new measurement''' by left-clicking on the corresponding button. | The '''Measure''' button allows you to open a drop-down menu through which you can choose to '''Create a new measurement''' by left-clicking on the corresponding button. | ||
In this way the user can draw a straight line or pinpoint the vertices of a polygon by left-clicking directly on the map. At the same time, through a pop-up window, the system provides information about the line's length (in both kilometers and miles) and the area of the polygon (in both square metres and miles). | In this way the user can draw a straight line or pinpoint the vertices of a polygon by left-clicking directly on the map. At the same time, through a pop-up window, the system provides information about the line's length (in both kilometers and miles) and the area of the polygon (in both square metres and miles). | ||
Line 126: | Line 140: | ||
[[File:IU_12.JPG|800px|thumb|centre|In the example, the pop-up window containing the information displayed by the system once the action has been completed by the user.]] | [[File:IU_12.JPG|800px|thumb|centre|In the example, the pop-up window containing the information displayed by the system once the action has been completed by the user.]] | ||
+ | |||
+ | ===Report=== | ||
+ | The '''Report''' tool allows the user to automatically capture the active window containing one or more of the layers previously loaded and to draft a report with the captures. | ||
+ | |||
+ | The first step consists in launching the application through the icon displayed in the figure below | ||
+ | |||
+ | [[File:IU_11a.JPG|800px|thumb|centre|The icon by which users enable the Report function.]] | ||
+ | |||
+ | Once the layer has been loaded, the user may add it to the report by clicking on the ''Send to Report'' icon that appears below the '''Report''' launch button as the mouse is hovered on it, see the figure below. | ||
+ | |||
+ | |||
+ | [[File:IU_11b.JPG|800px|thumb|centre|The icon by which users add a figure to the report.]] | ||
+ | |||
+ | |||
+ | Users may add as many captures as they need, each capture will be automatically copy-pasted to a single page of the report together with its legend, provided it is sent to the report. <br> | ||
+ | Figures may consist of as many layers as user requires, with no limitations whatsoever. <br> | ||
+ | Once the user has added all the neeeded figures, the report might be finalized and downloaded. <br> | ||
+ | To do that, click again on the '''Report''' launch button to expand the manu and then click again on ''Download Report'' (see below). | ||
+ | |||
+ | |||
+ | [[File:IU_11c.JPG|800px|thumb|centre|The icon by which users finalize the report and download.]] | ||
+ | |||
+ | |||
+ | Once clicked, the system will display a menu through he/she will be enabled to: | ||
+ | * select which format the report will be saved as (''.docx'' or ''.pptx'') | ||
+ | * modify the author and/or the filename fields | ||
+ | * download the document | ||
+ | |||
+ | |||
+ | [[File:IU_11d.JPG|800px|thumb|centre|In this window users are allowed to select how to finalize and download the report.]] | ||
---- | ---- | ||
− | [[User Guide | [Home]]] - [[Access to the platform | [Access to the platform]]] - [[Observations | [Observations]]] - [[Forecast Models | [Forecast Models]]] - [[Static Layers | [Static Layers]]] | + | [[User Guide | [Home]]] - [[Access to the platform | [Access to the platform]]] - [[Observations | [Observations]]] - [[Forecast Models | [Forecast Models]]] - [[Static Layers | [Static Layers]]] - [[Events | [Events]]] - [[Tools | [Tools]]] |
Latest revision as of 08:42, 1 June 2021
[Home] - [Access to the platform] - [Observations] - [Forecast Models] - [Static Layers] - [Events] - [Tools]
This section is devoted to give users a deeper insight about:
Contents
Switch Language
At present, DewetraWorld is offered in 4 languages:
- English
- French
- Spanish
- Italian (default)
To change the default settings, click on your account at the top right corner.
A menu will pop up (see figure below)
Left-click on the flag corresponding to the language you want to set: the system will update all the labels and menu accordingly.
Control Map
The Control Map of the application is managed by the open source Java script library Leaflet. The control is instantiated as the system is started, using the Google Hybrid map provided by Google-Maps services as the background layer. The available background maps are:
- Google Map: consists of the world political map, toponyms are shown with respect to the zoom level;
- Google Satellite: consists of the world's physical map obtained from the composition of high-resolution satellite images;
- Google Terrain: world physical map in which are graphically displayed mountain ranges, lakes, rivers, depressions, et c.
- Google Hybrid (default): represents the combination of the two aforementioned maps.
In addition to these main options, the user can upload every background map released by open source consortia (eg., OpenStreetMap) such as Standard, Cycle Map, Transport Map, MapQuestOpen, Humanitarian, et c.
The user can select the background map by moving the cursor on the action button located in the lower right of the screen, shown in the following figure:
It is possibile to pan the map by clicking the left mouse button and dragging it to the desired direction. The zoom level may be controlled:
- using the mouse wheel (scroll forward: increases level of zoom / scroll back: decreases zoom level)
- by holding down the SHIFT key on the keyboard and drawing a rectangle with the mouse, holding the left mouse button clicked. In this way, the zoom will be related to the selected area
- by the combination of CTRL and + buttons (Zoom In) or CTRL and - (zoom out)
Toolbar
The Toolbar contains many action buttons, depending on user's profile, like the following:
- Observations: is the section dedicated ot observational data and diagnostic models
- Forecast Models: lists all the available forecast systems (numerical weather prediction models, hydrological models, landslide susceptibility models;
- Static Layers: provides all the information needed to design a comprehensive risk scenario such as the exposures or the hazard maps
- Events: is the category that groups all the layers concerning disasters happened in the past such as floods, earthquakes, fires, et c.
- Tools: enables some ancillary functions such as Add a WMS, Risk Scenarios, et c.
- Search: is the tool allowing the users to search for any element visualized by the platform such as weather stations, toponyms, et c.
Display
The time range of the data the system is visualizing are shown in the Display. Within this area users may find:
- the initial date of the time range selected by the users
- the end date of the time range selected by the users
- the current date
By default, the application will set the limits of the time range between "now" (i.e., current date and UTC time) and 24 hours before (which is assumed as the beginning of the period of the analysis).
In the display there are four action buttons:
- the two calendar icons allow the users to modify, respectively, the starting date and the end of the time range. By clicking on the buttons, you can set both start and end dates (minutes, hours, day, month and year) of any time window into the past and view the data available at that time (the so-called deferred time mode).
- the clock-shaped icon sets back the dates of beginning and end of the time range to the default mode
Layer List
Unlike the previous version of Dewetra, the Layer List is dynamically created whenever the user loads a static and / or dynamic layer. Everytime a layer is selected by the user, the Layer List -containing the layer name and the available options for it- is displayed in the top left corner.
Each element of the list can be turned on or off and therefore displayed or hidden on the map, by acting on the control menu next to the name.
Its relative position on the list corresponds to the position of the layer on the map: usually, the latter layer that has been loaded overlaps the former ones.
Anyway, users may change the priority of a layer, by left-clicking on the layer icon next to the name in the Layer List and dragging it up or down.
The available features for the dynamic layers (Observations and Forecast), for the Static Layers and for the Events are described in the dedicated sections.
Additional Tools
The Additional Tools button is placed in the upper right of the dashboard, immediately below the Toolbar and includes in order, from left to the right, the tools Share, info, Print map, Measure and Report.
Info
Info is activated by left-clicking i icon and allows the user to pull on the information associated to each layer that has been previously loaded.
In the following example, the application of info to the rainfall layer: the pop-up window opens in the upper right part of the screen displaying the rain depth of the point that has been clicked on.
If info is applied to a static layer, the pop-up window will show all the attributes available in the database for that layer. As an example, the next figure shows the result displayed in case a user clicked the Hospitals layer.
To disable the info and return to the navigation mode, left-click again on the i icon.
Print map
The Print map button allows the user to open a pop-up window containing a preview of the Control Map displayed at the time: by clicking the Download Image button located at the lowerright corner of the pop-up window, the map can be downloaded in .png format and saved on user's own local disk.
In case the user does not want to download the map, the pop-up window can be closed by clicking on the X-shaped button in the upper right of the pop-up window.
Measure Distance and Areas
The Measure button allows you to open a drop-down menu through which you can choose to Create a new measurement by left-clicking on the corresponding button. In this way the user can draw a straight line or pinpoint the vertices of a polygon by left-clicking directly on the map. At the same time, through a pop-up window, the system provides information about the line's length (in both kilometers and miles) and the area of the polygon (in both square metres and miles).
To complete the action, left-click on Finish Measurement inside the pop-up menu: in this way, the last point on the map set is automatically connected to the first.
When the measurement is completed, the system displays the length of the solid line and area of the polygon. Also, user may choose whether to delete it or to centre the Control Map on the line (polygon) that has been previously drawn.
Report
The Report tool allows the user to automatically capture the active window containing one or more of the layers previously loaded and to draft a report with the captures.
The first step consists in launching the application through the icon displayed in the figure below
Once the layer has been loaded, the user may add it to the report by clicking on the Send to Report icon that appears below the Report launch button as the mouse is hovered on it, see the figure below.
Users may add as many captures as they need, each capture will be automatically copy-pasted to a single page of the report together with its legend, provided it is sent to the report.
Figures may consist of as many layers as user requires, with no limitations whatsoever.
Once the user has added all the neeeded figures, the report might be finalized and downloaded.
To do that, click again on the Report launch button to expand the manu and then click again on Download Report (see below).
Once clicked, the system will display a menu through he/she will be enabled to:
- select which format the report will be saved as (.docx or .pptx)
- modify the author and/or the filename fields
- download the document
[Home] - [Access to the platform] - [Observations] - [Forecast Models] - [Static Layers] - [Events] - [Tools]