Images in Form and Dashboard
By Kepion Solution - Apr 16, 2015
You can integrate images inside your form and dashboard by using display properties. To configure for this scenario, you will need the following:
- PNG or JPEG image files accessible via the browser
- A dimension attribute of type “string” to store the URL of the PNG/JPEG files
- A form with row/column/filter properties
- A dashboard with filter display configured
First ensure you have some image files available to use in your application. For best practice, avoid using the Kepion install folder path as a location for your image files. Once your PNG files are defined, create a dimension attribute of type string to store the image URL. In the example below, we have an image URL for each member of the Product and Entity dimension.
Please make sure your Kepion URL and the location of the image files are using the same service schema (HTTP, or HTTPS). If your Kepion application is configured under HTTPS (e.g. https://your_kepion_url), you need to upload the image files to a location also with the HTTPS schema.
Next, define your form with the dimensions that contains the image URL. In the example below, we configure the “Logo Link” attribute as the display property, and we check the “Image Link” checkbox to indicate that this should be displayed as an image. You can also configure the “Image Stretch” property to determine how the image is rendered.
Once configured, your form will display the property as an image.
Next, let’s configure the filter property to include an image URL property so that we can use it on the dashboard.
From a dashboard, add the form that was configured in the previous steps. Also, add a filter and a filter display to the dashboard. In the example below, we have a form filter for Entity dimension, and also a filter display that is configured with Entity’s “Region Image” attribute. Let’s configure the “Region Image” filter display as an image.
Click on the settings icon. Configure the Mode as “Image Link” and select an appropriate Stretch setting.
Now, when you change the form filter, the linked filter display will automatically update based on the selected member.