Like what you see? Have a play with our trial version.

Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Comment: Migration of unmigrated content due to installation of a new plugin

Anchor
top
top

Table of Contents
classcontents

Overview

Styleclass
ClasstopLink

top

This canvas is where Multi-Charts are displayed together, along with a range of available widgets to enhance the chart content. A Multi-Chart canvas can be used for display on:

  1. Reports
  2. Dashboards
  3. Storyboards

To add a Multi-Chart Canvas to a dashboard or storyboard, use the same steps you would with any normal single chart report.

 

HTML
<iframe width="700" height="394" src="https://www.youtube.com/embed/z7FvlSHZtcE?color=white" frameborder="0" allowfullscreen></iframe>

 

Canvas Components

Styleclass
ClasstopLink

top

The Multi-Chart Canvas can contain various widgets as well as charts created in the Charts step of the builder.

 

HTML
<iframe width="700" height="394" src="https://www.youtube.com/embed/F7CuXse8iAk?color=white" frameborder="0" allowfullscreen></iframe>

 

Charts

Any chart created during the Charts step of the report builder can be added to a Multi-Chart canvas. To add a chart to the canvas:

Expand
titleClick to view instructions...
  1. Click on the Multi-Charts Objects panel on the left of the Output step to view a list of available charts and widgets.
  2. Select the chart you wish to add and drag it onto the canvas.

Image

Images can be added to the canvas to add context to the data shown.

 

HTML
<iframe width="700" height="394" src="https://www.youtube.com/embed/kWwFAGOrEvw?color=white" frameborder="0" allowfullscreen></iframe>

 

To add an image to the canvas:

Expand
titleClick to view instructions...
  1. Click on the Multi-Charts Objects panel on the left of the Output step to view a list of available charts and widgets.
  2. Select the Image widget and drag it onto the canvas.
  3. Click the Select Image icon on the widget to choose an image file.
  4. Choose an image file, or upload a new image.
  5. You will now have the selected image displayed in the widget.

Text

Text can be added to the canvas to add context, heading, or notes related to the data shown in charts. To add text to the canvas:

Expand
titleClick to view instructions...
  1. Click on the Multi-Charts Objects panel on the left of the Output step to view a list of available charts and widgets.
  2. Select the Text widget and drag it onto the canvas.
  3. Click the Edit Text icon on the widget to choose an image file.
  4. Type the text you wish to use in the widget and apply formatting as required.
  5. Click the Edit Text icon again to save the changes.
  6. You will now have the text displayed in the widget.

Rectangle

Rectangles can be added to the canvas for use around or behind other widgets. To add a rectangle to the canvas:

Expand
titleClick to view instructions...
  1. Click on the Multi-Charts Objects panel on the left of the Output step to view a list of available charts and widgets.
  2. Select the Rectangle widget and drag it onto the canvas.
  3. Click the Border icon on the widget to define a colour for the outline of the rectangle.
  4. Click the Fill icon on the widget to define a colour for the middle of the rectangle.
  5. Adjust the size and position of the rectangle as needed.

    See #Component Actions for more information.

Icon

Icons can be used to add context and draw attention to data displayed in charts. To add an icon to the canvas:

Expand
titleClick to view instructions...
  1. Click on the Multi-Charts Objects panel on the left of the Output step to view a list of available charts and widgets.
  2. Select the Icon widget and drag it onto the canvas.
  3. Click the Select Icon option on the widget to define the icon used.
  4. Click the Select Icon Colour option to define the colour of the icon used.
  5. Adjust the size and position of the rectangle as needed.

    See #Component Actions for more information.

  6. You will now have an icon displayed in the widget.

Note: icons will not appear in exports or emailed versions of the multi-chart canvas.

Component Actions

Styleclass
ClasstopLink

top

Resize

In order to resize a chart or widget added to the Multi-Chart Canvas, simply drag the bottom-right corner of the component to the desired size.

Reposition

In order to reposition a chart or widget added to the Multi-Chart Canvas, simply click and drag the component to the required area of the canvas.

Send to Back

The order of items displayed on the canvas can be changed by sending some items to the back and others to the front. Click the Send to Back icon on an item you wish to be displayed underneath another.

Bring to Front

The order of items displayed on the canvas can be changed by sending some items to the back and others to the front. Click the Bring to Front icon on an item you wish to be displayed on top of another.

Delete

Once added to the canvas, charts and widgets can be deleted if they are no longer required. Click on the Delete icon to remove an item from the canvas.

Canvas Actions

Styleclass
ClasstopLink

top

Shrink to Fit

Once all the required content has been added to, and positioned on the canvas you have the option to shrink the canvas size to fit the components. This removes any empty space around the edges of the canvas.

Activate

Once all the required content has been added to the canvas and any sizing and position adjustments have been made, the canvas should be activated.

Edit

In order to edit an active canvas, the edit button will need to be clicked.

Resize Guides

When the canvas is being resized by the user guides are displayed to show the standard dashboard and storyboard boundaries. This gives the user an idea of the sizing in relation to where the canvas will be finally displayed.

 

horizontalrule
Styleclass
ClasstopLink

top