Canvases, Layers and Data Sources ################################# A **Show** is the root of the hierarchy tree of a 3D scene, consisting of Canvases, Layers, and Data Sources, as shown in the following diagram : .. figure:: ../images/4/4-1.png :width: 30% :align: center Tree composition of a Show | The Show may contain one or more Canvases, each Canvas can include multiple Layers, and each Layer can incorporate one or more Data Sources. | A Layer represents the actual geometry used to render the data provided by its own Data Sources. | A Data Source is composed of all the information needed to request the actual data to be rendered by the Layer it is attached to. | All data retrieved from any Data Source must adhere to the EPSG:4326 projection (WGS84). Canvases ======== | Currently, three types of Canvas are defined: Ellipsoidal Canvas, Planar Canvas, and Overlay Canvas. | The primary purpose of a Canvas is to dictate the geometry and georeferencing of a Layer. | If a Layer is applied to an **Ellipsoidal Canvas**, the geometry will conform to an ellipsoidal shape, with all geo-references being relative to that ellipsoidal shape. | Similarly, for the **Planar Canvas**, the geometry will adhere to a flat plane shape. A special case is the **Overlay Canvas**, which operates similarly to a Planar Canvas but is always oriented perpendicular to the viewer's direction. All objects related to the Overlay Canvas are anchored to the viewer's point of view. The Overlay Canvas can only be created or selected when the user adds an overlay image or label Data Source to a 3D Objects Layer. It does not apply to other types of Layers and Data Sources. More details about the Overlay Canvas are described in chapter 4.2.4, regarding 3D objects layer. .. figure:: ../images/4/4-2.png :width: 80% :align: center Surface Layer with the static image of the Earth mapped on an Ellipsoidal Canvas (the Default Canvas) .. figure:: ../images/4/4-3.png :width: 80% :align: center Simple Surface Layer with the static image of the Earth mapped on a Planar Canvas Layers ====== **Layers** hold the data that are meant to be represented in the 3D view. Every layer is responsible for a specific data type. This chapter provides detailed information about each the layer type. Surface Layer ------------- | A **Surface Layer** is capable of rendering geo-referenced surface data mapped on either an Ellipsoidal Canvas or a Planar Canvas. | This section explains how to add and configure a Surface Layer. Add Surface Layer ~~~~~~~~~~~~~~~~~ To **add a Surface Layer** to the current Show, choose Layer > Add Layer > Surface option from the Menu Bar. .. figure:: ../images/4/4-4.png :width: 30% :align: center How to add a Surface Layer A modal window opens to configure the Surface Layer to create and set its Data Sources. .. figure:: ../images/4/4-5.png :width: 30% :align: center Modal window to add and configure a Surface Layer User can select the name of the Surface Layer to be added and specify which Canvas add it to, as explained in 3.1 Add Layer Sub-Menu. Additionally, user can manually specify the bounding box of an Area of Interest (AOI) through the Min/Max Lat/Lon edit text fields. | Two shortcut buttons are provided: - The **Global button** sets the AOI to the global extent of the Earth when pressed - The **Recompute button** sets the AOI to the union of the bounding boxes of all the Data Sources added to the Surface Layer when pressed | Please refer to the next section for instructions on adding or removing Data Sources to the Surface Layer being created. Add Data Sources to Surface Layer ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ User can add or remove Data Sources to the list of sources that are going to create the Surface Layer, as in the modal window. .. figure:: ../images/4/4-6.png :width: 50% :align: center Buttons to add Data Sources It is possible to add four different type of data source through the specific buttons (see Chapter 4.3 for more information regarding Data Sources): 1. From Backend 2. Images or videos from local storage or remote URL 3. From WMS 4. From JSON local file To remove an inserted Data Source, select it from the list and press the “-“ button at the bottom right of the list, as shown in the next figure. (when clicking on the globe icon, add “backend:// to the url field) .. figure:: ../images/4/4-7.png :width: 50% :align: center Select the Data Source from the list and press “-“ button remove it The Surface Layer can blend **up to 5 Data Sources**. User can confirm the creation of the Surface Layer by pressing the OK button or abort the operation by clicking on the Cancel button. Surface Layer Inspector Panel UI ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ When the user selects the Surface Layer by clicking on the respective item in the Hierarchy Panel or by selecting it from the 3D view, the Surface Layer UI card will be displayed in the Inspector Panel. .. figure:: ../images/4/4-8.png :width: 30% :align: center Selection of a Surface Layer in Hierarchy Panel The Surface Layer UI card is made of a list of collapsible sub-panels, one for each Data Source of the Layer, titled with its name. .. figure:: ../images/4/4-9.png :width: 80% :align: center Surface Layer UI card in Inspector Panel For each Data Source user can change: - The **blending factor**: lower value of the slider for Data Source transparency, higher values for Data Source opacity - The **crop latitude slider** - The **crop longitude slider** .. figure:: ../images/4/4-10.png :width: 80% :align: center Four blended Data Sources on a Surface Layer Geometry: Global Earth Image, gecho_bathy.5400x2700_float32, Daniel SWH and osmgray:ne_10m_admin_0_boundary_lines_land.png | It's possible to crop a Surface Layer's Data Source directly from the 3D view by enabling the **Show Bounding Boxes checkbox** and clicking on the desired Data Source to select it. | Once selected, four draggable handles will appear on the bounding box borders, allowing for cropping. .. figure:: ../images/4/4-11.png :width: 80% :align: center Handles to crop Data Sources of a Surface Layer Users can select a Data Source from the Backend to serve as a Digital Elevation Model (DEM), enabling vertex displacement from the surface based on the data value. The DEM dropdown menu displays all available Data Sources, although only those from the Backend can be utilized. If a Data Source is chosen as a DEM, additional widgets will be revealed in the Surface Layer UI card: - **DEM Displacement Factor**: to increase/decrease displacement of DEM from the surface - **DEM Bump Strength**: to increase/decrease bump mapping effect (simulates surface texture by altering lighting based on height information) - **DEM Lighting**: to enable or disable bump mapping effect .. figure:: ../images/4/4-12.png :width: 80% :align: center DEM Parameters .. figure:: ../images/4/4-13.png :width: 80% :align: center Digital Elevation Model for SWH Data Source, with low bump strength and low displacement .. figure:: ../images/4/4-14.png :width: 80% :align: center Digital Elevation Model for SWH Data Source, with higher bump strength and low displacement .. figure:: ../images/4/4-15.png :width: 80% :align: center Digital Elevation Model for SWH Data Source, with high bump strength and high displacement | It’s possible to toggle Data Source rendering from the Surface Layer through the checkbox next to the Data Source name in the collapsible sub-panel. The effect of a disabled Data Source is the equivalent of having it enabled with the blending factor set to 0. .. figure:: ../images/4/4-16.png :width: 80% :align: center Example of disabled Data Sources and null blending factor: The Global Earth Image Data Source blending factor is set to 0, making it appear as if it were disabled and not rendered. | Volume Layer ------------ **Volume layers** enable the visualization of variables collected at different pressure levels over a specific geographic area. The data is represented as a three-dimensional cube that can be sliced and filtered to have a better understanding of complex phenomena like storms and hurricanes. Add Volume Layer ~~~~~~~~~~~~~~~~ To add a volume layer, select “Volume” from the “Add Layer” menu. The relative pop up appears. To proceed, user must select a data source either from local storage or from the backend. Refer to section 4.3.2 for details on this operation. | An additional checkbox includes the possibility to enable multiresolution on the layer visualization. This feature is experimental, and the option is disabled by default. When enabled some artifacts could appear in the visualization when zooming close to the dataset. | The last option allows to override the default tile size used for the layer data requests. .. figure:: ../images/4/4-17.png :width: 50% :align: center The "volume layer add" dialog Add Data Sources to Volume Layer ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ | Data source selection is activated by pressing either the local source or remote source button in the volume layer add dialog. | When the local source selection button is pressed, a file selection dialog will appear, allowing the selection of a JSON file describing the local volume dataset. | When the remote source button is pressed, a data discovery dialog appears. Select from the “Datasets” list an item whose title includes the “3D” text and press on “OK”. .. figure:: ../images/4/4-18.png :width: 50% :align: center Volume datasets discovery Volume Layer Inspector Panel UI ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ When a volume layer is added to the visualization, it appears on the map and a new item will be added to the canvas hierarchy panel. As for the other layer types, by interacting with the timeline, user can navigate the dataset in time, and by clicking on the layer item in the hierarchy tree, the layer visualization settings will appear in the right part of the user interface. .. figure:: ../images/4/4-19.png :width: 80% :align: center Sample volume layer visualization The following settings are available : - **Render mode** allows to switch between different volume rendering modes. They are all based on the raymarch rendering technique, that computes an intensity value for each pixel, through the combination of the raw values collected by sampling rays originating from the camera position and crossing the volume. | o **Direct Volume Rendering** (the default option) applies a color map to the final intensity value computed on the previous step. | o **Maximum intensity projection** will draw only the maximum value encountered for each ray, with an opacity proportional to such value. | o **Isosurface Rendering** draw the data as isosurface. - **Data Min** and **Data Max** allow to define how the dataset raw values are mapped to the output colour scale. That is the “Data Min” is mapped to the colour scale first value, the “Data Max” is mapped to the colour scale last value and all intermediate values are linearly mapped to the other scale colours. All values beyond the limits are discarded. By default, they are initialized to the dataset minimum and maximum values. - **Visible Value Range** allows to dynamically filter out values (normalized based on the Min/Max values set in the “Data Min” and “Data Max” inputs) outside the define thresholds. - **Lighting** applies lighting to the volume pixel values. This allows to better highlight the volume iso-surfaces. - **Back-to-Front Direct volume Rendering** and **Early Ray Termination** parameters used internally by the ray sampler code. Exposed because changing them can reduce artifacts in some conditions. - **Cubic interpolation** Improves visualization quality at the expense of rendering performance. - **Max num steps** sets the number of samples used by the raymarching algorithm. Lower it to improve rendering performance. - **Longitude Range**, **Latitude Range** and **Altitude Range** allow to slice the volume cube by moving the planes orthogonal to the Longitude, Latitude and Altitude dimensions. - **The color map**, editable with the **Colormap Picker**. .. figure:: ../images/4/4-20.png :width: 25% :align: center Volume layer visualization settings | Volume can also be sliced directly on the map visualization. To enable check the box “Show bounding boxes” shown above the layer hierarchy panel and click on the volume layer on the map. The current layer extent will be highlighted and a set of handles appears. | Drag the handles to move the corresponding cutting plane position. .. figure:: ../images/4/4-21.png :width: 80% :align: center Volume layer slicing Wind Layer ---------- **Wind Layers** graphically reproduce wind-intensity (uv) datasets by rendering wind currents with an animated particle system. Particles follow direction vectors encoded in wind uv maps, simulating wind flow, and their trails reveal the corresponding streamlines. Different colours represent different levels of wind intensity. .. figure:: ../images/4/4-22.png :width: 60% :align: center Wind Layer Add Wind Layer ~~~~~~~~~~~~~~ Beside the name of the new layer and the parent Canvas, Wind Layer addition panel two data sources, respectively for the U and V components of the wind from the back-end. .. table:: :class: align-center +-----------------------------------------------+----------------------------------------------+ | .. figure:: ../images/4/4-23.png | .. figure:: ../images/4/4-24.png | | :width: 75% | :width: 75% | | :align: center | :align: center | | | | | Create new Wind Layer | Create new Wind Layer | +-----------------------------------------------+----------------------------------------------+ Note: It’s not required that the U and V components match the original data, meaning that U and V components can be from data of different winds. Choosing whether U and V match or not, it’s at user discretion. Add Data Sources to Wind Layer ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ The U and V data sources can be selected by clicking on their respective buttons, marked by the backend icon. This prompts the opening of the Wind Discovery UI Panel which allows user to select a dataset from the back-end to assign to that component. .. figure:: ../images/4/4-25.png :width: 50% :align: center Figure 4 25. Wind Layer Data Discovey | This works like the Discovery UI Panel for other types of layers. | When a list element is selected, the associated Metadata is visualized. | Wind Layers support both 2D and 3D (Volumetric) Datasets. Volumetric datasets include uv data at different pressure levels. Volumetric Datasets have “layerType” set to “Volumetric” in their Metadata (see snapshot above), which also includes the list of pressure levels. Wind Layer Inspector Panel UI ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ The Wind Layer Inspector Panel allows user to control these parameters : - The **Trail Length – Num Particles Dropdown** field controls the number of particles, and their trail length, in the particle system. - The **Animate Toggle** specifies whether particles should be animated or static. - **Speed Factor** controls the speed of particles during animation - **Life Span** determines how long individual particles in the particle system will be updated before being re-spawned in a new (random) position. The Range Slider specifies minimum and maximum lifespan values. With smaller values of lifespan, areas with low wind intensities will be more populated, whereas higher values of lifespan will highlight the principal streamlines in the system. - The **Colormap Picker** specifies which Colormap use when rendering particle trails. The colors are mapped to wind intensity values, with the color on the extreme left used for 0 value, and the color on the right representing [a conservative upper bound of] the highest value in the dataset. - When a Wind Layer is configured with a 3D Dataset as Data Source, the **Pressure Level Dropdown** is also shown in the Inspector Card, allowing user to select the current pressure level. - The **Elevation Slider** controls the elevation of the particles from ground height. When viewing a 3D Dataset, the Elevation slider is replaced by a Range Slider. Different pressure levels will be rendered at different elevations, with higher pressure values corresponding to smaller elevation values. The Range slider specifies the elevations of Highest and Lowest pressure levels. - **Colormap Max Value Slider** has the purpose of clamping the max value of the colormap to the desired value, (min value is 0), adapting the gradient of the colormap into the resulting interval. .. figure:: ../images/4/4-26.png :width: 30% :align: center Wind Layer Inspector Panel 3D Objects Layer ---------------- A **3D Objects Layer** may contain these type of Data Sources: - **Georeferenced 3D Model**; - **Label**: | o Georeferenced Label; | o Georeferenced Billboard Label; | o Label Overlay; - **Image**: | o Georeferenced Image; | o Georeferenced Billboard Image; | o Image Overlay. | A 3D Objects Layer can be created by selecting Layer > Add Layer > 3D Objects. .. figure:: ../images/4/4-27.png :width: 40% :align: center 3D Objects Layer menu item Add 3D Objects Layer ~~~~~~~~~~~~~~~~~~~~ If 3D Objects menu item is selected, a popup appear in order to let the user choose the canvas type and the specific 3D Object data source that will be added to the layer. .. figure:: ../images/4/4-28.png :width: 40% :align: center 3D Objects Layer popup If **New Ellipsoidal Canvas or New Planar Canvas** is selected, three 3D Object data source types can be created: - Model; - Label (billboard or not) - Image (billboard or not) .. figure:: ../images/4/4-29.png :width: 40% :align: center 3D Objects Layer popup and Ellipsoidal or Planar Canvas 3D Objects Types Selecting **Model** exposes the following parameters: - Name: the name of the 3D model - Load Model from Uri: the 3D model uri - Load Model from File: by clicking on the Folder icon, a popup appear for navigating inside the OS and selecting the 3D model file - Latitude, Longitude, Elevation: the 3D model coordinates - Rotation X, Rotation Y, Rotation Z: the 3D model orientation - Scale X, Scale Y, Scale Z : the scale values .. figure:: ../images/4/4-30.png :width: 40% :align: center 3D Objects Model data source popup Selecting **Label** shows the following parameters: - Label Name: the name of the 3D model - Label Text: the 3D label text - IsBillboard: if the checkbox is checked, the label will behave as a billboard (the label keeps itself oriented towards the camera), otherwise the label orientation will be static - Font Size: the 3D label font size - Wrapping: if the checkbox is checked, the label text will be splitted in one or more lines, otherwise it will be allocated on single line - Latitude, Longitude, Elevation: the 3D model coordinates - Rotation X, Rotation Y, Rotation Z: the 3D model orientation - Scale X, Scale Y, Scale Z : the scale values .. figure:: ../images/4/4-31.png :width: 40% :align: center 3D Objects Label data source popup Selecting **Image** allows to set the following parameters: - Name: the name of the image - IsBillboard: if the checkbox is checked, the image will become a billboard (the image keeps itself oriented towards the camera), otherwise the image orientation will be static - Uri: by clicking on the Folder icon, a popup appear for navigating inside the OS and select the image file - Latitude, Longitude, Elevation: the 3D model coordinates - Rotation X, Rotation Y, Rotation Z: the 3D model orientation - Scale X, Scale Y, Scale Z : the scale values .. figure:: ../images/4/4-32.png :width: 40% :align: center 3D Objects Image data source popup If in the 3D Objects Layer popup New Overlay Canvas type is selected, two type of 3D Object can be created: - Label Overlay - Image Overlay .. figure:: ../images/4/4-33.png :width: 40% :align: center 3D Objects Layer popup and Overlay Canvas selection .. figure:: ../images/4/4-34.png :width: 40% :align: center 3D Objects Layer popup and Overlay Canvas 3D Objects Types With **Label Overlay** selected, the following parameters are available : - Label Name: the name of the label overlay data source - Label Text: the label text - Font Size: the label font size - PosX, PosY: the label overlay 2D screen position - PosZ: the label position on the Z axis; the label is inside the 3D scene, so PosZ can be used in order to change the label depth value - Rect Width, Rect Height: the size of the 2D rectangle containing the label .. figure:: ../images/4/4-35.png :width: 40% :align: center 3D Objects Label Overlay data source popup If **Image Overlay** is selected, user is able to set the image following parameters: - Image Name: the name of the image - Load Image from Uri: by clicking on the Folder icon, a popup appear for navigating inside the OS and select the image file - Scale: the scale value - PosX, PosY: the image overlay 2D screen position - PosZ: the image position on the Z axis; the image is inside the 3D scene, so PosZ can be used in order to change the label depth value - Rect Width, Rect Height: the size of the 2D rectangle containing the image .. figure:: ../images/4/4-36.png :width: 40% :align: center 3D Objects Image Overlay data source popup Add Data Sources to 3D Objects Layer ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ | One or more 3D object data sources may be added to a 3D Objects Layer after its creation. | By selecting a created 3D Objects Layer inside left Hierarchy Panel, inside right Inspector Panel the relative UI card is opened: by clicking on ADD DATA SOURCE button, a popup appears for choosing the new data source to add. .. figure:: ../images/4/4-37.png :width: 80% :align: center 3D Objects Layer Inspector card for add Data Source In the popup user can to select the 3D object type, depending on the layer canvas type: - If Layer belongs to an Ellipsoidal Canvas or a Planar Canvas, the options are: | o Model | o Label | o Image - If Layer belongs to an Overlay Canvas, the options are: | o Label Overlay | o Image Overlay .. figure:: ../images/4/4-38.png :width: 40% :align: center Popup for adding Data Source to a 3D Objects Layer On Ellipsoidal or Planar Canvas .. figure:: ../images/4/4-39.png :width: 40% :align: center Popup for adding Data Source to a 3D Objects Layer On Overlay Canvas 3D Objects Layer Inspector Panel UI ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ | 3D Objects in the application can be Models, Labels or Images. Depending on the 3D object type, data card inside the Inspector Panel can be slightly different. | Model object type exposes the following parameters in the Inspector Panel, and all can be updated at runtime: - Time Of Interest - Name - Latitude, Longitude, Elevation - RotationX, RotationY, RotationZ - ScaleX, ScaleY, ScaleZ .. figure:: ../images/4/4-40.png :width: 80% :align: center Example of 3D models : Red Pin placed on Athens coordinates with Athens .. figure:: ../images/4/4-41.png :width: 30% :align: center 3D Model Inspector Panel Label object type displays these properties in the Inspector Panel : - Time Of Interest - Label Name - Label Text - Font - Font Color - Font Size - Wrapping - IsBillboard - Latitude, Longitude, Elevation - RotationX, RotationY, RotationZ - ScaleX, ScaleY, ScaleZ .. figure:: ../images/4/4-42.png :width: 30% :align: center Label Inspector Panel Image type data sources holds these parameters in the Inspector Panel, which can be updated at runtime: - IsBillboard checkbox - Latitude, Longitude, Elevation - RotationX, RotationY, RotationZ - ScaleX, ScaleY, ScaleZ .. figure:: ../images/4/4-43.png :width: 80% :align: center Image Inspector Panel By selecting a data source of type Label Overlay (ShowTitle in the Figure below), the Inspector Panel parameters that can be updated at runtime are: - Label Text: the label text - Font Size: the label font size - PosX, PosY: the label overlay 2D screen position - PosZ: the label position on the Z axis; the label is inside the 3D scene, so PosZ can be used in order to change the label depth value - Rect Width, Rect Height: the size of the 2D rectangle containing the label .. figure:: ../images/4/4-44.png :width: 80% :align: center Label Overlay Inspector Panel If Image Overlay is selected, the user is able to set the image following parameters: - Scale: the scale value - PosX, PosY: the image overlay 2D screen position - PosZ: the image position on the Z axis; the image is inside the 3D scene, so PosZ can be used in order to change the label depth value - Rect Width, Rect Height: the size of the 2D rectangle containing the image .. figure:: ../images/4/4-45.png :width: 80% :align: center Image Overlay Inspector Panel In every 3D Object data sources right Inspector Panel card there is a DELETE button: by pressing on it, the data source will be removed from the 3D scene and all its UI card and widget will be removed too. Power Network Layer ------------------- **Power network layers** are designed to provide 3D visualization of graph data related to power networks, encompassing node production/demand and power flowing between nodes. Add Power Network Layer ~~~~~~~~~~~~~~~~~~~~~~~ To add a power network layer, select “Power network” from the “Add Layer” menu. A popup like the one shown in Figure 4-45 is opened. To proceed the user must select a data source from the local file system. Once the data source it’s selected, the addition can be confirmed with the “Ok” button. .. figure:: ../images/4/4-46.png :width: 40% :align: center Power network layer add dialog Power Network Layer Inspector Panel UI ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ A power network layer displays a set of vertical bars for each of the nodes of the network, representing the value of the selected node variables (e.g. wind power generation, power demand etc) for the currently selected timestamp. The links between the nodes are animated and coloured basing on the power flowing between the nodes. .. figure:: ../images/4/4-47.png :width: 80% :align: center Sample power network layer visualization Clicking on a node opens a panel in 3D space at its side, showing the values of the variables for the selected node at the currently selected timestamp. .. figure:: ../images/4/4-48.png :width: 80% :align: center Power network node info panel | Clicking a second time on the same node will show the trend of the selected variable for the latest time steps in the form of an animated chart, still rendered on a 3D panel. (see Figure 60). | Multiple node info/series can be enabled at the same time to compare the trends on different locations. .. figure:: ../images/4/4-49.png :width: 80% :align: center Power network node time series As per other layers, when the network item is selected in the hierarchy tree, the visualization settings panel will appear in the right side of the user interface. The following settings are available to tweak the layer appearance: | • **Vertical scale**: Increase/decrease the height scale factor applied to the node bars. | • **Bar radius**: Increase/decrease the radius of the node bars | • **Link width**: Increase/decrease the line width used to display node links | • **Global scale**: A global scale factor that applies to all of the above scale settings | • **Show nodes**, “Show links”: Enable/Disable the visualization of the network nodes/links | • **Show power generation**, **Show power demand**, **Show power capacity**, **Show power diff**: Select the variables to display in the node bars representation. | • **Chart type**: Select the type of chart used for node series visualization. Available options are “Bar chart” and “Line chart” | • **Chart variable**: Select the variable to display in the series chart. Available options are “Production”, “Capacity”, “Demand” and “Difference” .. figure:: ../images/4/4-50.png :width: 20% :align: center Power network layer settings Unit Vector Field Layer ----------------------- Unit **Vector Field Layers** are used to visualize MWD (Mean Wave Direction) Datasets. Wave directions are rendered as a grid of oriented arrows, over sea regions (see snapshot): .. figure:: ../images/4/4-51.png :width: 60% :align: center Unit Vector Field Layer Add Unit Vector Field Layer ~~~~~~~~~~~~~~~~~~~~~~~~~~~ | The “New UnitVectorField Layer” Panel is shown when adding a Unit Vector Field Layer to the Show (see snapshot below). | The name of the new layer and a parent Canvas must be specified, and a single DataSource must be selected, from the back-end. | In addition, the “Num Arrows Target” field can be used to specify [roughly] how many arrows will be rendered (this value assumes Area Of Interest is totally over sea), the default is 1000. .. figure:: ../images/4/4-52.png :width: 50% :align: center Add Unit Vector Field Layer panel Add Data Sources to Unit Vector Field Layer ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ | By clicking on the backend icon in the “New UnitVectorField Layer” Panel, the Discovery UI Panel is shown (see snapshot below), allowing user to select a Data Set from the back-end. | **NOTE: when selecting a back-end data source for a Unit Vector Field Layer, the list of selectable Datasets includes datasets which are not suitable for this layer type. Ensure that you select an “MWD” Dataset.** .. figure:: ../images/4/4-53.png :width: 50% :align: center Unit Vector Field Data Source discovery Unit Vector Field Layer Inspector Panel UI ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ In the current release, Unit Vector Field Layers have no editable parameters, and don’t have a custom Inspector Card. When selecting the Data Source of a Unit Vector Field Layer, a generic Backend Data Source Inspector Card is shown (except for the “Colormap” Dropdown, which is hidden). See snapshot below: .. figure:: ../images/4/4-54.png :width: 30% :align: center Unit Vector Field Inspector Panel UI **NOTE: Although this Inspector card allows user to edit several properties, NO CHANGES should be made in this panel.** Viewpoint Layer --------------- | The purpose of **Viewpoint Layers** is to hold camera positions in the form of points in 3D space, called viewpoints. When a camera is attached to a viewpoint, it inherits the position and rotation, and the time instant where it’s placed. A viewpoint exists only in a single instant therefore it can be visible only when its time is aligned with the set current time. | Viewpoints are visible as spheres when gizmos are enabled. .. figure:: ../images/4/4-55.png :width: 80% :align: center A Viewpoint Layer with three viewpoints visible in the scene Add Viewpoint Layer ~~~~~~~~~~~~~~~~~~~ Clicking on the Viewpoint option opens the Viewpoint Layer panel. Here, beside the usual canvas and layer properties, user can set the name of the layer, the position and the orientation of the point, and the time instant. .. figure:: ../images/4/4-56.png :width: 25% :align: center Add Viewpoint Layer .. figure:: ../images/4/4-57.png :width: 40% :align: center Add Viewpoint Panel Viewpoint Hierarchy Panel ~~~~~~~~~~~~~~~~~~~~~~~~~ A viewpoint in the scene displays a special button in the hierarchy, the GO TO button which sets the camera position in correspondence of the position and rotation of the viewpoint, and setting the current time to the viewpoint time. .. figure:: ../images/4/4-58.png :width: 30% :align: center Viewpoint GO TO button in hierarchy panel Viewpoint Inspector Panel ~~~~~~~~~~~~~~~~~~~~~~~~~ The Viewpoint Layer Inspector Panel provides the options to add a viewpoint, through the Add Data Source Button, which opens up the relative panel, and to delete it with the Delete button. .. figure:: ../images/4/4-59.png :width: 30% :align: center Viewpoint Layer Inspector Panel The Viewpoint Inspector Panel allows to delete the viewpoint with the specific button and it shows the same editable properties found in the popup panel. Changes can be discarded or confirmed with Cancel and Apply. .. figure:: ../images/4/4-60.png :width: 30% :align: center Viewpoint Inspector Panel Cesium Layer ------------ The last layer type to be covered is the **Cesium Layer**. Using the Cesium framework technology, this experimental Layer showcases the application's capability to seamlessly navigate from global to local scale. The modal window for configuring the Cesium Layer is minimal, as shown in Figure 66, requiring the user to specify only the layer name. .. figure:: ../images/4/4-61.png :width: 30% :align: center Add Cesium Layer .. figure:: ../images/4/4-62.png :width: 30% :align: center Cesium Layer popup panel There are three significant constraints regarding the Cesium Layer: | 1. It can only be rendered using a specific Ellipsoidal Canvas, created specifically for it, with a scale factor 1000 times larger than the default. Subsequently, rendering other layers on different canvases alongside the Cesium Layer is not feasible. However, additional layers can still be added to the Cesium Layer's Canvas | 2. It cannot be rendered on a Planar Canvas | 3. Currently, only Google Photorealistic 3D Tiles can be rendered with the Cesium Layer The user interface for the Cesium Layer is minimal. .. figure:: ../images/4/4-63.png :width: 80% :align: center Cesium Layer: the UI is almost empty To navigate the 3D scene at very low altitudes, close to the Earth's surface, it's recommended to disable the "Surface Collider" checkbox in the Camera panel and switch the navigation type to Fly (see chapter 2.2 Camera Panel). .. figure:: ../images/4/4-64.png :width: 80% :align: center Google Photorealistic 3D Tiles with Cesium Unity Framework Data Sources ============ Currently there are **four types** of **Data Sources** that can be added to the appropriate Layer: - Data Sources from Backend - Images or Videos from local storage - WMS - User-defined JSON file from local storage Backend Data Source ------------------- | Data Sources from the Backend retrieve the actual data to render directly from the Backend infrastructure. | Currently, they can be categorized as surface data or volumetric data: | - **Surface data** can be applied to Surface Layers, Wind Layers, or Unit Vector Field Layers | - **Volumetric data** can be applied to Volume Layers or Wind Layers To select a Data Source from the Backend, user can interact with the corresponding UI for Backend Data Discovery, accessible when creating the appropriate Layer. .. figure:: ../images/4/4-65.png :width: 40% :align: center Backend Data Discovery Backend Data Source Discovery Panel ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ | On the left side of the Backend Data Discovery Panel, users can configure filters such as Area Of Interest, Time Of Interest, and a text string. | At the top-right of the UI, a list of all available datasets from the Backend is displayed, with white entries representing matches to the filters (datasets intersecting the specified AOI and TOI, with metadata containing the text string), while others are grayed out. | At the bottom-right, detailed information about the selected dataset is presented, with key details formatted as "key: value" pairs and all metadata available in JSON format as provided by the source. | When a user clicks on an item to select it, the filters adjust accordingly to match its metadata. | However, since the temporal series of a dataset can be extensive, the TOI defaults to the last available timestamp up to three days prior. | Users can click on Set Dataset Filters to configure all filters based on the selected items or Reset Filters to revert filters to default values. | TOI and AOI filters determine the setup of the Data Source and the Layer to which it is attached. For instance, if the user sets the AOI to: | - Min Latitude = -45, Max Latitude = 45 | - Min Longitude = -90, Max Longitude = 90 | The bounding box of the Data Source will be adjusted accordingly, even if the original AOI of the dataset covers the entire Earth extent. | Users can confirm adding the selected item as a Data Source for the Layer being created by pressing the OK button or cancel the operation by clicking Cancel. Image/Video Data Source ----------------------- | To select an image or video as a Data Source, the user can interact with the corresponding UI, accessible when creating the appropriate Layer. | Supported image types include PNG, JPG, or GeoTIFF with floating-point values. | Supported video types include .mp4, .avi, and .mov. | While the format (RGB/RGBA or RAW) is indicated by the URI, users can configure other common parameters for images or videos, such as: | - Time Of Interest: optional, only if Time dependent checkbox is enabled | - Area Of Interest: default bounding box is set to the entire Earth | - Resolution: is 0 degrees (not specified) for any type of image or video .. figure:: ../images/4/4-66.png :width: 40% :align: center RGB Image Data Source insertion .. figure:: ../images/4/4-67.png :width: 40% :align: center Video Data Source insertion | Further information has to be provided for GeoTIFF images: | - Min Value and Max Value: clamp data to min and max values | - Colormap: colormap to apply to the rendered data .. figure:: ../images/4/4-68.png :width: 40% :align: center GeoTIFF Data Source insertion Image/Video Data Source Inspector Panel ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ | The Inspector Panel for the Image/Video Data Source remains consistent regardless of the type of image or video. It features the following options: | - Bilinear Filter checkbox | - Format (RGB/RGBA or RAW) of the image or video | - Advance options (for RGB image only) | - Colormap Picker (for GeoTIFF only) | - AOI and TOI settings (if configured) .. figure:: ../images/4/4-69.png :width: 30% :align: center RGB Image Data Source Inspector Panel .. figure:: ../images/4/4-70.png :width: 30% :align: center GeoTiff Data Source Inspector Panel .. figure:: ../images/4/4-71.png :width: 30% :align: center Video Data Source Inspector Panel WMS Data Source --------------- To select WMS as a Data Source, the user can interact with the corresponding UI, which is available when creating the appropriate Layer. The WMS Data Source UI is exemplified in the following figure: .. figure:: ../images/4/4-72.png :width: 40% :align: center WMS Data Source insertion | When entering the WMS address in the URI text field and pressing the Get button, the other fields of the UI are automatically populated, although they can still be manually modified. | The exceptions are fields that must be configured by the user, such as the layer of the WMS to render via the Layer dropdown menu and whether it is time-dependent, which is indicated by the Time dependent checkbox. | The user can specify additional options to append to the WMS GetMap request, similar to URL parameters, for example: | &STYLES=default;colorrange=(230,340) | Additionally, users can change the order of the min/max latitude/longitude in the request when the WMS service does not precisely match the standard.  WMS Data Source Inspector Panel UI ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ The WMS Data Source Inspector Panel appears like this : .. figure:: ../images/4/4-73.png :width: 30% :align: center WMS Data Source UI in Inspector Panel All the WMS parameters are exposed to the user, although only Options, BBox Order and Time format can be changed, other than the Time Of Interest and the Area Of Interest. Data Sources from JSON local file --------------------------------- User can create any Data Source by manually editing a JSON file. While examples will be provided, this approach is intended for highly experienced users and is not recommended, particularly since future releases of the application will include functions for saving and loading Data Sources created through the UI of the application itself.