Bound Image

To add a “Bound Images” item, select the following sub-item:

A new element appears in the designer window:

Next, you need to choose how to bind the data to the image by clicking the “Options”  button next to an attribute. The following options will be available in the opened window:

• Binary Array – use this mode if images are stored in the data source as byte arrays;
• URI – use this mode to locate images accessible by a predefined In this case, the data source field should return strings that are parts of URIs to these images.

For instance, the URI pattern in the form below specifies the path to the folder containing the required images:

Data source field values will be inserted to the position of the {0} placeholder. Thus, the Bound Image maps the current dimension value with the image placed at the specified URI.

For example, let us display flags for each country for the following table:

To start with, we will place the files with the corresponding image and name in the folder:

We will create a new “Bound Images” element with the “Country” attribute:

The form of data binding will be filled with the following data:

Now, all is left is to insert the data source field values into the {0} placeholder position:

As a result, we will get an interactive dashboard in which the table with the “Country” hierarchy will be linked to the image: