Creating image objects
You can add an Image object to the sheet you are editing.
Do the following:
- In the assets panel, open Charts.
- Under Dashboard objects, drag an Image to the sheet.
- In the properties panel, expand Image.
- Under Image source, select one of the following:
Media library: Click
to select or upload an image from the media library.
URL: Specify the URL containing the image you want to use.
Information noteTo add an image from a URL, the URL's origin needs to be added to the allowlist in your tenant's Content Security Policy. The origin must be added with the following Directive: img-src. This is done by a tenant administrator.
For more information, see Creating a CSP entry.
After creating the image object, you can further customize its appearance in the properties panel. See the sections below.
Modifying the image appearance
You can change how the image appears on the sheet.
Do the following:
- In the properties panel, expand Image.
- Configure the following properties:
- Image fit: Set how the image is sized. For example, you can keep it at its original size, choose various fit options, or stretch it to fit the object size on the sheet.
- Image position: Set where the image is placed in the sheet object.
- Rotation: Specify a number of degrees to rotate the image.
- Mirror image: Choose whether the image is flipped along its vertical axis.
- Repeat image: Choose whether the image should be repeated within the object if, at its current size, it does not fill the entire frame.
- Opacity: Set the degree to which the image appears opaque or transparent.
- Image tooltip: Define text that will display as a tooltip when users hover their cursor over the image.
Customizing styling
You have a number of styling options available under Appearance in the properties panel.
Click Styling under Appearance > Presentation to further customize the styling of the chart. You can reset your styles by clicking
next to each section. Clicking
Reset all resets styles for all available tabs in the styling panel.
For general information about styling an individual visualization, see Applying custom styling to a visualization.
Customizing the text
You can set the text for the title, subtitle, and footnote under Appearance > General. To hide these elements, turn off Show titles.
The visibility of the different labels on the chart depends on chart-specific settings and label display options. These can be configured in the properties panel.
You can style the text that appears in the chart.
Do the following:
-
In the properties panel, expand the Appearance section.
-
Under Appearance > Presentation, click
Styling.
-
On the General tab, set the font, emphasis style, font size, and color for the following text elements:
-
Title
-
Subtitle
-
Footnote
-
Customizing the background
You can customize the background of the chart. The background can be set by color and image.
Do the following:
-
In the properties panel, expand the Appearance section.
-
Under Appearance > Presentation, click
Styling.
-
On the General tab of the styling panel, you can select a background color (single color or expression). You can also set the background to an image from your media library or from a URL.
Information noteTo add a background image from a URL, the origin must be added to the allowlist in your tenant's Content Security Policy. Add the origin with the img-src directive. This is done in the Administration activity center by an administrator.
For more information, see Creating a CSP entry.
When using a background color, use the slider to adjust the opacity of the background.
When using a background image, you can adjust image sizing and position.
Customizing the border and shadow
You can customize the border and shadow of the chart.
Do the following:
-
In the properties panel, expand the Appearance section.
-
Under Appearance > Presentation, click
Styling.
-
On the General tab of the styling panel, under Border, adjust the Outline size to increase or decrease the border lines around the chart.
-
Select a color for the border.
-
Adjust the Corner radius to control the roundness of the border.
-
Under Shadow in the General tab, select a shadow size and color. Select None to remove the shadow.
...