Pie Chart Component DesignStudio Pro icon

Pie Chart Component

The Pie Chart component allows you to drag and drop a pie chart on the canvas. The pie chart displays data from any field that is added to the Dashboard view. This component is available when you create or select a Dashboard view.

Dashboard views are available in DesignStudio Pro. Contact your Client Success Manager (CSM) for additional information.

Pie Component

See Add Dashboard View Components for details about adding components to a Dashboard view.

Settings

Pie Chart Settings

The following settings are available.

Pie Chart Settings fields
Field Description Procedure

Title

The title that appears above the pie chart, on the top left.

Enter between 2 - 50 alphanumeric characters, excluding special characters.

Chart Legend Type

The legend configuration. See Legends and Labels.

  • Legend: Displays the legend below the chart.

  • Label: Displays the label only, below each chart item.

  • None: Labels and legends are hidden.

Select one of the chart formats.

Field Name

The WebEOC field that is used to render the chart data.

Currently, only single fields, not expressions, are supported.

Select one of the fields.

Theme

The color theme to use in the pie chart.

Select one of the following options.

  • Default

  • Material

  • Summer

  • Winter

  • Spring

  • Autumn

  • Twilight

  • WebEOC List Colors

    These colors are set for list items in WebEOC on the Lists: Edit List Item page. See Create a List for details.

Actions Toolbar

The following actions are available when you select any component on the canvas in the Board Workspace when working with Classic Styling.

Actions descriptions
Icon Name Description Procedure
Settings Icon

Settings

Opens the Settings dialog.

You can modify the component’s settings, such as label, database field name, help text, style, and conditional settings.

  1. In Design mode, click the component on the canvas. A toolbar appears on the top right.

  2. Click the Settings icon.

  3. Modify the fields as needed.

  4. Click Done.
Move Icon

Move

 

This icon is not used.

To move the component, click and drag it to its new location.
Copy Icon

Clone

Copies the current component and its settings, then pastes it after the current component.

  1. In Design mode, click the component on the canvas. A toolbar appears on the top right.

  2. Click the Clone icon.
    The component's Settings dialog opens.

  3. Edit the settings for the cloned component.

  4. Click Done.
Delete Icon

Delete

Deletes the selected component.

  1. In Design mode, click the component on the canvas. A toolbar appears on the top right.

  2. Click the Delete icon.

 

this