ClearML/clearml-docs
1
0
Fork 0
mirror of https://github.com/clearml/clearml-docs synced 2025-06-26 18:17:44 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Fix icons

Browse Source
This commit is contained in:
allegroai
2021-05-23 23:17:12 +03:00
parent ab83c33b25
commit 83c20f3d54
11 changed files with 406 additions and 406 deletions
Download Patch File Download Diff File Expand all files Collapse all files

196
docs/webapp/webapp_exp_track_visual.md
View File

@@ -2,48 +2,48 @@
title: Tracking Experiments and Visualizing Results
---
While an experiment is running, and any time after it finishes, track it and visualize the results in the **ClearML Web UI**,
including:
While an experiment is running, and any time after it finishes, track it and visualize the results in the **ClearML Web UI**,
including:
* [Execution details](#execution-details) - Code, the base Docker image used for **ClearML Agent**, output destination for artifacts, and the logging level.
* [Configuration](#configuration) - Hyperparameters, user properties, and configuration objects.
* [Artifacts](#artifacts) - Input model, output model, model snapshot locations, other artifacts.
* [General information](#general-information) - Information about the experiment, for example: the experiment start, create, and last update times and dates, user creating the experiment, and its description.
* [Console](#console) - stdout, stderr, output to the console from libraries, and **ClearML** explicit reporting.
* [Console](#console) - stdout, stderr, output to the console from libraries, and **ClearML** explicit reporting.
* [Scalars](#scalars) - Metric plots.
* [Plots](#other-plots) - Other plots and data, for example: Matplotlib, Plotly, and **ClearML** explicit reporting.
* [Debug samples](#debug-samples) - Images, audio, video, and HTML.
## Viewing modes
The **ClearML Web UI** provides two viewing modes for experiment details:
The **ClearML Web UI** provides two viewing modes for experiment details:
* The info panel
* Full screen details mode.
Both modes contain all experiment details. When either view is open, switch to the other mode by clicking <img src="/icons/ico-info-min.svg" className="icon size-md space-sm" />
(**View in experiments table / full screen**), or clicking <img src="/icons/ico-bars-menu.svg" alt="Bars menu" className="icon size-sm space-sm" /> (**menu**) > **View in experiments
* Full screen details mode.
Both modes contain all experiment details. When either view is open, switch to the other mode by clicking <img src="/docs/latest/icons/ico-info-min.svg" className="icon size-md space-sm" />
(**View in experiments table / full screen**), or clicking <img src="/docs/latest/icons/ico-bars-menu.svg" alt="Bars menu" className="icon size-sm space-sm" /> (**menu**) > **View in experiments
table / full screen**.
### Info panel
The info panel keeps the experiment table in view so that [experiment actions](webapp_exp_table#clearml-actions-from-the-experiments-table)
can be performed from the table (as well as the menu in the info panel).
The info panel keeps the experiment table in view so that [experiment actions](webapp_exp_table#clearml-actions-from-the-experiments-table)
can be performed from the table (as well as the menu in the info panel).
<details className="cml-expansion-panel screenshot">
<summary className="cml-expansion-panel-summary">View a screenshot</summary>
<div className="cml-expansion-panel-content">
![image](../img/webapp_tracking_40.png)
</div>
</details>
### Full screen details view
The full screen details view allows for easier viewing and working with experiment tracking and results. The experiments
The full screen details view allows for easier viewing and working with experiment tracking and results. The experiments
table is not visible when the full screen details view is open. Perform experiment actions from the menu.
<details className="cml-expansion-panel screenshot">
@@ -51,17 +51,17 @@ table is not visible when the full screen details view is open. Perform experime
<div className="cml-expansion-panel-content">
![image](../img/webapp_tracking_33.png)
</div>
</details>
## Execution details
In the EXECUTION tab of an experiment's detail page, there are records of:
* Source code
In the EXECUTION tab of an experiment's detail page, there are records of:
* Source code
* **ClearML Agent** configuration
* Output details
* Uncommitted changes
* Uncommitted changes
* Installed Python packages
@@ -71,48 +71,48 @@ The source code details of the EXECUTION tab of an experiment include:
* The experiment's repository
* Commit ID
* Script path
* Working directory
Additionally, there is information about the **ClearML Agent** configuration. The **ClearML Agent** base image is a pre-configured Docker
that **ClearML Agent** will use to remotely execute this experiment (see [Building Docker containers](../clearml_agent.md#building-docker-containers)).
* Working directory
Additionally, there is information about the **ClearML Agent** configuration. The **ClearML Agent** base image is a pre-configured Docker
that **ClearML Agent** will use to remotely execute this experiment (see [Building Docker containers](../clearml_agent.md#building-docker-containers)).
The output details include:
* The output destination used for storing model checkpoints (snapshots) and artifacts (see also, [default_output_uri](../configs/clearml_conf#config_default_output_uri)
in the configuration file, and [output_uri](../references/sdk/task.md#taskinit)
in `Task.init` parameters).
* The output destination used for storing model checkpoints (snapshots) and artifacts (see also, [default_output_uri](../configs/clearml_conf#config_default_output_uri)
in the configuration file, and [output_uri](../references/sdk/task.md#taskinit)
in `Task.init` parameters).
* The logging level for the experiment, which uses the standard Python [logging levels](https://docs.python.org/3/howto/logging.html#logging-levels).
<details className="cml-expansion-panel screenshot">
<summary className="cml-expansion-panel-summary">View a screenshot</summary>
<div className="cml-expansion-panel-content">
![image](../img/webapp_tracking_18.png)
</div>
</details>
### Uncommitted changes
### Uncommitted changes
<details className="cml-expansion-panel screenshot">
<summary className="cml-expansion-panel-summary">View a screenshot</summary>
<div className="cml-expansion-panel-content">
![image](../img/webapp_tracking_19.png)
</div>
</details>
### Installed Python packages and their versions
### Installed Python packages and their versions
<details className="cml-expansion-panel screenshot">
<summary className="cml-expansion-panel-summary">View a screenshot</summary>
<div className="cml-expansion-panel-content">
![image](../img/webapp_tracking_20.png)
</div>
</details>
@@ -123,7 +123,7 @@ All parameters and configuration objects appear in the **CONFIGURATION** tab.
### Hyperparameters
:::important
:::important
In older versions of **ClearML Server**, the **CONFIGURATION** tab was named **HYPER PARAMETERS**, and it contained all parameters. The renamed tab contains a **HYPER PARAMETER** section, and subsections for hyperparameter groups.
:::
@@ -132,18 +132,18 @@ Hyperparameters are grouped by their type and appear in **CONFIGURATION** **>**
#### Command line arguments
The **Args** section shows automatically logged `argparse` arguments, and all older experiments parameters, except TensorFlow Definitions. Hover over a parameter, and the type, description, and default value appear, if they were provided.
<details className="cml-expansion-panel screenshot">
<summary className="cml-expansion-panel-summary">View a screenshot</summary>
<div className="cml-expansion-panel-content">
![image](../img/webapp_tracking_22.png)
</div>
</details>
#### Environment variables
#### Environment variables
If the `CLEARML_LOG_ENVIRONMENT` variable was set, the **Environment** section will show environment variables (see [this FAQ](../faq#track-env-vars)).
@@ -152,14 +152,14 @@ If the `CLEARML_LOG_ENVIRONMENT` variable was set, the **Environment** section w
<div className="cml-expansion-panel-content">
![image](../img/webapp_tracking_23.png)
</div>
</details>
#### Custom parameter groups
#### Custom parameter groups
Custom sections shows parameter dictionaries, if the parameters were connected to the Task, using the `Task.connect` method,
Custom sections shows parameter dictionaries, if the parameters were connected to the Task, using the `Task.connect` method,
with a `name` argument provided.
<details className="cml-expansion-panel screenshot">
@@ -167,7 +167,7 @@ with a `name` argument provided.
<div className="cml-expansion-panel-content">
![image](../img/webapp_tracking_25.png)
</div>
</details>
@@ -180,15 +180,15 @@ The **TF_DEFINE** sections shows automatic TensorFlow logging.
<div className="cml-expansion-panel-content">
![image](../img/webapp_tracking_26.png)
</div>
</details>
</details>
Once an experiment is run and stored in **ClearML Server**, any of these hyperparameters can be [modified](webapp_exp_tuning.md#modifying-experiments).
### User properties
User properties allow to store any descriptive information in a key-value pair format. They are editable in any experiment,
User properties allow to store any descriptive information in a key-value pair format. They are editable in any experiment,
except experiments whose status is *Published* (read-only).
<details className="cml-expansion-panel screenshot">
@@ -196,19 +196,19 @@ except experiments whose status is *Published* (read-only).
<div className="cml-expansion-panel-content">
![image](../img/webapp_tracking_21.png)
</div>
</details>
</details>
### Configuration objects
**ClearML** tracks experiment (Task) model configuration objects, which appear in **Configuration Objects** **>** **General**.
These objects include those that are automatically tracked, and those connected to a Task in code (see [Task.connect_configuration](../references/sdk/task.md#connect_configuration)).
**ClearML** supports providing a name for a Task model configuration (see the [name](../references/sdk/task.md#connect_configuration)
**ClearML** tracks experiment (Task) model configuration objects, which appear in **Configuration Objects** **>** **General**.
These objects include those that are automatically tracked, and those connected to a Task in code (see [Task.connect_configuration](../references/sdk/task.md#connect_configuration)).
**ClearML** supports providing a name for a Task model configuration (see the [name](../references/sdk/task.md#connect_configuration)
parameter in `Task.connect_configuration`.
:::important
:::important
In older versions of **ClearML Server**, the Task model configuration appeared in the **ARTIFACTS** tab, **MODEL CONFIGURATION** section. Task model configurations now appear in the **Configuration Objects** section, in the **CONFIGURATION** tab.
:::
@@ -217,19 +217,19 @@ In older versions of **ClearML Server**, the Task model configuration appeared i
<div className="cml-expansion-panel-content">
![image](../img/webapp_tracking_24.png)
</div>
</details>
</details>
<br/>
<details className="cml-expansion-panel screenshot">
<summary className="cml-expansion-panel-summary">View a screenshot - Custom configuration object</summary>
<div className="cml-expansion-panel-content">
![image](../img/webapp_tracking_28.png)
</div>
</details>
</details>
@@ -242,7 +242,7 @@ Copy the location of models and artifacts stored in local files (`file://`) to t
### Models
The input and output models appear in the **ARTIFACTS** tab. Models are associated with the experiment, but to see further model details,
The input and output models appear in the **ARTIFACTS** tab. Models are associated with the experiment, but to see further model details,
including design, label enumeration, and general information, go to the **MODELS** tab, by clicking the model name, which is a hyperlink to those details.
**To retrieve a model:**
@@ -250,8 +250,8 @@ including design, label enumeration, and general information, go to the **MODELS
1. In the **ARTIFACTS** tab **>** **MODELS** **>** **Input Model** or **Output Model**, click the model name hyperlink.
1. In the model details **>** **GENERAL** tab **>** **MODEL URL**, either:
* Download the model<img src="/icons/ico-download.svg" className="icon size-md space-sm" />, if it is stored in remote storage.
* Copy its location to the clipboard <img src="/icons/ico-clipboard.svg" alt="Copy Clipboard" className="icon size-md space-sm" />,
* Download the model<img src="/docs/latest/icons/ico-download.svg" className="icon size-md space-sm" />, if it is stored in remote storage.
* Copy its location to the clipboard <img src="/docs/latest/icons/ico-clipboard.svg" alt="Copy Clipboard" className="icon size-md space-sm" />,
if it is in a local file.
@@ -260,7 +260,7 @@ including design, label enumeration, and general information, go to the **MODELS
<div className="cml-expansion-panel-content">
![image](../img/webapp_exp_artifacts_01.png)
</div>
</details>
@@ -271,8 +271,8 @@ including design, label enumeration, and general information, go to the **MODELS
1. In the **ARTIFACTS** tab **>** **DATA AUDIT** or **OTHER** **>** Select an artifact **>** Either:
* Download the artifact <img src="/icons/ico-download.svg" className="icon size-md space-sm" />, if it is stored in remote storage.
* Copy its location to the clipboard <img src="/icons/ico-clipboard.svg" alt="Copy Clipboard" className="icon size-md space-sm" />,
* Download the artifact <img src="/docs/latest/icons/ico-download.svg" className="icon size-md space-sm" />, if it is stored in remote storage.
* Copy its location to the clipboard <img src="/docs/latest/icons/ico-clipboard.svg" alt="Copy Clipboard" className="icon size-md space-sm" />,
if it is in a local file.
#### Data audit
@@ -285,9 +285,9 @@ Artifacts which are uploaded and dynamically tracked by **ClearML** appear in th
<div className="cml-expansion-panel-content">
![image](../img/webapp_tracking_29.png)
</div>
</details>
</details>
#### Other
@@ -298,31 +298,31 @@ Other artifacts, which are uploaded but not dynamically tracked after the upload
<div className="cml-expansion-panel-content">
![image](../img/webapp_tracking_30.png)
</div>
</details>
</details>
## General information
General experiment details appear in the **INFO** tab. This includes information describing the stored experiment:
General experiment details appear in the **INFO** tab. This includes information describing the stored experiment:
* The parent experiment
* Project name
* Creation, start, and last update dates and times
* User who created the experiment
* Experiment state (status)
* Whether the experiment is archived
<details className="cml-expansion-panel screenshot">
<summary className="cml-expansion-panel-summary">View a screenshot</summary>
<div className="cml-expansion-panel-content">
![image](../img/webapp_tracking_31.png)
</div>
</details>
</details>
@@ -334,7 +334,7 @@ General experiment details appear in the **INFO** tab. This includes information
### Console
The complete experiment log containing everything printed to stdout and strerr appears in the **CONSOLE** tab. The full log
The complete experiment log containing everything printed to stdout and strerr appears in the **CONSOLE** tab. The full log
is downloadable. To view the end of the log, click **Jump to end**.
<details className="cml-expansion-panel screenshot">
@@ -342,50 +342,50 @@ is downloadable. To view the end of the log, click **Jump to end**.
<div className="cml-expansion-panel-content">
![image](../img/webapp_tracking_32.png)
</div>
</details>
</details>
### Scalars
All scalars that **ClearML** automatically logs, as well as those explicitly reported in code, appear in **RESULTS** **>** **SCALARS**.
All scalars that **ClearML** automatically logs, as well as those explicitly reported in code, appear in **RESULTS** **>** **SCALARS**.
#### Scalar plot tools
Use the scalar tools to improve analysis of scalar metrics. In the info panel, click <img src="/icons/ico-settings.svg" className="icon size-md space-sm" /> to use the tools. In the full screen details view, the tools
Use the scalar tools to improve analysis of scalar metrics. In the info panel, click <img src="/docs/latest/icons/ico-settings.svg" className="icon size-md space-sm" /> to use the tools. In the full screen details view, the tools
are on the left side of the window. The tools include:
* **Group by** - select one of the following:
* **Metric** - all variants for a metric on the same plot
* **Group by** - select one of the following:
* **Metric** - all variants for a metric on the same plot
<details className="cml-expansion-panel screenshot">
<summary className="cml-expansion-panel-summary">View a screenshot</summary>
<div className="cml-expansion-panel-content">
![image](../img/webapp_tracking_33.png)
</div>
</details>
* **None** - Group by metric-variant combination (individual metric-variant plots).
<details className="cml-expansion-panel screenshot">
<summary className="cml-expansion-panel-summary">View a screenshot</summary>
<div className="cml-expansion-panel-content">
![image](../img/webapp_tracking_34.png)
</div>
</details>
* Show / hide plots - Click **HIDE ALL**, and then click <img src="/icons/ico-show.svg" alt="Eye Show All" className="icon size-md space-sm" />
* Show / hide plots - Click **HIDE ALL**, and then click <img src="/docs/latest/icons/ico-show.svg" alt="Eye Show All" className="icon size-md space-sm" />
on those you want to see.
* **Horizontal axis** modes (scalars, only) - Select one of the following:
* **Horizontal axis** modes (scalars, only) - Select one of the following:
* **ITERATIONS**
* **RELATIVE** - time since experiment began
* **RELATIVE** - time since experiment began
* **WALL** - local clock time
* Curve smoothing (scalars, only) - In **Smoothing** **>** Move the slider or type a smoothing factor between **0** and **0.999**.
* Curve smoothing (scalars, only) - In **Smoothing** **>** Move the slider or type a smoothing factor between **0** and **0.999**.
#### Plot controls
@@ -394,7 +394,7 @@ Each plot supports plot controls allowing you better analyze the results. The ta
|Icon|Description|
|---|---|
| ![image](../img/svg/download-png.svg) | Download plots as PNG files. |
| ![image](../img/svg/download-png.svg) | Download plots as PNG files. |
| ![image](../img/svg/pan.svg) | Pan around plot. Click ![image](../img/svg/pan.svg), click the plot, and then drag. |
| ![image](../img/svg/dotted-box.svg) | To examine an area, draw a dotted box around it. Click ![image](../img/svg/dotted-box.svg) and then drag. |
| ![image](../img/svg/dotted-lasso.svg) | To examine an area, draw a dotted lasso around it. Click ![image](../img/svg/dotted-lasso.svg) and then drag. |
@@ -413,8 +413,8 @@ Each plot supports plot controls allowing you better analyze the results. The ta
### Other plots
Other plots include data reported by libraries, visualization tools, and **ClearML** explicit reporting. These may include
2D and 3D plots, tables (Pandas and CSV files), and Plotly plots. Other plots appear in **RESULTS** **>** **PLOTS**.
Other plots include data reported by libraries, visualization tools, and **ClearML** explicit reporting. These may include
2D and 3D plots, tables (Pandas and CSV files), and Plotly plots. Other plots appear in **RESULTS** **>** **PLOTS**.
Individual plots can be shown / hidden or filtered by title.
<details className="cml-expansion-panel screenshot">
@@ -422,7 +422,7 @@ Individual plots can be shown / hidden or filtered by title.
<div className="cml-expansion-panel-content">
![image](../img/webapp_tracking_35.png)
</div>
</details>
@@ -439,7 +439,7 @@ View debug samples by metric at any iteration. The most recent iteration appears
* Move to the same sample in a different iteration (move the iteration slider).
* Show the next or previous iteration's sample.
* Download the file <img src="/icons/ico-download.svg" className="icon size-md space-sm" />.
* Download the file <img src="/docs/latest/icons/ico-download.svg" className="icon size-md space-sm" />.
* Zoom.
* View the sample's iteration number, width, height, and coordinates.
@@ -449,7 +449,7 @@ View debug samples by metric at any iteration. The most recent iteration appears
<div className="cml-expansion-panel-content">
![image](../img/webapp_tracking_43.png)
</div>
</details>
@@ -460,7 +460,7 @@ View debug samples by metric at any iteration. The most recent iteration appears
<div className="cml-expansion-panel-content">
![image](../img/webapp_tracking_44.png)
</div>
</details>
<br/>
@@ -471,7 +471,7 @@ View debug samples by metric at any iteration. The most recent iteration appears
1. Locate debug samples by doing the following:
* Filter by metric. In the **Metric** list, choose a metric.
* Show other iterations. Click <img src="/icons/ico-circle-older.svg" className="icon size-md space-sm" /> (Older images), <img src="/icons/ico-circle-newer.svg" className="icon size-md space-sm" /> (New images), or <img src="/icons/ico-circle-newest.svg" className="icon size-md space-sm" /> (Newest images).
* Show other iterations. Click <img src="/docs/latest/icons/ico-circle-older.svg" className="icon size-md space-sm" /> (Older images), <img src="/docs/latest/icons/ico-circle-newer.svg" className="icon size-md space-sm" /> (New images), or <img src="/docs/latest/icons/ico-circle-newest.svg" className="icon size-md space-sm" /> (Newest images).
**To view a debug sample in the viewer / player:**
@@ -480,25 +480,25 @@ View debug samples by metric at any iteration. The most recent iteration appears
1. Do any of the following:
* Move to the same sample in another iteration - Move the slider, or click **<** (previous) or **>** (next).
* Download the file - Click <img src="/icons/ico-download.svg" className="icon size-md space-sm" />.
* Download the file - Click <img src="/docs/latest/icons/ico-download.svg" className="icon size-md space-sm" />.
* Zoom
* For images, locate a position on the sample - Hover over the sample and the X, Y coordinates appear in the legend below the sample.
* For images, locate a position on the sample - Hover over the sample and the X, Y coordinates appear in the legend below the sample.
## Tagging experiments
Tags are user-defined, color-coded labels that can be added to experiments (and models), allowing to easily identify and
group experiments. Tags can show any text. For example, add tags for the type of remote machine experiments were executed
Tags are user-defined, color-coded labels that can be added to experiments (and models), allowing to easily identify and
group experiments. Tags can show any text. For example, add tags for the type of remote machine experiments were executed
on, label versions of experiments, or apply team names to organize experimentation.
* To add tags and change tag colors:
1. Click the experiment **>** Hover over the tag area **>** **+ADD TAG** or <img src="/icons/ico-bars-menu.svg" alt="Bars menu" className="icon size-sm space-sm" /> (menu)
1. Click the experiment **>** Hover over the tag area **>** **+ADD TAG** or <img src="/docs/latest/icons/ico-bars-menu.svg" alt="Bars menu" className="icon size-sm space-sm" /> (menu)
1. Do one of the following:
* Add a new tag - Type the new tag name **>** **(Create New)**.
* Add an existing tag - Click a tag.
* Change a tag's colors - Click **Tag Colors** **>** Click the tag icon **>** **Background** or **Foreground** **>** Pick a color **>** **OK** **>** **CLOSE**.
* Change a tag's colors - Click **Tag Colors** **>** Click the tag icon **>** **Background** or **Foreground** **>** Pick a color **>** **OK** **>** **CLOSE**.
* To remove a tag - Hover over the tag **>** **X**.
@@ -506,4 +506,4 @@ on, label versions of experiments, or apply team names to organize experimentati
## Locating the experiment (Task) ID
* In the info panel, in the top area, to the right of the Task name, click **ID**. The Task ID appears.
* In the info panel, in the top area, to the right of the Task name, click **ID**. The Task ID appears.