Skip to content

Image Component

Overview

An Image component is used to display an image in a report. The image can be a file or base64 encoded string. Must supply either the filename or base64 option. If using a filename, the image file must be supplied as a resource when rendering the image. The following file types are supported: Astc, Avif, Bmp, Dng, Gif, Heif, Ico, Jpeg, Ktx, Pkm, Png, Tiff, Wbmp, Webp.

Schema

key type required description
type string required A string defining the component type as an Image.
filename string optional The file containing the image. Any tokens or JSONata queries in the string will be replaced before attempting to load the file. For example, '@(InstitutionId)/logo.jpg' can be used to load an image from a institution specific folder.
fallbackFilename string optional The file containing the fallback image. The fallback image is used only if the primary image cannot be loaded. Any tokens in the string will be replaced before attempting to load the file. For example, '@(InstitutionId)/logo.jpg' can be used to load an image from a institution specific folder.
base64 string optional The image as a base64 encoded string.
gridRow integer optional The grid row to place the component. Only applicable when inside a GridV2 component.
gridColumn integer optional The grid column to place the component. Only applicable when inside a GridV2 component.
gridRowSpan integer optional The number of rows to span inside the grid. Only applicable when inside a GridV2 component. Default value is 1.
gridColumnSpan integer optional The number of columns to span inside the grid. Only applicable when inside a GridV2 component. Default value is 1.
rowWidth float optional A fixed width for the component inside the row. Only applicable when inside a RowV2 component.
rowRelativeWidth float optional A proportional width for the component inside the row. Only applicable when inside a RowV2 component.
sectionName string optional Marks the component, its contents, and any sub-components as a named section in the report. A section can span multiple pages. The first, last and page count of a section can be inserted into the report using tokens: e.g. $(SECTION_BEGIN_[section-name]), $(SECTION_END_[section-name]) and $(SECTION_COUNT_[section-name]).
sectionLink string optional If defined, the entire component will become a link to a named section in the report. The link will redirect the user to the beginning of the named section in the report.
style string or Style optional Either a style identifier or a style object used to define the layout/styling options for the component. Any textOptions in the style are ignored for this component. For a more detailed explanation of the style system, see Styles.
debug DebugOptions optional Enables highlighting of this component in the report. Useful for debugging layout issues.
condition Conditional optional The component will not be rendered in the report if a condition is present and it evaluates to false. For more information on conditions, see Conditionals.

Example

An example of an Image component:

{
    "type": "Image",
    "filename": "image.jpg"
}