Image tile :: configuration examples

Ex1: Image from asset

Here are the steps to configure your image tile from an image in your assets :

  • Select “Image” in the tile type
  • Change the file name to : <$= assetUrl('your-image-name') $>
  • Your image dropped in the assets has to be named your-image-name.jpeg (or ‘your-image-name.png’)

You’re all set !

Configuration - what it looks like in code mode

{
  type: "image"
  src: "<$= assetUrl('your-image-name') $>"
}

Ex2: Image from report selection

You might want to change the picture in your tile depending on your report ! No worries we have a way to do just that :)

Use the following steps :

  • Select “Image” in the tile type
  • Change the file name to : <%= assetUrl(appRequesters.report) %> or <%= assetUrl(appRequesters.report.colonne_avec_le_nom_mon_asset) %>
  • This syntax is called templating : take a look at our documentation to see how it works :)
  • What you have to know : 1) <%= assetUrl(appRequesters.report) %> will take the name of your selected report/view. For example, if you are on your “France” report, your image should be called “France.jpeg” or “France.png” to show. 2) <%= assetUrl(appRequesters.report.image) %> : for this syntax, make sure you have an “image” column in the dataset containing your reports/views and that the option completeObjectMode is on true in your report configuration in the optional parameters (see image).
complete object mode option

The complete object mode will allow you to select values from any of your report dataset column using templating. Your image column should contain the exact name of your images in the Assets Panel.

country image
France france_image
USA usa_image

When you will select a report, the image will change !

Note

You can also modify the background image of your app depending on your requester : just go in the advanced parameters and select your report requester and the column of your report dataset containing the name of your image.

Configuration - what it looks like in code mode

{
  type: "image"
  src: `<%= assetUrl(appRequesters.report) %>`
}

The “BGSIZE” option

It is an option available for your image tile with two parameters :

  • cover : I want my image to fill the whole size of the tile
  • contain : I want my image to be refitted to be seen completely in the tile (you might have white margins)