Functional explanation
BarGraphObject compares categorical values in bar form. It can be used for production counts, energy categories, downtime reasons, or similar grouped metrics.
The object is useful when category comparison matters more than time-based trend viewing. Keep the category labels concise so they remain readable.
Use it when the page needs a compact grouped comparison instead of a continuous trend line.
Object name
Set the object name shown in the bar graph decorator context.
| Setting | Description | Example | Units |
|---|---|---|---|
| Object Name | Name used to identify the Bar Graph object. | ProductionGraph | Text |
No rows match the filter.
Settings
Configure the chart behavior, orientation, and data source for the bar graph.
| Setting | Description | Example | Units |
|---|---|---|---|
| Animation Speed | Animation speed used by the chart. | 500 | ms |
| Legend Position | Position of the legend. Supported values are Top and Bottom. | Bottom | Enum |
| Orientation | Bar graph orientation. Supported values are Vertical and Horizontal. | Vertical | Enum |
| Value Unit | Unit suffix appended to tooltip values. | pcs | Text |
| Value Format | Number format of the tooltip value, the same patterns as the Format of a variable: 0 shows no decimals, 0.00 always shows two decimals, 0.0## shows one to three decimals and #,##0.00 adds a thousands separator. Empty shows three significant digits, for example 1234.5 as 1.23e+3. | #,##0.0 | Text |
| Show Grid | Shows the grid lines when enabled. | true | Boolean |
| JSON Variable | Variable or expression that provides chart data as JSON. | PLC1.BarGraphData | Expression |
| JSON Dynamic Data | Static JSON payload defining chart series and values. | [{"label":"Line 1","values":[10,20]}] | JSON array |
No rows match the filter.
Colors
Configure the color scheme for the bar graph elements.
| Setting | Description | Example | Units |
|---|---|---|---|
| Background Color | Background color of the chart area. | #f5f5f5 | Color |
| Grid Color | Color of the grid lines. | #e0e0e0 | Color |
| Zero Line Color | Color of the zero-value axis line. | #666666 | Color |
| Axis Line Color | Color of the axis lines. | #333333 | Color |
| Text Color | Text color used for axis labels. | #333333 | Color |
| Tooltip Background | Background color of the tooltip. | rgba(0,0,0,0.8) | Color |
| Tooltip Text Color | Text color of the tooltip. | #ffffff | Color |
No rows match the filter.
Text
Configure the font settings for the legend, category axis, and value axis labels.
| Setting | Description | Example | Units |
|---|---|---|---|
| Legend Font Family | Font family used for the legend text. | Arial | Font family name |
| Legend Font Size | Font size used for the legend text. | 12 | px |
| Legend Font Weight | Font weight used for the legend text. | 400 | CSS font weight |
| Category Axis Font Family | Font family used for category axis labels. | Arial | Font family name |
| Category Axis Font Size | Font size used for category axis labels. | 12 | px |
| Category Axis Font Weight | Font weight used for category axis labels. | 400 | CSS font weight |
| Category Axis Label Rotation | Rotation angle for category axis labels. | 0 | Degrees |
| Value Axis Font Family | Font family used for value axis labels. | Arial | Font family name |
| Value Axis Font Size | Font size used for value axis labels. | 12 | px |
| Value Axis Font Weight | Font weight used for value axis labels. | 400 | CSS font weight |
| Value Axis Label Rotation | Rotation angle for value axis labels. | 0 | Degrees |
No rows match the filter.
Position / Size
Configure the position and size of the Bar Graph object.
| Setting | Description | Example | Units |
|---|---|---|---|
| Top | Top position of the object. | 100 | px |
| Left | Left position of the object. | 220 | px |
| Width | Width of the object. | 420 | px |
| Height | Height of the object. | 240 | px |
| Z-index | Layer order of the object. Higher values appear in front of lower values. | 10 | Number |
No rows match the filter.
Access Control
Configure access control for the Bar Graph object.
| Setting | Description | Example | Units |
|---|---|---|---|
| Access Control Enable | Enables access control evaluation for the object. | true | Boolean |
| Access Control | Expression controlling who can use or see the object. | SYSTEM.UserGroups == "Operators" | Expression |
| Access Control Filter | CSS filter applied when access control is used to alter the object appearance. | blur(0px) contrast(30%) | CSS filter |
No rows match the filter.
Visibility
Configure the runtime visibility and blinking behavior for the Bar Graph object.
| Setting | Description | Example | Units |
|---|---|---|---|
| Visibility | Expression controlling whether the object is visible. | PLC1.BarGraphVisible | Expression |
| Blink | Expression or boolean controlling graph blinking. | PLC1.AlarmActive | Boolean or expression |
| Blink Speed | Blink speed used during runtime. | 500 | ms |
| Blink Offset | Blink offset used to stagger blinking between objects. | false | Boolean |
No rows match the filter.