Presenting a Tank with a Current Value

This guide will instruct you how to add a Tank image, a Snapshot service and a Label component and bind the output value from the Snapshot service to the Tanks fill level and the Label. The display produced will show a Tank with the current value of a tag.

Guide for presenting a Tank with a current value

1. Create a new Display by clicking the three dots next to an item in the Directory Explorer and selecting New Display. Enter a name for the Display and click on the save button.

2. Add an image of a Tank.

   1. Add an Image component from the Components menu in the Toolbox.

   2. Select the Image component and go to Image Reference in the Properties section. Click on the icon to the right to open the image gallery.
      Select a Tank Image and click on Close in the bottom right to close the image gallery.

   3. Resize the Tank to a desired size by dragging the handle in the bottom right corner of the Tank. Position the Tank by holding the right six dot handle and dragging it to the desired place.

3. Add a Snapshot from the Services menu in the Toolbox. The snapshot will now be visible in the Data Outline.

4. Add a Label component from the Components menu in the Toolbox.
   Position the Label by holding the right six dot handle and dragging it to the desired location.

5. Fetch a Tag

   1. Go to Data Outline > Services and select the Snapshot.

   2. Click on the plus (+) sign next to the Actions label and select “Fetch Tag” in the dialog box that appears.
      Click on the Actions label to make the sub tab Fetch Tag visible and click on Fetch Tag to expand the fields.
      Go to the Event parameter and select “Display - On Load”. This will make the tag fetched when the display is opened.

   3. Go to the Tag Name field under Fetch Tag and click on the tag icon to the left to search for a tag or enter the name of the tag directly in the field.
      The dialog box “Add Tag(s)” opens. Enter the name or part of a name for a tag, by using a wildcard (*), and click the search button or the Enter key on your keyboard. Select a tag from the list and click the add button.

   4. Click the play-button-icon next to the Fetch Tag label to force a fetch of the tag.

   Tip: If you want to check if a tag has been fetched you can open the snapshot object in the Data Outline and hover over the attributes to see that it contains information about the selected tag.

6. Bind the tags max value to the max value of the Tank. There are two alternative ways to achieve a binding:

   Binding - Expression Editor

   1. Select the Tank image, go to Properties, click in the Max value field and delete the default text.

   2. Click on the Expression Editor icon to the right in the Max value field to open the Expression Editor.
      A dialog box with the Expression Editor now appears.
      Go to the menu to the left and open Services > the Snapshot object > attributes and click on Max to bind it to the Max value of the tank.
      The binding and its value is shown in the window.
      Click on Save.

      There is now a binding between the Max value of the tag and the Max value of the Tank, which is showed by the text in the Max value field. The dark background indicates that there is a binding.

   Binding - Data Outline

   3. Select the Tank image, go to Properties, click in the Max value field and delete the default text.

   4. Make sure the mouse cursor is still in the Max value field. Then Go to Data Outline > Services > the Snapshot object > attributes and click on Max.

      There is now a binding between the Max value of the tag and the Max value of the Tank, which is showed by the text in the Max value field. The dark background indicates that there is a binding.

7. Bind the the value of the Tag to the value of the Tank.
   Make sure the Tank component is still selected.
   Go to Properties and the value field. Click on the Expression Editor icon to the right of the value field to open the Expression Editor.
   A dialog box with the Expression Editor now appears.
   Go to the menu to the left and open Services > the Snapshot service > data > [0] and click on value to bind it to the Tanks value.
   The binding is now shown in the window.
   Click on Save.

   The binding can also be done in the Data Outline as described in step 6 above.

8. Bind the Tags value and engineering unit (egu) to the Label.
   Select the Label component, go to Properties, click in the Label field and delete the default text.
   Click on the Expression Editor icon to the right of the Label field to open the Expression Editor.
   A dialog box with the Expression Editor now appears.
   Go to the menu to the left and open Services > the Snapshot object > data > [0] and click on value and then on egu, located higher up in the structure, to bind them to the Label.
   If you want to have a space between the value and the egu you can add a space between them in the Label field.

   Click on Save.

Finished Display

We have now added a Tank image, a Label and a Snapshot service. An action has been added to the Snapshot so that it fetches a selected tag and the value of the tag is connected to the Tanks fill level and the Label through a binding. The result is a Display with a Tank where the current value of the tag is presented through the filling level of the Tank and also displayed in a Label with its engineering unit (egu).