Search

User Manual

Getting Started


Modules and Platform


Appendix


Tutorials & Helpful Tricks


Glossary


Strategic Partner Links

Sepasoft - MES Modules
Cirrus Link - MQTT Modules

Resources

Inductive University
Ignition Demo Project
Knowledge Base Articles
Forum
IA Support
SDK Documentation
SDK Examples

All Manual Versions

Ignition 8
Ignition 7.9
Ignition 7.8

Deprecated Pages

Skip to end of metadata
Go to start of metadata

General

Component Palette Icon:




IULocgo


XY Chart

Description

The XY Chart displays data trends. It provides a flexible way to display either timeseries or X-Y charts that are powered by any number of datasets, entered in the dataSources property. It is fully customizable in its appearance, from labels, colors, line widths, legend, scroll bars, text styles, and more.

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
dataSourcesObjects that are the data source for the chart.array
title

Chart title configuration.

 Click here for the title properties
NameDescriptionProperty Type
textThe chart title text.value: string
appearance

Appearance related title options.

NameDescriptionProperty Type
colorColor for the title.value: string
font

Font settings.

NameDescriptionProperty Type
sizeSpecifies the size of the font in pixels (px) or points (pt). If you enter just a number, Perspective assumes the value is in pixels.value: numeric
weightSets how thick or thin characters in the text are displayed.value: numeric
object
paddingPadding space around the title. Values can be set for the top, bottom, left, and right.object



value: string
subtitle

Chart subtitle configuration.

 Click here to see the subtitle properties
NameDescriptionProperty Type
textThe chart subtitle text.value: string
appearance

Appearance related subtitle settings.

NameDescriptionProperty Type
colorColor for the title.value: string
font

Font settings.

NameDescriptionProperty Type
sizeSpecifies the size of the font in pixels (px) or points (pt). If you enter just a number, Perspective assumes the value is in pixels.value: numeric
weightSets how thick or thin characters in the text are displayed.value: numeric

paddingPadding space around the subtitle. Values can be set for the top, bottom, left, and right.object


legend

Settings for the chart legend.

 Click here to see the legend properties
NameDescriptionProperty Type
enabledWhether the legend is enabled for this chart. Default is true (enabled).value: boolean
positionWhere the legend is located in relation to the chart (left, right, top, bottom, or absolute). Default is bottom.value: string dropdown
absoluteSettings used to position the legend when the position property is set to absolute.Values can entered for x and y.object
markers

Settings for the makers.

NameDescriptionProperty Type
enabledEnables all series markers used in the legend.value: boolean
widthThe width of each marker, in pixels.value: numeric
heightThe height of each marker, in pixels.value: numeric
mirrorLookOfSeriesMarkers will be drawn to mirror the look of the series elements. Important: Customizing markers beyond width and height requires that this value is set to false.value: boolean
stroke

Settings for the marker line stroke.

NameDescriptionProperty Type
colorMarker line stroke color.value: string
widthMarker line stroke width.value: numeric
opacityMarker line stroke opacity. 0 is fully transparent, 1 is fully opaque.value: numeric


object
cornerRadiusCorner radius applied to the rectangle marker. Values can be set for the topLeft, topRight, bottomLeft, and bottomRight.value: string dropdown
icon
NameDescriptionProperty Type
pathShorthand path to the icon source, in this format: library/iconName.value: string
colorColor of the icon.value: string
verticalCenterThe vertical anchor point for the icon. Options are none, top, middle, bottomvalue: string dropdown
horizontalCenterThe horizontal anchor point for the icon. Options arenone, left, middle, rightvalue: string dropdown
widthWidth of the icon.value: numeric
heightHeight of the icon.value: numeric
object
object
labels
NameDescriptionProperty Type
textA template string which is applied to all the labels. Default is [bold]{name}[/]value: string
font

Font settings for the labels.

NameDescriptionProperty Type
weightThe weight of the font.value: numeric
colorThe color of the font.value: string
sizeThe font size.value: numeric
object

object
cursor

Settings for the chart cursor.

 Click here to see the cursor properties
NameDescriptionProperty Type
enabledEnables all chart cursors that are set to show.value: boolean
seriesBinds the chart cursor to a specified series' data source.value: string
lineX

The chart cursor configuration for the line that intersects the X axis. Options as follows:

NameDescriptionProperty Type
enabled The chart cursor configuration for the line that intersects the X axis.
value: boolean
stroke

