---
tags:
- UI Page widgets
alias: user-guide-uipage-widgets-bi-card
widgetname: BI Card
description: "A BI Card visualizes key performance indicators for shop floor entities"
---

# BI Card

![Screenshot showing a Business Intelligence card.](images/bicard.png)

## Overview

A BI Card is a graphic representations of Key Performance Indicators (KPIs), and are used as a mean to assess the performance of entities on the shop floor.

## General Steps

{% include-markdown 'includes/pages/ui_widgets_general_steps_with_behavior.md' %}

 ![Screenshot showing a diagram of a bicycle card.](images/bicard_general.png)

## Widget Customization

1. Optionally, in the **Style** tab, you can define a Border Width and Color.

    ![BIcardStyle](images/bicard_style.png)

2. In the **Setup** tab, provide the Entity Type for which you want to create the Card and in the next field, specify the precise equipment for which data will be shown in the Card. Additionally, select if you want to display the entity name in the widget header, by setting the **Show Entity Name** toggle button to `true` (default setting is `false`).

    ![Screenshot showing a widget customization interface with fields for Entity Type and Equipment.](images/bicard_setup.png)

    !!! note
	    When a BI Card is configured with a KPI/Dimension that uses a variable such as `@EntityName` or `@EntityId`, you should fill out the field below the Entity Type. If this field is left empty, it is available as an input of the BI Card Widget, so that, for example, another widget can be configured in the UI Page to have this variable populated dynamically.

3. In the **Layout** page, provide the following properties:

    * **KPI** - Select the KPI to be displayed.
    * **Title** - Add a title to be displayed in the Card.
    * **Dimension** - Specify the time frame for the values to be displayed.
    * **Show Caption** - Determine whether the chart captions should be displayed. This option is set to `true` by default.
    * **Show Title** - Decide whether to display the title. This option is set to `true` by default.
    * **Show Subtitle** -  Decide whether to display the subtitle. This option is set to `true` by default.
    * **Gauge Type** - Select the graphic representation for the BI Card from the available gauge types to display the data. Depending on the gauge type selected,additional options may become available. For more information on gauge types, see the [[user-guide-uipage-widgets-data-value]] widget page.

    You can add multiple KPIs by selecting the :material-plus: button in the top right-hand corner of the screen. To remove a KPI, select the :material-trash-can: button. The Cards can be resized and arranged as desired by dragging them to adjust their proportions.

    === "Layout Properties"

        ![Screenshot showing a widget customization interface with a plus (+) and trash can icons in the top right-hand corner.](images/bicard_layout.png)

    === "Gauge Types"

        ![Screenshot showing a widget customization interface with a plus button (+) and trash can icon in the top right corner.](images/bicard_layout2.png)

    !!! note
        KPIs available for selection will match the Entity Type for which the BI Card widget is setup.

4. Optionally, define the **Links** between this widget and other elements of the UI Page.

    ![Screenshot showing widget customization options, including link settings.](images/bicard_links.png)

5. To optimize the creation of BI Cards, you can duplicate an existing Card instead of creating new one. Simply select the three-dot icon and then Duplicate.  

## Real Use Case

A BI Card can be linked to show data for a specific entity, such as one provided as input from an [[user-guide-uipage-widgets-entity-list]] widget.

### Preconditions

* An Entity Type List widget must be present on the same UI Page and configured for the matching Entity Type.

* The KPI must be configured with a corresponding @EntityName parameter to ensure the data is specific to the entity.

![Screenshot showing a KPI configuration with an @EntityName parameter, including entity-specific data and a BI card.](images/image-20210518121634889.png)

### Steps

1. Set up the link between the BI Card and the Entity List widget. The configuration should look similar to the following example:

![Screenshot showing a BI Card and Entity List widget configuration setup.](images/bicard_usecase.png)

### Available KPIs

You can see a list of dynamic KPIs that are available in a fresh installation of Critical Manufacturing MES in this page: [[user-guide-system-kpi]].

!!! info
	For more information, see the [[tutorials-bicards]] tutorial.