Skip to main content

User Interaction and Control

Interaction

Object containing properties for various interactions and interaction modes

NameDescriptionProperty Type
modeDetermines chart functionalityEnum
panZoomEnables click-and-drag panning as well as pinch-zoomingObject
slopeAllows the user to draw lines and view their slopeObject
xtraceEnables mouse coordinate information when hovered overObject
rangeBrushEnables range-drawing functionalityObject
annotationAllows user to add custom annotation to the chartObject
zoomToAreaAllows the user to draw an area to zoom in toObject

ADD GRAPHIC SHOWING THE ANNOTATION????

Menu

Object containing properties for the cog icon menu

NameDescriptionProperty Type
visibleToggles visibility of the menuBoolean

PlayPause

Object containing properties for the play/pause button

NameDescriptionProperty Type
visibleToggles the visibility of the play/pause buttonBoolean

RangeBrush

Object containing properties for the rangeBrush mode

NameDescriptionProperty Type
visibleToggles the visibility of the range brushBoolean
maxInstancesThe maximum number of concurrent rangesInteger

RangeBrush.Brush

NameDescriptionProperty Type
brushObject containing properties for the range brushObject
fillThe color of the interior of the range brushColor
strokeThe color of the stroke (outline) of the range brushColor
thicknessThe thickness of the range brushInteger
opacityThe opacity of the range brush (1: opaque, 0: invisible) 

RangeBrush.Ranges

NameDescriptionProperty Type
rangesAn array of values representing each rangeArray
  xAxisSets which axis is treated as the x axis 
  startThe x coordinate of the leftmost side of the rangeInteger
  endThe x coordinate of the rightmost side of the rangeInteger

Range properties are stored on a per-axis basis as an array of property objects.


XTrace

NameDescriptionProperty Type
xTraceObject containing properties for the xTrace modeObject
  visibleToggles the visibility of all xTrace mode functionalityBoolean
  showToolTipToggles the visibility of the tooltipBoolean
  showAxisLabelsToggles the visibility of the coordinate labels along the axisBoolean
  showXLineToggles the visibility of the vertical line showing the x coordinate of the mouseBoolean
  showYLineToggles the visibility of the horizontal line showing the y coordinates of the mouseBoolean
  maxInstances???Integer

XTrace.Trace

NameDescriptionProperty Type
traceObject containing properties for tracing functionalityObject
  strokeThe color of the outline of the lines representing the coordinates of the mouseColor
  thicknessThe thickness of the lines representing the coordinates of the mouseInteger
  lineDashAn array holding numeric values representing line dashingArray
  fillThe color of the fill of the lines representing the coordinates of the mouseColor
  lineDashAn array holding numeric values representing line dashingArray
  fontThe font for the text present in xTrace modeFont
  fontSizeThe size of the text present in xTrace modeFloat

Slope

NameDescriptionProperty Type
slopeObject containing properties for the slope modeObject
  visibletoggles the visibility for all slope mode functionalityBoolean
  maxInstancesThe maximum number of concurrent highlightsInteger

Slope.Line

NameDescriptionProperty Type
lineObject containing properties for all present linesObject
  strokeThe color of the outline of slope mode linesColor
  thicknessThe thickness of slope mode linesInteger
  lineDashAn array holding numeric values representing line dashingArray
  opacityThe opacity of slope mode lines (1: opaque, 0: invisible) 

Slope.Label

NameDescriptionProperty Type
labelObject containing properties for the line labelObject
strokeThe color of the outline of the line labelColor
fillThe color of the interior of the line labelColor
fontFamilyThe font family of the text in the line labelString
fontSizeThe size of the text in the line labelFloat

Slope.AxisHighlight

NameDescriptionProperty Type
axisHighlightObject containing properties for the highlights applied to each axis when selectedObject
fillThe color of the axis highlight interiorColor
strokeThe color of the axis highlight outlineColor
thicknessThe thickness of axis highlight outlineInteger

dataProp

Finding the slope between 2 points on the chart is easy using the slope mode


ZoomToArea

NameDescriptionProperty Type
zoomToAreaObject containing properties for the zoomToArea modeObject
axisHighlightToggles the visibility of all zoomToArea functionalityBoolean
animatedToggles whether the zoom is animated or instantBoolean

PanAndZoom

NameDescriptionProperty Type
panAndZoomObject containing properties for the panAndZoom modeObject
visibletoggles the visibility for all zoomPan mode functionalityBoolean
xAxisDragObject containing propertiesObject
enabledDetermines whether dragging on the x axis is enabledBoolean
yAxisDragObject containing propertiesObject
enabledDetermines whether dragging on the y axis is enabledBoolean
zoomExtentsObject containing propertiesObject
enabledDetermines whether zoom extents are enabledBoolean

PanAndZoom.PinchZoom

NameDescriptionProperty Type
pinchZoomObject containing properties for pinch-zoomingObject
enabledToggles pinch-zooming functionalityBoolean
horizontalGrowthFactorAffects the zoom rateFloat
verticalGrowthFactorAffects the zoom rateFloat

PanAndZoom.ZoomPan

NameDescriptionProperty Type
zoomPanObject containing properties for zooming and panningObject
enabledToggles panning functionalityBoolean
axesAn object containing all axes with zoomPan functionality enabled.Object
xAll x axes with zoomPan enabledArray
yAll y axes with zoomPan enabledArray
executeOnThe input that triggers panning 

If the axes prop is left empty, Ignition will behave as though it contains all axes.

PanAndZoom.ZoomPan.xyDirection

NameDescriptionProperty Type
xyDirectionDetermines panning functionality on each axis 
xDirectionAllows panning only on the x axis 
yDirectionAllows panning only on the y axis 
xyDirectionAllows free panning on both axes 

MouseWheelZoom

Object containing properties for mouse wheel zooming

NameDescriptionProperty TypeDefault
enabledDetermines whether mouse wheel zooming is enabledBooleantrue
growFactorDetermines the rate of mouse wheel zooming (Should be set to a small numberFloat0.001
axesAn object containing all axes with zoomPan functionality enabled.Object{}
xAll x axes with mouse wheel zooming enabledArray[]
yAll y axes with mouse wheel zooming enabledArray[]

Overview

NameDescriptionProperty Type
overviewObject containing basic propertiesObject
visibleDetermines visibilityBoolean
height???Integer
axes???Object
x Array
y Array

Annotation

NameDescriptionProperty Type
annotationSets the annotation propertiesObject

Theme

NameDescriptionProperty Type
themeAn object containing formats for the chart theme optionsObject

Theme Members

NameDescriptionProperty Type
lightcontains all the object members relating to the light theme mode 
darkcontains all the object members relating to the dark theme mode 

dataProp

Both the light and the dark themes have the same object members - the difference is the values of each member will likely differ depending on the color and shading requirements of the themeStyle Classes