Settings for the stroke. Options as follows:

NameDescriptionProperty Type
colorCursor line stroke color. See Color Selector.color
widthCursor line stroke widthvalue: numeric
opacityCursor line opacity. 0 is fully transparent, 1 is fully opaque.value: numeric
dashArraySVG dashed array. The pattern of dashes and gaps used to paint the stroke. It's a list of comma separated lengths (in pixels) and percentages (percentage of the total stroke length) that specify the lengths of alternating dashes and gaps. If an odd number of values is provided, then the list of values is repeated to yield an even number of values. Thus, "5,3,2" is equivalent to "5,3,2,5,3,2".array
object
object
lineY

The chart cursor configuration for the line that intersects the Y axis. Options as follows:


NameDescriptionProperty Type
enabledThe chart cursor configuration for the line that intersects the Y axis.value: boolean
stroke

Settings for the stroke. Options as follows:

NameDescriptionProperty Type
colorCursor line stroke color. See Color Selector.color
widthCursor line stroke widthvalue: numeric
opacityCursor line opacity. 0 is fully transparent, 1 is fully opaque.value: numeric
dashArraySVG dashed array. The pattern of dashes and gaps used to paint the stroke. It's a list of comma separated lengths (in pixels) and percentages (percentage of the total stroke length) that specify the lengths of alternating dashes and gaps. If an odd number of values is provided, then the list of values is repeated to yield an even number of values. Thus, "5,3,2" is equivalent to "5,3,2,5,3,2".array
object
integer
object
enableTransitionsWhether the transition animations are enabled for this chart. Default is false (disabled).boolean
scrollBars

Configuration for the scroll bars on the chart. Options as follows:

 Click here to see the scrollBars properties
NameDescriptionProperty Type
horizontal

Settings for horizontal scrollbars. Options as follows:

NameDescriptionProperty Type
enabled Whether the horizontal scrollbar is enabled for this chart. Default is true (enabled).value: boolean
series Binds the horizontal scroll bar to a series.array
object
vertical

Settings for vertical scrollbars. Options as follows:

NameDescriptionProperty Type
enabledWhether the vertical scrollbar is enabled for this chart. Default is true (enabled).value: boolean
seriesBinds the vertical scroll bar to a series.array
object
object
background

Configuration for the background of the chart.

 Click here to see the background properties
NameDescriptionProperty Type
renderSets the render mode for the chart background. Options are none, gradient, or color. Default is none.value: string dropdown
gradient

Sets the gradient configuration for the chart background. Options are:

NameDescriptionProperty Type
direction Sets the direction of the gradient. Options are linear or radial.value: string dropdown
rotation Gradient rotation. Applies only to the linear gradient. Default is 0.value: numeric
colors

Colors to be used in the gradient.

array
object
colorColor to be used in background if color property is set under render. Can be chosen from color wheel, chosen from color palette, or entered as RGB or HSL value.color
opacityOpacity of background of the chart. 0 is fully transparent, 1 is fully opaque.value: numeric
object
xAxes

Configuration properties for the X Axes of the chart. Options as follows:

 Click here to see the xAxes properties
NameDescriptionProperty Type
nameA unique name to identify this axis configuration object. This field is required in order to configure the series.value: string
label

Enables or disables a label for the x axis.

NameDescriptionProperty Type
enabledEnables a label drawn alongside this axis.value: boolean
text Label text.value: string
colorLabel color. Can be chosen from color wheel, chosen from color palette, or entered as RGB or HSL value. See Color Selector.color
object
inversedIndicates if the scale of the axis should be flipped.value: boolean
visibleMake the label visible, if label is enabled.value: boolean
tooltip

Tool tip configuration for the axis. Options as follows:

NameDescriptionProperty Type
enabled Enables the tooltip. Default is true.value: boolean
text Tooltip text.value: string
cornerRadius Radius for the corner of tooltip.value: numeric
pointerLength Length (in pixels) for the pointer on the tooltip.value: numeric
background Configuration for the color and opacity of the background of the tooltip. See Color Selector.color
object
renderSets the axis type to render. Options are category, date, or value. Default is date.value: string dropdown
category

Category axis configuration. Applied when render is set to category. Groups data items into categories and allots equal space for each. Break settings tell the category axis to remove a certain range from its scale. Options as follows:

