Gauges

The
Gauges
category under
GeneralEquipment
in the
Toolbox
contains bar graphs, including spider charts, and gauges commonly used in a manufacturing system.
Use a bar graph or gauge to display a value from a controller by moving the needle or filling a bar on a graph. Animate the graphic element to display values or move a needle. Bind the built-in animation properties of the graphic element to tags in the controllers.
Built-in animation properties
Built-in animation properties appear under the
General
category of the
Properties
window. Specify values for these properties in order to animate the graphic element or change the information the graphic element shows on the HMI device.
Not all graphic elements in this category have the same properties. The built-in animation properties of a graphic element in this category depend on the graphic element selected. For graphic elements with more than one indicator, a value pertains to a certain side of a graphic element. For example the MaxValue property for certain graphic elements may be LeftMaxValue or RightMinValue and Value may be LeftValue. Configure left and right value properties to affect a needle or bar on the indicated side of the graphic element.
Name
Category
Purpose
Accepted values
LeftMaxValue
General
Specifies the maximum value for left side of the graphic element.
Any numeric value greater than the LeftMinValue property value
LeftMinValue
General
Specifies the minimum value for the left side of the graphic element.
Any numeric value less than the LeftMaxValue property value
LeftValue
General
Specifies the current position of the needle on the left side of the gauge.
Bound tag
MaxValue
General
Specifies the maximum value on the graphic element.
Any numeric value greater than the MinValue property value
MinValue
General
Specifies the minimum value on the graphic element.
Any numeric value less than the MaxValue property value
RightMaxValue
General
Specifies the maximum value for the right side of the graphic element.
Any numeric value greater than the RightMinValue property value
RightMinValue
General
Specifies the minimum value for the right side of the graphic element.
Any numeric value less than the RightMaxValue property value
RightLevel
General
Specifies the level of the bar on the right side of the graph.
Bound tag
Value
General
Specifies the value of the graphic element.
Bound tag
Unique properties
Unique properties are properties that not all graphic elements in the
Toolbox
share.
Not all graphic elements in this category share the same unique properties. The unique properties of a graphic element depend on the graphic element selected.
Name
Category
Purpose
Accepted values
FillColor
Appearance
Specifies the fill color.
Any selected color in the
Color Picker
or a Hex color value entered manually. The Hex value must be in the format #RRGGBB. R, G, and B are Hex digits from 0 through F and represent the color channel values for red, green, and blue. For example, #ffff00 produces yellow.
FillOpacity
Appearance
Specifies the transparency of the fill color.
0 (fully transparent) - 100 (fully opaque)
FontColor
Appearance
Specifies the color of the text.
Any selected color in the
Color Picker
or a Hex color value entered manually. The Hex value must be in the format #RRGGBB. R, G, and B are Hex digits from 0 through F and represent the color channel values for red, green, and blue. For example, #ffff00 produces yellow.
FontName
Appearance
Specifies the font of the text.
Any selected font
FontSize
Appearance
Specifies the size of the text.
Positive numbers
HighColor
Appearance
Specifies the color of the high zone on the gauge.
Any selected color in the
Color Picker
or a Hex color value entered manually. The Hex value must be in the format #RRGGBB. R, G, and B are Hex digits from 0 through F and represent the color channel values for red, green, and blue. For example, #ffff00 produces yellow.
HousingColor
Appearance
Specifies the color of the housing.
Any selected color in the
Color Picker
or a Hex color value entered manually. The Hex value must be in the format #RRGGBB. R, G, and B are Hex digits from 0 through F and represent the color channel values for red, green, and blue. For example, #ffff00 produces yellow.
LevelColor
Appearance
Specifies the color of the fill level.
Any selected color in the
Color Picker
or a Hex color value entered manually. The Hex value must be in the format #RRGGBB. R, G, and B are Hex digits from 0 through F and represent the color channel values for red, green, and blue. For example, #ffff00 produces yellow.
LeftLevelColor
Appearance
Specifies the level color of the bar on the left side of the graph.
Any selected color in the
Color Picker
or a Hex color value entered manually. The Hex value must be in the format #RRGGBB. R, G, and B are Hex digits from 0 through F and represent the color channel values for red, green, and blue. For example, #ffff00 produces yellow.
LowColor
Appearance
Specifies the color of the low zone.
Any selected color in the
Color Picker
or a Hex color value entered manually. The Hex value must be in the format #RRGGBB. R, G, and B are Hex digits from 0 through F and represent the color channel values for red, green, and blue. For example, #ffff00 produces yellow.
MediumColor
Appearance
Specifies the color of the medium zone on the gauge.
Any selected color in the
Color Picker
or a Hex color value entered manually. The Hex value must be in the format #RRGGBB. R, G, and B are Hex digits from 0 through F and represent the color channel values for red, green, and blue. For example, #ffff00 produces yellow.
NeedleColor
Appearance
Specifies the color of the needle.
Any selected color in the
Color Picker
or a Hex color value entered manually. The Hex value must be in the format #RRGGBB. R, G, and B are Hex digits from 0 through F and represent the color channel values for red, green, and blue. For example, #ffff00 produces yellow.
RightLevelColor
Appearance
Specifies the color of the bar on the right side of the graph.
Any selected color in the
Color Picker
or a Hex color value entered manually. The Hex value must be in the format #RRGGBB. R, G, and B are Hex digits from 0 through F and represent the color channel values for red, green, and blue. For example, #ffff00 produces yellow.
TextOpacity
Appearance
Specifies the transparency of the text.
0 (fully transparent) - 100 (fully opaque)
TickMarkColor
Appearance
Specifies the color of the tick marks.
Any selected color in the
Color Picker
or a Hex color value entered manually. The Hex value must be in the format #RRGGBB. R, G, and B are Hex digits from 0 through F and represent the color channel values for red, green, and blue. For example, #ffff00 produces yellow.
TickMarkOpacity
Appearance
Specifies the transparency of the tick marks.
0 (fully transparent) - 100 (fully opaque)
WarningColor
Appearance
Specifies the color of the warning zone.
Any selected color in the
Color Picker
or a Hex color value entered manually. The Hex value must be in the format #RRGGBB. R, G, and B are Hex digits from 0 through F and represent the color channel values for red, green, and blue. For example, #ffff00 produces yellow.
Common properties
Common properties exist for all graphic elements.
Property
Category
Purpose
Accepted Values
Access
Security
Specifies if all users have access to the control element, or if access is inherited from the screen.
  • Inherit - Access inherited from screen.
  • Full Access - Access granted to all users.
