This is a short blog to show how you can embed images dynamically within the scorecard component.
Quick Steps
- Create a blank application and assign a Datasource
- Add and Configure scorecard properties and assign images
- Save and launch the application
Create a Blank Application and assign Datasource
- Create a blank application and assign a Datasource. In the Initial view,
select the dimensions and measures which you want to assign to the
scorecard component.
2. Images for different countries are stored in the repository folder.
Add and Configure scorecard properties and assign images
- Drag and drop the scorecard component and define the row scope.
2. Configure the cell content for COLUMN_1
- Dimension Binding to “COUNTRY”
- Member Display set to “Value Presentation”
3. Set the properties for Icon:
- Dimension Binding to “COUNTRY”
- Press the Conditional Formatting icon adjacent to the “Dimension Member Content”
- Set the default value to {value}.png – This will bind the country images to matching
individual cell values. Like in our example we have “world”, “North America”, “South America”,
“Asia” as our data values for "COUNTRY" dimension. When we set the default to
{value}.png, the value in braces gets substituted with the value of the dimension
suffixed by “.png”. As we have already saved “.png” images in our application
folders the images will align with the appropriate countries.
d. The last setting to be made is to “Display Mode” set to “”Icon with Text”. This will
enable icons to be displayed along with the data values.
The above settings will update the scorecard component and this is what you will see
within the Designer Window:
Save and launch the application
- Save and launch the application in local mode.
This concludes the short blog on dynamically embedding images within scorecard content.