NameDescriptionProperty Type
enabled Enables a break range. Default is false.value: boolean
startCategory Start point of the break.value: string 
endCategory End point of the break.value: string 
size The break size as a decimal percentage of the removed values.value: numeric
object
date

Date axis configuration. Applied when render is set to date. Uses data and time scale. Options as follows:

NameDescriptionProperty Type
baseInterval Adjusts the granularity of the time scale. Otherwise will adjust intelligently by default. Options as follows:
NameDescriptionProperty Type
enabledEnables or disables baseInteval.value: boolean
timeUnitSpecifies the base time to apply to this time scale. Options are minute, second, hour, day, week, or year.value: string dropdown
countSpecifies how many time units each data item was collected.value: numeric
skipEmptyPeriodsRemoves empty time units from display. Using this feature affects performance. Will reset the use of axis breaks if true.value: boolean
object
range

You can optionally adjust the date range. Otherwise will auto adjust by default. Options as follows:

NameDescriptionProperty Type
maxMaximum date in this range.value: string
minMinimum date in this range.value: string
useStrictStrictly enforces start and end values.value: boolean


object
break

Tells the date axis to remove a certain range from its scale. Options as follows:

NameDescriptionProperty Type
inputFormatSets the date format of the axis value from the data source.value: string dropdown
formatSets the date format for the axis labels.value: string dropdown


object



object
value

Value axis configuration. Applied when render is set to date. Uses data and time scale. Options as follows:

NameDescriptionProperty Type
range

You can optionally adjust the date range. Otherwise will auto adjust by default. Options as follows:

NameDescriptionProperty Type
maxMaximum date in this range.value: string
minMinimum date in this range.value: string
useStrictStrictly enforces start and end values.value: boolean
object
logarithmicUse logarithmic scale. Useful if data varies greatly within the relevant series. Default is false.value: boolean
break

Tells the value axis to remove a certain range from its scale. Options as follows:

NameDescriptionProperty Type
enabledEnables a break range. Default is false.value: boolean
startValueStart point of the break.value: numeric
endValueEnd point of the break.value: numeric
sizeThe break size as a decimal percentage of the removed values.value: numeric


object
formatA number format string to be applied against numbers if in number rendering mode. Options are number, integer, four decimal precision, percent, scientific, currency, currency (rounded), or abbreviation.value: string dropdown
object
appearance

Appearance options for the x axis. Options as follows:

NameDescriptionProperty Type
opposite Renders the axis on the opposite side. Default is falsevalue: boolean
inside Renders the axis labels on the inside of the axis. Default is false.value: boolean
labels

Axis label configuration:

NameDescriptionProperty Type
colorAxis label color.color
opacityAxis label opacity.value: numeric
rotationRotation of the label. Default is 0.value: numeric
wrapWhether or not to wrap the label text.value: boolean
object
grid

Configures the color, opacity and SVG dashed array of the grid lines.

NameDescriptionProperty Type
colorAxis grid color.color
opacityAxis grid opacity.value: numeric
dashArraySVG dashed array. The pattern of dashes and gaps used to paint the stroke. It's a list of comma separated lengths (in pixels) and percentages (percentage of the total stroke length) that specify the lengths of alternating dashes and gaps. If an odd number of values is provided, then the list of values is repeated to yield an even number of values. Thus, "5,3,2" is equivalent to "5,3,2,5,3,2".value: string
minDistanceThe minimum distance between grid lines.value: numeric
positionDefines the grid's relative position within the chart. A range from 0 to 1, with 0 meaning start and 1 meaning end.value: numeric


object
font

Configures the axis font size and weight.

NameDescriptionProperty Type
sizeAxis font size.value: numeric
weightAxis font weight.value: numeric


object
object
array
yAxes

Configuration properties for the Y Axes of the chart.

 Click here to see the yAxes properties
NameDescriptionProperty Type
nameA unique name to identify this axis configuration object. This field is required in order to configure the series.value: string 
label

Enables or disables a label for the y axis. Options as follows:

NameDescriptionProperty Type
enabledEnables a label drawn alongside this axis.value: boolean
textLabel text.value: string
colorLabel color. Can be chosen from color wheel, chosen from color palette, or entered as RGB or HSL value. See Color Selector.color
value: boolean
inversedIndicates if the scale of the axis should be flipped.value: boolean
visibleMake the label visible, if label is enabled.value: boolean
tooltip

