Skip to main content
Version: 7.9

Status Chart

Component Palette Icon:


The Status Chart component allows you to visualize the status of one or more discrete datapoints over a time range. The X-axis is always a timeseries axis, and the Y-axis is a category axis, with one entry per data series. The chart is populated with a single dataset, the first column of which must be a datetime column.

Wide vs Tall Datasets

In Wide format, all of the columns but the first must be numeric. These "series" columns' headers will be used as the names on the y-axis. In Tall format, there should be exactly 3 columns. The first is the timestamp, the second is the series name, and the third is the value. For example:

Wide Format

2010-01-13 8:00:0002
2010-01-13 8:02:0002
2010-01-13 8:04:0012
2010-01-13 8:06:0011
2010-01-13 8:08:0001

Tall Format

2010-01-13 8:00:00Valve10
2010-01-13 8:00:00Valve22
2010-01-13 8:02:00Valve10
2010-01-13 8:02:00Valve22
2010-01-13 8:04:00Valve11
2010-01-13 8:04:00Valve22
2010-01-13 8:06:00Valve11
2010-01-13 8:06:00Valve21
2010-01-13 8:08:00Valve10
2010-01-13 8:08:00Valve21

Color Mapping

Apart from getting the data into the series chart, the only other commonly configured option is the mapping of discrete values to colors. This is done in the Status Chart Customizer. Each named series can have its own mapping of colors, if desired. These mappings are stored in the expert-level dataset property Series Properties Data so they can be altered at runtime.


NameDescriptionProperty TypeScriptingCategory
AntialiasDraw with antialias on? Makes text smoother.boolean.antialiasAppearance
Background ColorThe background color of the component.Color.backgroundAppearance
BorderThe border surrounding this component. NOTE that the border is unaffected by rotation.Border.borderCommon
Chart TitleTitle of this chart.String.chartTitleAppearance
CursorThe mouse cursor to use when hovering over this
Data FormatFormat of the incoming data. In "wide" format, the first column of the dataset needs to be a timestamp, and every subsequent column represents one series in the chart. In "tall" format, the first column is a timestamp, the second column is a series
Data QualityThe data quality code for any tag bindings on this
Date StyleThe style to display dates in. For international
Domain Axis ColorColor used on the domain axis.Color.domainAxisColorDomain Axis
Domain Axis FontFont used on the domain axis.Font.domainAxisFontDomain Axis
Domain Axis LabelLabel on the domain axis.String.domainAxisLabelDomain Axis
Domain Axis LocationLocation of the domain Axis
Mouseover TextThe text that is displayed in the tooltip which pops up on mouseover of this component.String.toolTipTextCommon
NameThe name of this component.String.nameCommon
Properties LoadingThe number of properties currently being loaded. (Read only. Usable in bindings and scripting.)int.propertiesLoadingUncategorized
Range Axis ColorColor used on the range axis.Color.rangeAxisColorRange Axis
Range Axis FontFont used on the range axis.Font.rangeAxisFontRange Axis
Range Axis LabelLabel on the range axis.String.rangeAxisLabelRange Axis
Range Axis LocationLocation of the range Axis
Range Axis Lower MarginLower margin of the range axis.double.rangeAxisLowerMarginRange Axis
Range Axis Upper MarginUpper margin of the range axis.double.rangeAxisUpperMarginRange Axis
Series DataData about each series. Data can be in either "wide" or "tall" format.Dataset.dataData
Series Properties DataProperties for each series.Dataset.propertiesData
Series SpacingAffects the amount of spacing between series. Can be between 0.0 and 1.0. The series present on this chart are given equal space to display themselves. Series spacing is the percentage of that space that they use to do so.double.seriesSpacingAppearance
Show Domain AxisSets whether or not the domain axis is visible.boolean.domainAxisVisibleDomain Axis
Show Range AxisSets whether or not the range axis is visible.boolean.rangeAxisVisibleRange Axis
Time StyleThe style to display times of day. For international
Title ColorColor of the chart title.Color.titleColorAppearance
Title FontFont on the chart title.Font.titleFontAppearance
VisibleIf disabled, the component will be hidden.boolean.visibleCommon


See the Status Chart Scripting Functions page for the full list of scripting functions available for this component.

Event Handlers

Event handlers allow you to run a script based off specific triggers. See the full list of available event handlers on the Component Events page


The Status Chart component has its own customizer, used to set a number-to-color mapping for each series in the Series Data property.

Status Chart Customizer

SeriesSelectable list of all objects in the Series Data property.
  • Wide format: Each non-timestamp column.
  • Tall format: each unique value in the Name column.
Properties TableThe number-to-color mapping for the selected Series.
ValueA numeric value to match against.
ColorThe color to display for the given value.
Apply To AllSet all of the Series mappings to the currently selected mapping.


This example uses the Status Chart to display the state of each of the three machines over the last 5 minutes. Tag History was turned on to record history HOA values. The Series Data property's dataset populates the Status Chart using a Tag History Binding. You can view the raw data by clicking on the Dataset Viewer icon to the right of the Series Data property. Each color represents a state for the machine.

Series Data - Dataset Viewer

Series Properties Data - Dataset Viewer

Each machine has three states, and each of the three states (i.e., HOA) have different colors assigned representing a different state.