# Versuschart

## Purpose & Application

Versuschart are good to compare two elements on different metrics, benchmark 2 variables across a set of dimensions.

> 📝 For example, I’d like to check how my employees are distributed by age category and gender.

Use this chart to compare two individuals on several metric.

> 📝 For example, I’d like to compare Paris vs Tahiti in terms of number of sunny days per year, average temperature, etc

## Key Features

* **Flexible configuration** : one chart, two usages! And note that you can display differents values from different scales/range. Pretty cool! 😎

## Configuration

<mark style="color:red;">\*</mark>**Mandatory paramers**

| Section  | Option                                           | Description                                                                                                                                 |
| -------- | ------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------- |
|          | Dataset<mark style="color:red;">\*</mark>        | Select the dataset used by the chart                                                                                                        |
|          | Label - Column<mark style="color:red;">\*</mark> | Select the column that contains the metric to compare                                                                                       |
|          | Label - Right<mark style="color:red;">\*</mark>  | Type the name of the labels that should be display on the right side \| ⚠️ This label should be included in the column you selected before. |
|          | Label - Left<mark style="color:red;">\*</mark>   | Type the name of the labels that should be display on the left side \| ⚠️ This label should be included in the column you selected before.  |
|          | Value<mark style="color:red;">\*</mark>          | Select the column that contains the value to compare                                                                                        |
|          | Category<mark style="color:red;">\*</mark>       | Select the column that contains the dimensions to be compared                                                                               |
| Sort     | Categories Order                                 | Order categories based on a column, on an advanced order or a custom order                                                                  |
| Display  | Scale                                            | Choose two bounds to scale the bars between to override min and max value for the bars                                                      |
| Display  | Use same scale for all categories                | Allows to use the same scale for all categories. This is meaning that can compare metrics across all the categories at the same time        |
| Display  | Versus Baseline                                  | Define the minimum value for all bars                                                                                                       |
| Display  | Size                                             | Define the chart size when having multiple ones                                                                                             |
| Display  | Mobile Size                                      | Define the chart size when having multiple ones on mobile                                                                                   |
| Display  | Custom CSS Class                                 | Set a custom CSS class to target this specific chart with CSS                                                                               |
| Tutorial | Tutorial                                         | Set a tutorial to help your users to understand the chart by giving him an id and a message                                                 |