Donut Chart Component

The Donut Chart component allows you to drag and drop a donut chart on the canvas. 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.

Donut Component

The Donut Chart component is found in the Data Visualization section of the Components tray.

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

Settings

If you use the Classic Styling, these settings are set in a dialog that opens after you drop the component on the canvas. If you are using the Nexus Component Styling, these settings are set on the Properties tab after you drop the component on the canvas.

Donut Chart Settings

The following settings are available.

Donut Chart Settings fields
Field	Description	Procedure
Title	The title that appears above the donut chart.	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	A 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 donut 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
Name	Description	Procedure
Settings	Opens the Settings dialog. You can modify the component’s settings, such as label, database field name, help text, style, and conditional settings.	In Design mode, click the component on the canvas. A toolbar appears on the top right. Click the Settings icon. Modify the fields as needed. Click Done.
Move		This icon is not used. To move the component, click and drag it to its new location.
Clone	Copies the current component and its settings, then pastes it after the current component.	In Design mode, click the component on the canvas. A toolbar appears on the top right. Click the Clone icon. The component's Settings dialog opens. Edit the settings for the cloned component. Click Done.
Delete	Deletes the selected component.	In Design mode, click the component on the canvas. A toolbar appears on the top right. Click the Delete icon.

Actions Toolbar

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

Actions descriptions
Name	Description	Procedure
Settings	Opens the Properties tab next to the Components Tray. You can modify the component’s settings, such as label, database field name, help text, style, and conditional settings.	In Design mode, click the component on the canvas. A toolbar appears on the top right. Click the Settings icon. The Properties tab displays on the right next to the Components tray. Update the settings as needed. Changes display in real time.
Move		This icon is not used. To move the component, click and drag it to its new location.
Clone	Copies the current component and its settings, then pastes it after the current component.	In Design mode, click the component on the canvas. A toolbar appears on the top right. Click the Clone icon. The Properties tab displays on the right next to the Components tray. Edit the settings for the cloned component. Changes display in real time.
Delete	Deletes the selected component.	In Design mode, click the component on the canvas. A toolbar appears on the top right. Click the Delete icon.

Donut Chart Component

Settings

Actions Toolbar

Actions Toolbar

Sorry about that

Great!