Using a state indicator

Contents[Hide]

1. Overview

A state indicator is a basic data visualization that displays a different color and/or shape depending on the state of your data. States are set up in your metric set to check for conditions in your data that you define, and you can either reuse a metric set with states defined or add states in order to display them in a state indicator.

2. Data preparation

As an example, consider the following metric set which has two states defined using a constant formula value.

Metric set with two states
Metric set with two states

The green bars correspond to a Good state which is defined as line total values greater than or equal to a constant formula value of 2,000,000 (or 2M) for a particular month. The red bars correspond to a Bad state which is defined as line total values less than this constant value.

Setup for the metric set's Good state
Setup for the metric set's Good state

3. Create a dashboard

State indicators are typically sized very small and combined with other visualizations rather than visualized on their own. For this example, create a new dashboard from the main menu.

Drag the metric set from the Explore window to the canvas. It will appear as a bar chart like the one displayed in the full-screen editor.

Add the metric set to the dashboard
Add the metric set to the dashboard

The purpose of the chart in this example is just for confirmation that the state indicator (to be added later) shows the expected result.

4. Add a state indicator

Go to the toolbar, click Data Visualization, and then select State Indicator.

Add a state indicator from the toolbar
Add a state indicator from the toolbar

An empty state indicator appears on the canvas without any data. To add our existing metric set, we drag it from the Explore window onto the state indicator.

Drag the metric set onto the empty state indicator
Drag the metric set onto the empty state indicator

You can also drag data directly from a data source onto a state indicator, but will then need to set up states. You can click States in the Properties window as a shortcut.

The state indicator is now connected to data and appears as an ellipse (circle) by default.

State indicator appears as an ellipse
State indicator appears as an ellipse

With the state indicator selected on the canvas, go to the toolbar, click Filter, and then select Calendar. This connects the filter just to the state indicator by default.

In the Filter Visualizations panel, click the Default Value dropdown and select a month with data.

Add a calendar filter for the state indicator
Add a calendar filter for the state indicator

The purpose of the calendar filter in this example is to show the effect on a state indicator control when the filter is set to different months (e.g., there are good and bad months concerning the monthly line total).

Switch to View mode and use the calendar filter. You'll see the state indicator change color accordingly and you can verify that this is correct by comparing against the chart.

The state indicator shows the Good state when May is selected
The state indicator shows the Good state when May is selected

The state indicator shows the Bad state when June is selected
The state indicator shows the Bad state when June is selected

5. State styles

When you add a metric set with states to a state indicator, the State Group is automatically set and State Styles are added for each state in the Properties window.

State styles are automatically added
State styles are automatically added

Click on a state style to edit its properties, such as Symbol and Fill in the Look tab.

Editing a state style's appearance
Editing a state style's appearance

Each state style also has other properties such as:

  • State - Identifies the metric set state associated with this state style (e.g., Good).
  • Tooltip - Displays text in a popup when viewers hover over or long-taps the state indicator. This can display more details, including values from your data (in Dundas BI 8 and higher).
  • Legend Text - The text to be displayed to identify this state in a legend if you add and connect one.
  • Background Symbol - Can be used to layer the main Symbol on top of another symbol, such as a Dash on top of an Ellipse. The Padding property can be used to make the foreground symbol smaller.
  • Enable Animation - Use with the Symbol Animated Fill property to call attention to particular states by repeatedly fading back and forth between two different fill colors.
  • Text - Displays text over the symbol, optionally including values from your data (in Dundas BI 8 and higher). To display text outside the symbol, consider using a data label or a table's text column as an alternative.

State style properties in the Main tab
State style properties in the Main tab

5.1. Using an image for a state

Instead of displaying a built-in symbol for each state, you can upload and use your own images for the different states.

To do this, first prepare your images (one for each state) and upload them as image resources to Dundas BI.

Image for the Good state
Image for the Good state

For example, drag a PNG image file from your computer to the Dundas BI Explore window, or right-click/long-tap the Images folder and select Upload File.

Image resources
Image resources

Next, edit the properties of each state style. Go to the Look section and do the following:

  • Set Symbol to Rectangle.
  • Expand the Fill property and set its Brush to Image.
  • Click Select Image and choose the image resource you previously uploaded.

State style properties for image option
State style properties for image option

6. See also

Dundas Data Visualization, Inc.
500-250 Ferrand Drive
Toronto, ON, Canada
M3C 3G8

North America: 1.800.463.1492
International: 1.416.467.5100

Dundas Support Hours:
Phone: 9am-6pm, ET, Mon-Fri
Email: 7am-6pm, ET, Mon-Fri