Overview
The Target Bar shows a numeric value as a bar in relation to a target marker. By default, the bar is red when the value is below target, or grey when the value is at or above target.
The following diagram shows a target bar being configured:
| Source Data: | The dataset from which the values are obtained. |
| Actual Column: | The column from the dataset that determines the actual value used for the bar fill. |
| Target Column: | The column from the dataset that determines the vertical black target bar. |
| Max Column: | The column from the source data that determines the maximum value that the bar should have. This can be above the target value. For example, you may have a sales target of 90% but the maximum would be 100%. |
| Filter Column: | The column of the dataset that provides the values that will be assessed. This is used in conjunction with the Filter Value. |
| Filter Value: | The row of the dataset that provides the values that will be assessed. |
| Colours: | The number of colours specified should be the number of Thresholds + 1. The order in which the colours are specified should be the same order that the thresholds are specified. |
| Thresholds: | The values at which the bar colour should change. The highest threshold value should be less than the value of Max Field.
By default, the thresholds are set to 60% under, 30% under, and 0%. So if the actual value is more than 60% under target, the colour of the bar is deep red. At 0% (i.e. the target has been met), the colour changes to grey. |
| Reverse: | Select this check box to invert the good and bad thresholds, so that lower is good and higher is bad. |
| Percentage: | Select this check box if the thresholds are expressed in percentages. |
| Decimals: | The number of decimal points for the actual value displayed in the tooltip. |
Tutorial
The Target Bar is a useful component to display target vs actual. In this topic, we’ll show you how to use the Target Bar to display actual vs planned production data for a selected well. This is often used in production summary reports.
Let’s look at how we’re actually going to do this, step-by-step.
Step by Step: Creating a Target Bar That Displays Planned vs Actual
Before you start, open a new tab in Explorer and click the “Create a New Page in Studio Mode” thumbnail. Choose the grid layout – you can adjust the rows and columns if you like but it’s not important for this exercise.
You will need to adjust the configuration to suit your data at your site.
Step 1. Add the source data
Before we can display any data on the page, we need to add the source data.
- Below the canvas, click the button labelled “Add Data“.
- Choose the data you are going to use. For this tutorial, we are using a dataset called “WelPlanningData”.
- In the configuration options, specify the following:
- Name: WelPlanningData1 (this is automatically added)
- Query: WelPlanningData (this is the query in P2 Server that is being used to return the data)
- StartDate: (Datetime) 01/04/2015 12:00:00 AM
- EndDate: (Datetime) 30/04/2015 12:00:00 AM
- EntitiesList: (Event) selectedEntity
Step 2. Add the Target Bar
Drag and drop the Target Bar component onto a grid cell.
Step 3. Configure the Target Bar
In this example, we want the Target Bar to indicate when we've hit 90% of planned production. Configure the Target Bar as follows:
- Source Data: WelPlanningData1
- Actual Column: (Text) OilActual
- Target Column: (Text) OilP90
- Max Column: (Text) OilPlanned
Step 4. Add the Entity Selector
This step allows the user to select an entity, which will drive the Target Bar.
- Drag and drop the Entity Selector control onto the canvas.
- Configure it as follows:
- Selected Entity: selectedEntity
- Selected Entities: (blank)
- Hierarchy Name: (Text) Oil and Gas
- Template Filter: (Text) Oil Producing Well
- Number of Selections: 1
Step 5. All done!
Congratulations! You now have a Target Bar that will show you actual vs planned oil production for a selected well.
- Click the preview
button on the Studio toolbar to see what your page will look like in run-time. - Select entities and observe the changes in the target bar.
Don’t forget to save your page!