Tool tip configuration for the axis. Options as follows:

NameDescriptionProperty Type
enabledEnables the tooltip. Default is true.value: boolean
textTooltip text.value: string
cornerRadiusRadius for the corner of tooltip.value: numeric
pointerLengthLength (in pixels) for the pointer on the tooltip.value: numeric
backgroundConfiguration for the color and opacity of the background of the tooltip.color
object
renderSets the axis type to render. Options are category, date, or value. Default is date.value: string dropdown
category

Applied when render is set to category. Category axis configuration. Groups data items into categories and allots equal space for each. Options as follows:

NameDescriptionProperty Type
enabledEnables a break range. Default is false.value: boolean
startCategoryStart point of the break.value: string 
endCategoryEnd point of the break.value: string 
sizeThe break size as a decimal percentage of the removed values.value: numeric

date

Applied when render is set to date. Date axis configuration. Uses data and time scale. Options as follows:

NameDescriptionProperty Type
baseIntervalAdjust the granularity of the time scale. Otherwise will adjust intelligently by default.
NameDescriptionProperty Type
enabledEnables or disables baseInteval.value: boolean
timeUnitSpecifies the base time to apply to this time scale. Options are minute, second, hour, day, week, or year.value: string dropdown
countSpecifies how many time units each data item was collected.value: numeric
skipEmptyPeriodsRemoves empty time units from display. Using this feature affects performance. Will reset the use of axis breaks if true.value: boolean
object
range

You can optionally adjust the date range. Otherwise will auto adjust by default. Options as follows:

NameDescriptionProperty Type
maxMaximum date in this range.value: string
minMinimum date in this range.value: string
useStrictStrictly enforces start and end values.value: boolean
object
break

Tells the date axis to remove a certain range from its scale. Options as follows:

NameDescriptionProperty Type
enabledEnables a break range. Default is false.value: boolean
startDateStart date of the break.value: string 
endDateEnd date of the break.value: string 
sizeThe break size as a decimal percentage of the removed values.value: numeric
object
inputFormat

Sets the date format of the axis value from the data source.

value: string dropdown
formatSets the date format for the axis labels. Options are date, time, or date and time.value: string dropdown
object
value

Applied when render is set to value. Value axis configuration. Uses data and time scale. Options as follows:

NameDescriptionProperty Type
range

You can optionally adjust the date range. Otherwise will auto adjust by default. Options as follows:

NameDescriptionProperty Type
maxMaximum date in this range.value: string
minMinimum date in this range.value: string
useStrictStrictly enforces start and end values.value: boolean
object
logarithmicUse logarithmic scale. Useful if data varies greatly within the relevant series.value: boolean
break

Tells the value axis to remove a certain range from its scale. Options as follows:

NameDescriptionProperty Type
enabledEnables a break range. Default is false.value: boolean
startValueStart point of the break.value: numeric
endValueEnd point of the break.value: numeric
sizeThe break size as a decimal percentage of the removed values.value: numeric
object
formatA number format string to be applied against numbers if in number rendering mode. Options are number, integer, four decimal precision, percent, scientific, currency, currency (rounded), or abbreviation.value: string dropdown
object
appearance

Appearance options for the y axis. Options as follows:

NameDescriptionProperty Type
oppositeRenders the axis on the opposite side. Default is falsevalue: boolean
insideRenders the axis labels on the inside of the axis. Default is false.value: boolean
labels

Axis label configuration:

NameDescriptionProperty Type
colorAxis label color.color
opacityAxis label opacity.value: numeric
rotationRotation of the label. Default is 0.value: numeric
wrapWhether or not to wrap the label text.value: boolean
object
grid

Configures the color, opacity and SVG dashed array of the grid lines.

NameDescriptionProperty Type
colorAxis grid color.color
opacityAxis grid opacity.value: numeric
dashArraySVG dashed array. The pattern of dashes and gaps used to paint the grid. It's a list of comma separated lengths (in pixels) and percentages (percentage of the total grid length) that specify the lengths of alternating dashes and gaps. If an odd number of values is provided, then the list of values is repeated to yield an even number of values. Thus, "5,3,2" is equivalent to "5,3,2,5,3,2".value: string
minDistanceThe minimum distance between grid lines.value: numeric
positionDefines the grid's relative position within the chart. A range from 0 to 1, with 0 meaning start and 1 meaning end.value: numeric
object
font

