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 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 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. |
|
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. |
|
Enabled | Appearance | Specifies if the graphic element is available on the HMI device and if the graphic element accepts touch and key input. |
|
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. |
|
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