Angle
Position and Size
Specifies the rotation angle.
Enter 180 to display the graphic element upside down. If you enter a value larger than 360, the portion of numeric value that is over 360 becomes the value. For example, enter 380 to see a value of 20. If you enter a value less than 0, the negative value is subtracted from 360. For example, enter -30 to see a value of 330.
  • Numbers 0 to 360
Enabled
Appearance
Specifies if the graphic element is available on the HMI device and if the graphic element accepts touch and key input.
  • Enabled - selected
  • Not Enabled - cleared
Height
Position and Size
Specifies the height in pixels.
Any positive numeric value
Opacity
Appearance
Specifies the transparency of the graphic element.
0 (fully transparent) - 100 (fully opaque)
Visible
Appearance
Specifies if the graphic element is visible on the HMI device.
  • Visible - selected
  • Not visible - cleared
Width
Position and Size
Specifies the width in pixels.
Any positive number
X
Position and Size
Specifies the horizontal coordinate, in pixels, from the upper left corner of screen to the upper left corner of a graphic element or group with no rotation. If the graphic element or group is rotated, the X property value does not change.
Any positive number
Y
Position and Size
Specifies the vertical coordinate, in pixels, from the upper left corner of screen to the upper left corner of a graphic element or group with no rotation. If the graphic element or group is rotated, the Y property value does not change.
Any positive number
Provide Feedback
Have questions or feedback about this documentation? Please submit your feedback here.
Normal