Configures the font size and weight.

NameDescriptionProperty Type
sizeAxis font size.value: numeric
weightAxis font weight.value: numeric


object
object
array
series

An array of series configurations to apply to this chart.

 Click here to see the Series properties
NameDescriptionProperty Type
nameA unique name to identify this application of this series. value: string
label

Series label to use with legend.

NameDescriptionProperty Type
textLabel text.value: string


object
visibleEnables series visibility. Default is true.value: boolean
hiddenInLegendHides the series in the legend. Default is false.value: boolean
defaultStateSeries default state configuration. Default is true (visible).value: boolean
data

Data settings for the series. Options as follows:

NameDescriptionProperty Type
source Name of the data source to bind to this series.value: string
xThe y value key from the specified data source to be used in this series. Value is a string value if the data source is a dataset or an array of objects. Value is an index if the data source is an array of arrays.value: string or index
yThe y value key from the specified data source to be used in this series. Value is a string value if the data source is a dataset or an array of objects. Value is an index if the data source is an array of arrays.value: string or index

xAxisName of the x axis configuration object to be used with this series.value: string
yAxisName of the y axis configuration object to be used with this series.value: string
zIndexSets the series stack order relative to other series.value: numeric
tooltip

Tool tip configuration for the series. Options as follows:

NameDescriptionProperty Type
enabledEnables the tooltip. Default is true.value: boolean
textA format string to apply to the tooltip text.value: string
cornerRadiusRadius for the corner of tooltip.value: numeric
pointerLengthLength (in pixels) for the pointer on the tooltip.value: numeric
background

Configuration for the color and opacity of the background of the tooltip.

NameDescriptionProperty Type
colorBackground color. See Color Selector.color
opacityBackground opacity.value: numeric
object
object
renderThe series render mode. Options are candlestick, column, line, stepLine. Default is line.value: string dropdown
candlestick

When render is set to candlestick. These are the candlestick settings. Options as follows:

 Click here to see the candlestick properties
NameDescriptionProperty Type
open

Open data settings

NameDescriptionProperty Type
xName of the field that holds the open data for the horizontal axis.value: string
yName of the field that holds the open data for the vertical axis.value: string
object
high

High data settings.

NameDescriptionProperty Type
xName of the field that holds the high data for the horizontal axis.value: string
yName of the field that holds the high data for the vertical axis.value: string
object
low

Low data settings.

NameDescriptionProperty Type
xName of the field that holds the low data for the horizontal axis.value: string
yName of the field that holds the low data for the vertical axis.value: string
object
appearance

Appearance settings.

NameDescriptionProperty Type
fill
NameDescriptionProperty Type
colorCursor line stroke color.color
opacityOpacity of the stroke.value: numeric
object
stroke

Series stroke configuration.

NameDescriptionProperty Type
colorCursor line stroke color.color
opacityOpacity of the stroke.value: numeric
widthWidth of the stroke, in pixels.value: numeric
object
stackedStacks this column series.value: boolean
deriveFieldsFromData



fill
NameDescriptionProperty Type
colorCursor line stroke color.color
opacityOpacity of the stroke.value: numeric

stroke
NameDescriptionProperty Type
colorCursor line stroke color.color
opacityOpacity of the stroke.value: numeric
widthWidth of the stroke, in pixels.value: numeric

object
heatRules

These heat rules apply to the fill of the columns.

NameDescriptionProperty Type
enabledWhether or not heat rules are enabled. Default is false.value: boolean
maxColor for max.value: string
minColor for min.value: string
dataField
value: string
object
object


object
column

When render is set to column. These are the column settings. Options as follows:

 Click here to the column properties
NameDescriptionProperty Type
open

Open settings.

NameDescriptionProperty Type
xName of the field that holds the open data for the horizontal axis.value: string
yName of the field that holds the open data for the vertical axis.value: string
object
appearance

Appearance settings.

NameDescriptionProperty Type
fill

Fill settings.

NameDescriptionProperty Type
colorCursor line stroke color.color
opacityOpacity of the stroke.value: numeric
object
stroke

Stroke settings.

NameDescriptionProperty Type
colorCursor line stroke color.color
opacityOpacity of the stroke.value: numeric
widthWidth of the stroke, in pixels.value: numeric
object
widthPercentvalue: numeric
heightPercentvalue: numeric
stackedStacks this column series.value: boolean

deriveFieldsFromData

