Adding Images

In the following example, a Card is being used to show the gender of a Salesperson. When a user hovers over one of the values in the Bar chart; each bar will show the image and value for the salesperson represented by the bar.

A Card chart containing images is created in the same way as explained in the previous section with the exception of any images that you want to display. Image files will need to be included in the Data Source and the relevant object is then added to the Sparkline section on the Data screen.

To add the image to the Card, tick the Image box at the top-left of the Design section, a new section will be displayed on the left-hand side of the card.

Image file names can be stored in HTML code in Data Sources, to be able to see a picture rather than code we need to add the image object as follows:

Click the Content link at the top right of the screen and you should see a section for ‘Image’.

In the Image section, type the name of the image followed by .png.

Images must be stored as png files in the C:\Program Files\Dashboard\Dashboard\tomcat\webapps\panMISDashboardResources\images folder