Skip to main content
Version: 8.3

Perspective - Vessel

Component Palette Icon:

An animated component that looks like a tank or vessel. Options include displaying fill level, the stand, and the agitator. Full menu of style options is available for text, background, margin and padding, border, shape and miscellaneous. You can also specify a style class.

Properties

Most Properties have binding options. For more information on Bindings, see Types of Bindings in Perspective. This section only documents the Props Category of properties. The other Categories are described on the Perspective Component Properties page.

NameDescriptionProperty Type
appearanceOptions for the appearance of the component. Options are auto, p&id, mimic, and simple. If set to auto, the value is taken from the Perspective Session Property symbols.autoAppearance. 

value: string
animationSpeedThe speed of the animation as a percent. Set to "0" to turn off animation. If set to auto, the setting is taken from the Perspective Session Property symbols.autoAnimationSpeed.value: numeric
stateState of the animation. Built-in options are default, running, stopped, or faulted. Default is default.

Built-in states and new states can be configured and applied on the Project Properties > Symbols page.
value: string
orientationOrientation of the vessel. Options are horizontal or vertical. Default is vertical.value: string
displayStandWhether or not to display the stand for the vessel. Default is true.value: boolean
displayAgitatorWhether or not to display the agitator in the vessel. Default is true.value: boolean
displayFillLevelWhether or not to display the fill level of liquid in the vessel. Default is true.value: boolean
liquidColorColor used to render the filled part of the vessel. Can be chosen from color wheel, chosen from color palette, or entered as RGB or HSL value. See Color Selector.color
liquidOpacityThe opacity of the liquid in the tank. 0 is fully transparent, 1 is fully opaque. Default is 0.7.value: numeric
liquidWarningColorThe warning color of the liquid in the tank. See Color Selector.color
labelLabel settings for the component. 
  • text: Text for the label. Value is string.
  • location: Label position relative to the vessel: top, bottom, left, right, or hidden. Default is bottom. Value is string.
  • justify: Label text justification: left, center, right, or auto. Default is center. Value is string.
  • style: Modify label text style using the style properties. Full menu of style options is available for text, background, margin and padding, border, shape and miscellaneous. You can also specify a style class
object
valueValue settings for the component.
     
  • displayValueAsPercent Whether or not to display the value as a percentage. Value is boolean.
  • value Text to display as value. Value is string.
  • capacity Total capacity of the vessel. Default is 100. Value is numeric.
  • location Value location relative to the vessel: top, bottom, right, or left. Default is bottom. Value is string.
  • justify Value text justification: center, left, or right. Default is center. Value is string.
  • style: Sets a style for the value. Full menu of style options is available for text, background, margin and padding, border, shape and miscellaneous. You can also specify a style class.
object
styleSets a style for this cylindrical tank. Full menu of style options is available for text, background, margin and padding, border, shape and miscellaneous. You can also specify a style class.object

Component Events

The Perspective Event Types Reference page describes all the possible component event types for Perspective components. Not all component events support each Perspective component. The Component Events and Actions page shows how to configure events and actions on a Perspective component. Component scripting is handled separately and can be accessed from the Component menubar or by right clicking on the component.

Example

PropertyValue
props.orientationhorizontal
props.displayStandtrue
props.liquidColor#00ACAC
props.label.textLower Tank 23
props.label.locationbottom
props.label.style.fontWeightbold
props.label.style.color#804600
props.value.value35
props.value.capacity100
props.value.locationtop
props.value.style.color#00ACAC
props.value.style.fontFamilyRoboto
props.value.style.fontSize18
props.value.style.fontWeightbold