NameDescriptionProperty Type
fill

Fill settings.

NameDescriptionProperty Type
colorCursor line stroke color.color
opacityOpacity of the stroke.value: numeric
object
stroke

Stroke settings.

NameDescriptionProperty Type
colorCursor line stroke color.color
opacityOpacity of the stroke.value: numeric
widthWidth of the stroke, in pixels.value: numeric
object
object
heatRules

These heat rules apply to the fill of the columns.

NameDescriptionProperty Type
enabledWhether or not heat rules are enabled. Default is false.value: boolean
maxColor for max.value: string
minColor for min.value: string
dataField
value: string
object
object




object
line

When render is set to line. These are the line settings. Options as follows:

 Click here to see the Line properties
NameDescriptionProperty Type
open

Configures the open data.

NameDescriptionProperty Type
xName of the field that holds the open data for the horizontal axisvalue:string
yName of the field that holds the open data for the vertical axisvalue:string
object
appearance

Configures the appearance of the line series. Options as follows:

NameDescriptionProperty Type
connect Connects the lines over empty data points. Default is true.value: boolean
tensionX Horizontal tension setting of the line. Range is 0 to 1. A 1 value indicates high tension, so the line is maximally attracted to the points it connects (i.e. straight line). A 0 value means the opposite. Default is 1.value: numeric
tensionY Vertical tension setting of the line. Range is 0 to 1. A 1 value indicates high tension, so the line is maximally attracted to the points it connects (i.e. straight line). A 0 value means the opposite. Default is 1.value: numeric
minDistance The minimum distance (in pixels) between two points. Default is 0.5.value: numeric
stroke

Series stroke configuration. Options as follows:

NameDescriptionProperty Type
widthWidth of the stroke, in pixels. Default is 3.value: numeric
opacityOpacity of the stroke.value: numeric
colorCursor line stroke color.color
dashArraySVG dash array. The pattern of dashes and gaps used to paint the stroke. It's a list of comma separated lengths (in pixels) and percentages (percentage of the total stroke length) that specify the lengths of alternating dashes and gaps. If an odd number of values is provided, then the list of values is repeated to yield an even number of values. Thus, "5,3,2" is equivalent to "5,3,2,5,3,2".array


object
fill

Series color configuration.

NameDescriptionProperty Type
colorThe color to draw this series.value: color
opacityOpacity as a percentage from 0 to 1. 0 is transparent, 1 is opaque.value: float


object
bullets

Series bullet configuration. Type of bullet to render (circle or rectangle) for each pen.

NameDescriptionProperty Type
enabledEnables bullets.value: boolean
renderType of bullet to render. Options are circle, rectangle, or icon.value: string dropdown
widthBullet width.value: numeric
heightBullet height.value: numeric
label

Label properties.

NameDescriptionProperty Type
textLabel text.value: string
position.dxLabel x position.value: numeric
position.dyLabel y position.value: numeric
object
tooltip

Tooltip configuration.

NameDescriptionProperty Type
enabledEnables the tooltip.value: boolean
textTooltip text. Can be a format string.value: string
cornerRadiusThe corner radius.value: numeric
pointerLengthThe pointer lenght.value: numeric
backgroundBackground color and opacity for the tool tip.object
object
fill

Fill settings.

NameDescriptionProperty Type
colorThe fill color for the columns in this series. See Color Selector.color
opacityThe column opacity.value: numeric
object
stroke

Stroke settings.

NameDescriptionProperty Type
widthWidth of the stroke, in pixels. Default is 3.value: numeric
opacityOpacity of the stroke.value: numeric
colorCursor line stroke color.color
object
rotationRotation of the bullet.value: numeric
deriveFieldsFromData
NameDescriptionProperty Type
fill

Fill settings.

NameDescriptionProperty Type
colorThe fill color for the columns in this series. See Color Selector.color
opacityThe column opacity.value: numeric
object
stroke

Stroke settings.

NameDescriptionProperty Type
colorCursor line stroke color.color
opacityOpacity of the stroke.value: numeric
widthWidth of the stroke, in pixels.value: numeric
object
rotationBullet rotation (0-360).value: numeric
object
heatRules

These heat rules apply to the fill of the line.

NameDescriptionProperty Type
enabledWhether or not heat rules are enabled. Default is false.value: boolean
maxColor for max.value: string
minColor for min.value: string
dataField
value: string
object


