Image Chart

Intro

Image Charts allow you to use an image URL column in your data to dynamically display images based on the data being filtered on a dashboard or app page without having to concatenate an HTML element. Before the data is filtered to a particular image, or if more than one row is selected, you can include a URL to display a default image.

For example, if you filter to a specific brand, the Image Chart dynamically updates to display the brand logo. Or, if you filter to a specific person, you can use an Image Chart to display that individual’s avatar.

---

Power Image Charts

The Image Chart requires an image URL.

Use the chart properties to construct an image URL. For example, if your data only contains a column for the ID, you must provide the URL prefix/suffix. See Customize Image Charts for more information about the prefix/suffix.

Note: You can also add a default URL in case multiple rows of data are returned.

For example, if you’re using your Image Chart to show brand logos, you might want to show a generic icon when no brand is chosen or when multiple brands are chosen.

Customize Image Charts

You can customize the appearance of an Image Chart by editing its General chart properties. To learn about all chart properties, see Chart Properties in the Knowledge Base.

The unique properties of an Image Chart include the following:

Property	Description	Example
Image fit	This determines whether the image will be scaled to fit within the card’s space or to fill the card’s space. The default is Fit Content.	—
Default image URL	If a URL is provided, the default image is displayed when more than one row of data is selected.	—
Url prefix	The prefix to be added to the beginning of the URL passed in from the data. This may be << https://images/>> ;, for example.	—
Url suffix	The suffix to be added to the end of the URL passed in from the data. This may be <<.png>>, for example.	—