Tank
Tank is a UI Component used in Engineering and Scientific applications. It is broadly used to display the fluid levels.
Selector
smart-tank
Properties
animationAnimation
Sets or gets the animation mode. Animation is disabled when the property is set to 'none'
Default valueadvanced
coerceboolean
If is set to true all values coerce to the interval, set in the interval property.
Default valuefalse
customIntervalboolean
Sets or gets whether custom ticks at (possibly) uneven interval will be plotted. The ticks to be plotted are defined with the property customTicks.
Default valuefalse
customTicksnumber[]
If customInterval is enabled, sets a list of ticks to be plotted. If coerce is set to true, the value will snap to these ticks.
dateLabelFormatStringstring
Sets or gets the pattern which labels are displayed in when mode is 'date'.
Default value"d
decimalSeparatorstring
Sets or gets the char to use as the decimal separator in numeric values.
Default value""."
disabledboolean
Enables or disables the widget.
Default valuefalse
intervalany
When cooerce property is true, all values coerce to the interval's value.
Default value1
invertedboolean
Sets the direction of the tank. If is true - positions of the tank's begin and end are changed.
Default valuefalse
labelFormatFunctionany
A callback function that can be used to format the values displayed on the tank labels.
labelsVisibilityLabelsVisibility
Sets or gets the widget's label visibility
Default valueall
localestring
Sets or gets the locale. Used in conjunction with the property messages.
Default value"en
localizeFormatFunctionany
Callback, related to localization module.
logarithmicScaleboolean
Enables or disables the usage of logarithmic scale in the widget.
Default valuefalse
maxany
Sets or gets the maximum value of the widget.
Default value100
mechanicalActionDragMechanicalAction
Sets or gets the type of used mechanical action.
Default valueswitchWhileDragging
messagesany
Sets or gets an object specifying strings used in the widget that can be localized. Used in conjunction with the property locale.
Default value
"en": {
"propertyUnknownType": "'{{name}}' property is with undefined 'type' member!",
"propertyInvalidValue": "Invalid '{{name}}' property value! Actual value: {{actualValue}}, Expected value: {{value}}!",
"propertyInvalidValueType": "Invalid '{{name}}' property value type! Actual type: {{actualType}}, Expected type: {{type}}!",
"elementNotInDOM": "Element does not exist in DOM! Please, add the element to the DOM, before invoking a method.",
"moduleUndefined": "Module is undefined.",
"missingReference": "{{elementType}}: Missing reference to {{files}}.",
"htmlTemplateNotSuported": "{{elementType}}: Browser doesn't support HTMLTemplate elements.",
"invalidTemplate": "{{elementType}}: '{{property}}' property accepts a string that must match the id of an HTMLTemplate element from the DOM.",
"significantPrecisionDigits": "{{elementType}}: the properties significantDigits and precisionDigits cannot be set at the same time.",
"invalidMinOrMax": "{{elementType}}: Invalid {{property}} value. Max cannot be lower than Min.",
"noInteger": "{{elementType}}: precisionDigits could be set only on \"floatingPoint\" scaleType."
}
minany
Sets or gets the minimum value of the widget.
Default value0
modeScaleMode
Sets or gets whether the widget works with numbers or dates.
Default valuenumeric
namestring
Sets or gets the element's name, which is used as a reference when the data is submitted.
Default value"
orientationOrientation
Sets the orientation of the widget
Default valuevertical
precisionDigitsnumber
Determines the number of digits after the decimal point. Applicable only when scaleType is 'integer'.
readonlyboolean
If the widgets is readonly, the users cannot iteract with the element.
Default valuefalse
scalePositionScalePosition
Sets the position of the widget's scales.
Default valuenear
scaleTypeScaleType
Sets the type of the tank's scale.
Default valuefloatingPoint
scientificNotationboolean
Enables or disables scientific notation.
Default valuefalse
showThumbLabelboolean
Enables or disables displaying of the thumb label.
Default valuefalse
showTooltipboolean
Enables or disables displaying of the tooltip.
Default valuefalse
showUnitboolean
Enables or disables displaying of the units.
Default valuefalse
significantDigitsnumber
Determining how many significant digits are in a number. Applicable only when scaleType is 'integer'.
Default value0
themestring
Sets or gets the element's visual theme.
Default value"
thumbLabelPositionPosition
Sets or gets the position of the thumb label.
Default valuenear
ticksPositionTicksPosition
Sets or gets the position of the ticks in smartTank widget.
Default valuescale
ticksVisibilityTicksVisibility
Sets or gets the visibility of the ticks.
Default valueminor
tooltipPositionPosition
Sets or gets the position of the tooltip in smartTank widget.
Default valuenear
unfocusableboolean
Sets or gets if the element can be focused.
Default valuefalse
unitstring
Sets or gets the name of unit used in smartTank widget.
Default value"kg
validationValidation
Sets the value's validation by min/max. If 'strict' is applied, the value is always validated by min and max. If 'interaction' is applied, programmatic value changes are not coerced to min/max and if min/max are changed, resulting in the current value being out of range, the value is not coerced, and no change event is fired.
Default valuestrict
valueany
Sets or gets the value of the smartTank widget.
Default value0
wordLengthWordLength
Sets or gets the word length. Applicable only when scaleType is 'integer'.
Default valueint32
onchange((this: Window, ev: Event) => any) | null
This event is triggered when the value of the tank is changed.
Arguments
evEvent
Methods
focus(): void
Focuses the tank.
getOptimalSize(): any
Gets the optimal size of the widget.
Returnsany
val( value?: string | number): string
Get/set the value of the tank.
Arguments
value?string | number
The value to be set. If no parameter is passed, returns the displayed value of the tank.
Returnsstring