Gauge Chart Component DesignStudio Pro icon

Gauge Chart Component

The Gauge Chart component allows you to drag and drop a gauge chart on the canvas. The gauge chart displays the result of an expression. 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.

Gauge Chart

The Gauge 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.

Gauge Chart Settings Window

The following settings are available.

Gauge Chart Settings fields
Field Description Procedure

Title

The title that appears above the chart.

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

The expression. For information about expressions in WebEOC, see <expression>.

Enter the expression.
Style: Add a range  

  1. Click Add a range +. The first tier appears.

  2. Click the pencil icon, and then enter the following information:

    1. Click the colored square and from the color picker, select a color to represent the range on the gauge.

    2. Enter a label that identifies the range.

    3. Enter the minimum and maximum values for the range.

    4. Click the checkmark.

    5. Repeat step 2 for each range you want to add.

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.

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
Icon Name Description Procedure
Settings Icon

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.

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

  2. Click the Settings icon. The Properties tab displays on the right next to the Components tray.

  3. Update the settings as needed.

    Changes display in real time.

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 Properties tab displays on the right next to the Components tray.

  3. Edit the settings for the cloned component.

    Changes display in real time.

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.