Tutorial
This section shows a brief introduction to the web application of the OACG - Hydrology for Costa Rica for the visualization, interpretation, and download of hydrological information.

# Application Elements

1. 1.
Link to the page of the Observatory of Water and Global Change (OACG).
2. 2.
Link to the page of the University of Costa Rica (UCR).
3. 3.
Selection of the application language (Spanish / English). By default, it is in the Spanish language. When the language is changed, you must wait for the application to update all the components, so it could take a little time.
4. 4.
Selection of the variable to be displayed on the map. By default, the average annual precipitation is displayed. For more information on the available variables, you can consult the Hydrological Indices section in the Documentation section. Every time the variable on the map is changed, you must wait for the application to load the necessary data, which may take a few seconds.
5. 5.
Map of sub-catchments in Costa Rica used for hydrological simulation. Hovering the cursor over a catchment will show the attributes of the catchment, starting with the sub-catchment index (ID), which is associated with the time series displayed in window #10. When clicking on any sub-catchment, it will be keeps selected. Multiple sub-catchments can be selected by holding down the Shift key.
6. 6.
Sub-catchments layer opacity option. Changing the opacity restarts the presentation of the sub-catchment layer, so this process may take a few seconds to show an update.
7. 7.
Temporal aggregation of hydrological series (monthly, annual, monthly average). The statistical operation applied to each series is shown in the Simulated Hydrological Series section.
8. 8.
Type of spatial series selection. By default, the Subcatchment option is activated, which allows the extraction of time series only for the sub-catchment area. When activating the Catchment option, the resulting time series is the weighting of the series of all the upstream catchments of the selected sub-catchment.
9. 9.
Selection of hydrological variables to be displayed. More than one variable can be selected at the same time, for which one axis per variable will be created (it is recommended to display a maximum of three variables).
10. 10.
Hydrological series display area. When the device window is very narrow, the area of the graph is positioned below the map of the sub-catchments.
11. 11.
Updating of the hydrological series graph. This is recommended to press after selecting more watersheds on the map, but it is not necessary if the variable options are changed because they automatically updated the figure.
12. 12.
Export the time series that are displayed in the figure. This option allows you to download a comma-delimited file (csv) with the time series of the selected catchments and variables.
The average daily flow always corresponds to the contribution of the entire catchment, where the selected sub-catchment is the lowest part of the catchment.

# Time series visualization

## Visualize series for a sub-catchment

To visualize a time serie for a sub-catchment, follow the steps described below:
1. 1.
Select the sub-catchment of interest by clicking on the map.
2. 2.
The time scale is indicated and the Subcatchment option is selected.
3. 3.
The variables to display are selected.
4. 4.
If the variables are selected before the sub-catchments, it is necessary to press the Plot Series button to update the figure.
5. 5.
The sub-catchment indicator (ID) is displayed in the legend and it is associated with the catchment ID on the map. When multiple variables are displayed, the color line for each sub-catchments is preserved.

# Visualization of series for multiple sub-catchments

1. 1.
The sub-basins of interest are selected by Shift + clicking on the map.
2. 2.
The time scale is indicated and the Sub-basin option is selected.
3. 3.
The variables to display are selected.
4. 4.
If the variables are selected before the sub-catchments, the Plot Series button must be pressed to update the figure.
5. 5.
The sub-catchment indicator (ID) is displayed as the figure legend and corresponds to the sub-catchment ID on the map. Each sub-catchment is assigned the same line color in the series for all the variables displayed.

## Visualization tools for time series

1. 1.
A label is displayed when a time series is hovered with the cursor, showing the month and day, year, and the value of the time series (Month day, Year, Value) within the box. Outside the box, the catchment ID is shown, which corresponds to ID on the map.
2. 2.
3. 3.
Zoom tools to control the display of the series.
4. 4.
Show dotted lines over the intersection in the selected series. By default, this tool is disabled.
5. 5.
Label tools for selected series. By default, the single label option is selected, but there is another option to shows the label of all series at the same time.

# Catchments visualization

Most of the hydrological series were simulated at the sub-catchment scale, with the exception of the average daily flow that corresponds to the total contribution of the upstream area at the discharge point of the selected sub-catchment.
If the average precipitation is required, for example, in the entire catchment considering the upstream area, the Catchment option must be selected, as shown in the following image. When this option is selected, when you click on a sub-catchment, all the sub-catchments that contribute up to the discharge point of the selected sub-catchment will be marked in black on the map.
The series in such case are weighted considering the area of each sub-catchment marked in black, and the average variable X will be given by:
$X = \frac{X1 * A1 + X2 * A2 + ... + Xn * An} {A1 + A2 + ... + An} = \frac{\sum_{i=1}^{n}Xi * Ai} {Atotal}$
where X is the average variable in the entire catchment, Xi is the variable of sub-catchment i, Ai is the area of sub-catchment i, Atotal is the total area of the catchment (obtained from the sum of all sub-catchments).