array
object
object
stepLine

When render is set to stepLine. These are the stepLine settings. Options as follows:

 Click here to see the stepLine properties


NameDescriptionProperty Type
open

Configures the open data.

NameDescriptionProperty Type
xName of the field that holds the open data for the horizontal axisvalue:string
yName of the field that holds the open data for the vertical axisvalue:string

appearance

Configures the following options:

NameDescriptionProperty Type
connectConnects the lines over empty data points. Default is true.value: boolean
tensionXHorizontal tension setting of the line. Used to create smooth or sharp lines Range is 0 to 1. A 1 value indicates high tension, so the line is maximally attracted to the points it connects (i.e. straight line). A 0 value means the opposite. Default is 1.value: numeric
tensionYVertical tension setting of the line. Used to create smooth or sharp lines Range is 0 to 1. A 1 value indicates high tension, so the line is maximally attracted to the points it connects (i.e. straight line). A 0 value means the opposite. Default is 1.value: numeric
minDistanceThe minimum distance (in pixels) between two points. Default is 0.5.value: numeric
stroke

Series stroke configuration. Options are as follows:

NameDescriptionProperty Type
widthWidth of the stroke, in pixels. Default is 3.value: numeric
opacityOpacity of the stroke. 0 is fully transparent, 1 is fully opaque. Default is 1.value: numeric
colorColor of border around each pie section.  See Color Selector.color
dashArraySVG dashed array. The pattern of dashes and gaps used to paint the stroke. It's a list of comma separated lengths (in pixels) and percentages (percentage of the total stroke length) that specify the lengths of alternating dashes and gaps. If an odd number of values is provided, then the list of values is repeated to yield an even number of values. Thus, "5,3,2" is equivalent to "5,3,2,5,3,2".array


object
fill
NameDescriptionProperty Type
colorThe fill color for the columns in this series. See Color Selector.color
opacityThe column opacity.value: numeric
object
bullets

Series bullet configuration.

 Click here to see bullet settings
NameDescriptionProperty Type
enabledEnables bullets.value: boolean
renderType of bullet to render. Options are circle or label.value: string dropdown
widthBullet width.value: numeric
heightBullet height.value: numeric
label

Label settings.

NameDescriptionProperty Type
textLabel text.value: string
positionLabel position.object
object
tooltip

Tooltip settings.

NameDescriptionProperty Type
enabledEnables the tooltip.value: boolean
textTooltip text. Can be a format string.value: string
cornerRadiusThe corner radius.value: numeric
pointerLengthThe pointer length.value: numeric
backgroundBackground color and opacity for the tool tip.object
object
fill

Fill settings.

NameDescriptionProperty Type
colorThe fill color for the columns in this series. See Color Selector.color
opacityThe column opacity.value: numeric
object
stroke

Stroke settings.

NameDescriptionProperty Type
colorCursor line stroke color.color
opacityOpacity of the stroke.value: numeric
widthWidth of the stroke, in pixels.value: numeric
object
rotationBullet rotation. Value can be 0 to 360.value: numeric
deriveFieldsFromData
NameDescriptionProperty Type
fill

Fill settings.

NameDescriptionProperty Type
colorThe fill color for the columns in this series. See Color Selector.color
opacityThe column opacity.value: numeric
object
stroke

Stroke settings.

NameDescriptionProperty Type
colorCursor line stroke color.color
opacityOpacity of the stroke.value: numeric
widthWidth of the stroke, in pixels.value: numeric
object
rotationBullet rotation (0-360).value: numeric
object
heatRules

These heat rules apply to the radius of a circular bullet.

NameDescriptionProperty Type
enabledWhether or not heat rules are enabled. Default is false.value: boolean
maxColor for max.value: string
minColor for min.value: string
dataField
value: string
object



object
object

array
styleSets a style for this chart. 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

Perspective 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 Perspective 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.

Examples
Example

PropertyValue
props.title.textSample Temperature Chart
props.datasources.example.8.process_temp71
props.yAxes.1.label.textTemperature
props.yAxes.appearance.oppositefalse
props.series.0.yAxisoutput temp
props.yAxis.1.value.range.max80
props.yAxis.1.value.range.min20
props.yAxis.1.value.range.useStricttrue
props.series.0.line.appearance.bullets.0.enabledfalse
props.series.1.line.appearance.bullets.0.stroke.width5


  • No labels