Dialog 'XY Chart Configuration'

Symbol:

Function: The dialog contains the configuration of the Cartesian XY chart which visualizes the data from an array.

Call: Click XY Chart in the Cartesian XY Chart property.

Requirement: An XY chart is selected in the active visualization editor and the corresponding Properties view is open.

The tree view to the left of the dialog visualizes the configuration of the XY chart and acts as a navigator. If you have selected the top-level entry (1) or nothing at all, then the Element Settings group is visible on the right. This configuration includes the chart refresh frequency. Moreover, settings are available that influence the appearance and functionality of the chart.

If you have selected an entry below the Curves node (2), then the Curve Settings group is visible on the right. This configuration includes the Y-coordinate axis assigned to the selected curve and the array data that the curve visualizes. Moreover, settings are available that influence the appearance and functionality of the selected curve. The entry shows the name of the curve with the assigned coordinate axis in parentheses. For example, Curve1 [AxisY1] means that the vertical ordinate axis AxisY1 is assigned to the curve Curve1.

If you have selected an entry below the Axes node (3), then the Axis Settings group is visible on the right. This configuration includes the location of the Y-coordinate axis in the chart. Moreover, settings are available that influence the appearance and functionality of the selected coordinate axis. The entry shows the name of the axis with its function in parentheses. An axis can act as either an X-axis or Y-axis. For example, AxisX(X) means that the axis AxisX acts as a horizontal abscissa axis X.

Add	Adds a new entry to the view. Result: An empty configuration is displayed next to the new curve or axis. There you edit the settings.
Delete	Removes the selected entry.
Move Up	Moves the selected entry up one position.
Move Down	Moves the selected entry down one position.

OK	Saves the settings, closes the dialog, and displays the element according to the settings.

Group 'Element Settings'
Group 'Curve Settings'
Group 'Axis Settings'

Group 'Element Settings'

Update
Type	Automatic: If array data affecting the chart rendering or array elements change, then the chart is refreshed automatically. Tip: The setting Enable automatic update is available in Extended variables to control the automatic update programmatically. Variable: If the variable value changes, then the chart is refreshed.
Variable	Variable (integer data type) Available if the type Variable is selected. See example: Variable

Example: Variable

Declaration

PROGRAM Sine
VAR_INPUT
   uiUpdate : UINT;
END_VAR

Assignment

Sine.uiUpdate

Background
Type	No background Plain color: Color background configured in the input fields Color and Transparency. Gradient: Background with a gradient. opens the gradient editor. Image: Background with image; configured in the input field Image ID. From style: Background as defined in the style.
Color	Style color from the drop-down list. Example: LightGreen Fixed value that is selected in the color dialog. Available if the type Plain color is selected.
Transparency	Value (0 to 255) for defining the transparency of the selected color. Example `255`: The color is opaque. `0`: The color is completely transparent. Available if the type Image is selected.
Image ID	`<image pool name>.<ID>` Example: `Images.Logo` Available if the type Image is selected.
Transparent color	: Background displayed with transparent color. Style color from the drop-down list. Example: LightGreen Fixed value that is selected in the color dialog. Available if the type Image is selected.
Scaling type	Isotropic: The entire image is shown in the element frame, either larger or smaller. As a result, the proportion of height and width are retained. Anisotropic: The image resizes automatically to the dimensions of the element frame, filling the entire element frame. As a result, the proportions are not retained. Fixed: The image retains its original size, even if the element frame is resized. Please note also that the clipping option is selected. Available if the type Image is selected.

Main Cursor
Type	Not used Vertical Big cross Small cross Interceptor
Line style	Example: Dots Not available if the type is selected.
Color	Style color from the drop-down list. Example: LightGreen Fixed value that is selected in the color dialog.
X position variable	Variable (integer data type) in which the cursor X-position is written. Example: `PLC_PRG.iPosition` Not available if the type is selected.

Extended Variables
Element variable	Variable with data type `VisuStructXYChart` from the `VisuElemXYChart` library The variable configured here is initialized with the static configuration. In runtime mode, the Cartesian XY Chart element responds to changes in this structure. As a result, the element can be controlled programmatically in runtime mode. See example: Element variable
Automatic update enable	Variable (data type `BOOL`) to control the automatic refreshing of the chart programmatically. `TRUE`: This display of the chart is refreshed automatically after a change. Example: `PLC_PRG.bIsUpdating` Note: Available when the type Automatic is selected in Update.

Example: Element variable

Declaration

PROGRAM Sine
VAR_INPUT
   XYGraph : VisuStructXYChart;
END_VAR

Assignment

Sine.XYGraph

Secondary Cursor
The cursor type of the additional cursor corresponds to the main cursor.
Line style	Example: Dots
Color	Style color from the drop-down list. Example: LightGreen Fixed value that is selected in the color dialog.

Grid
Type	Grid displayed as Not used Large grid Narrow grid Dotted grid on large marks Dotted grid on small marks
Line style	Example: Dots Not available if the type or is selected.
Color	Style color from the drop-down list. Example: LightGreen Fixed value that is selected in the color dialog.
Grid behind the curves	: The grid is displayed in the layer behind the curve. For example, if the curve is displayed as an area chart, then the grid is not visible in the color-filled area. However, if the fill color has a transparency value (example: `128`) and therefore is semitransparent, then the grid is still visible. : The grid lies on the curve. For example, if the curve is displayed as an area chart, then the color-filled area is always displayed with a grid.

Zero Line
Position	Display of the zero lines Not used Display for Y axis Display for X axis Display for both
Line style	Example: Dots
Line width	Example: `2`
Color	Style color from the drop-down list. Example: LightGreen Fixed value that is selected in the color dialog.

Group 'Curve Settings'

The settings are related to the curve selected in the tree view.

Attached to Y-axis

Y-axis that is assigned to the selected curve. The Y-axis can have multiple curves assigned to it. The drop-down list includes all axes that were created in the element.

Example: Y

Data X / Data Y
Variable	Array variable of base data types, custom data types, or function blocks. This variable contains the curve data for the X- or Y-data. One-dimensional array variable of a base data type: `ARRAY [ <lower index bound> .. <upper index bound> ] OF <basic data type>` Two-dimensional array variable of a base data type: `ARRAY [ <lower index bound 1> .. <upper index bound 1> , <lower index bound 2> .. <upper index bound 2> ] OF <basic data type>` `<lower index bound 1> .. <upper index bound 1>`: 1st dimension `<lower index bound 2> .. <upper index bound 2>`: 2nd dimension One-dimensional array variable of a user-defined data type `ARRAY [ <lower index bound> .. <upper index bound> ] OF <DUT name>` One-dimensional array variable of an enumeration `ARRAY [ <lower index bound> .. <upper index bound> ] OF <enumeration name>` One-dimensional array variable of a function block `ARRAY [ <lower index bound> .. <upper index bound> ] OF <function block name>` `<basic data type> : SINT \| INT \| DINT \| LINT \| USINT \| UINT \| UDINT \| ULDINT \| REAL \| LREAL \| BYTE \| WORD \| DWORD \| LWORD \| <enumeration>` Note: Set a fixed scaling for an axis only if you know the value range. Otherwise, we recommend that you set automatic scaling. See: Examples
Element to use	The array element of the complex data type that is used. Available if the data type of Variable is the array of a complex data type (consisting of multiple elements): Multidimensional array User-defined data type Function block : Opens a drop-down list with all array elements.

Example: Two-dimensional array of the base type REAL

Declaration

PROGRAM Curve
VAR
   aDataXY : ARRAY [1..2, 1..50] OF REAL;
END_VAR

Data X

Variable: Curve.aDataXY

Element to use: [1]

Data Y

Variable: Curve.aDataXY

Element to use: [2]

Then 100 array values are displayed in this curve.

Example: One-dimensional array of a user-defined data type

Declaration

TYPE STRUCT_A :
STRUCT
        iX: INT;
        rY: REAL;
        bResult: BOOL;
END_STRUCT
END_TYPE

PLC_PRG
VAR
        aDataXY : ARRAY [1..50] OF STRUCT_A;
END_VAR

Data X

Variable: aDataXY.iX

Element to use: iX

Data Y

Variable: aDataXY.rY

Element to use: rY

Example: One-dimensional array of the structure POINT

PLC_PRG
VAR
        aPoints_1: ARRAY[0..99] OF POINT; // POINT is a structure with iX and iY
END_VAR

Data X

Variable: PLC_PRG.aPoints_1

Element to use: iX

Data Y

Variable: PLC_PRG.aPoints_1

Element to use: iY

Then 200 X- and Y-values are available which are displayed in the chart in 100 curve points.

Example: One-dimensional array of a function block

Declaration

FUNCTION_BLOCK FB_A
VAR_INPUT
        iIn: INT;
END_VAR
VAR_OUTPUT
        iOut: INT;
END_VAR
PROGRAM PLC_PRG
VAR
        aDataXY : ARRAY [1..50] OF FB_A;
END_VAR

Data X

Variable: PLC_PRG.aDataXY

Element to use: iIn

Data Y

Variable: PLC_PRG.aDataXY

Element to use: iOut

Property Array Indexes
	The array indices limit the display of the curve to a partial area. Instead of all points being displayed in the XY chart, only the points from Minimum to Maximum are displayed. Minimum and Maximum are indexes that must not violate the index limits. The compiler also monitors this. Pick the index limits of the array declaration. Example: `<variable name> : ARRAY [ <lower index bound> .. <upper index bound> ] OF <data type>;` Moreover, you can limit the display programmatically in the instance of `VisuStructXYChartCurve`. The structure elements `diIndexMin` and `diIndexMax` are available for this purpose. They have the same function as Minimum and Maximum. At runtime, the values are copied here into these structure elements. In addition, you can limit the display area only one-sided, and specify only one Minimum or only one Maximum. When you do not specify a limit here or in the structure, the curve is displayed completely. When you specify variables (numeric data type) as array indices, you can make the display dynamic. Numeric data type: `SINT \| INT \| DINT \| LINT \| USINT \| UINT \| UDINT \| ULDINT \| REAL \| LREAL`
Minimum	Minimum index as literal, variable (numeric data type), or constant variable (numeric data type) Specifies the index from which the curve is displayed. The index is greater than or equal to the index limit `<lower index bound>`. Example: `10`, `PLC_PRG.uiLowerIndex`, `GVL.c_diMIN`
Maximum	Maximum index as literal, variable (numeric data type), or constant variable (numeric data type) Example: `20`, `PLC_PRG.uiUpperIndex`, `GVL.c_diMAX` Contains the index to which the curve is displayed. The index is less than or equal to the index limit `<upper index bound>`.

Chart
Type	Line chart: Data is displayed as a continuous line. Moreover, the data can be displayed as dots. Input fields are provided for this purpose. Bar chart: Data is displayed as vertical bars. Input fields are provided for color and transparency. Area chart: Data is displayed as a continuous line with a color-filled area. Moreover, the data can be displayed as dots. Input fields are provided for this purpose.

The following settings are available when the type Line chart is selected.
Line color	: Line in axis color Style color from the drop-down list. Example: LightGreen Fixed value that is selected in the color dialog.
Line type	Line Step low Step high None Dots only
Line width	Example: `2`
Line style	Example: Dots
Point style	None Dot Cross Small circle Big circle

The following settings are available when the type Bar chart is selected.
Bar shape	Fixed width: The bar is displayed in a fixed width. Variable width: The bar width depends on the distance between the values.
Main color	Style color from the drop-down list. Example: Element-XYChart-Axis-Background Fixed value that is selected in the color dialog. Example: `0; 0; 0`
Alternative color
Frame color

The following settings are available when the type Area chart is selected.
Line color	Example: Blue : The color configuration is disabled, so the axis color is applied.
Fill type	Color for filling the area between the curves. No filling Plain color: Single-color area Gradient:: Area filled with a color gradient
Fill color	Example: Gray : Opens the Color dialog. Requirement: Plain color is selected in Filling type. : The color configuration is disabled, so the line color is applied.
Transparency	Transparency value (0 - 255) for the color. Example: `128` Requirement: Plain color is selected in Filling type.
Gradient	Area filled with a color gradient. : Opens the Gradient dialog. Requirement: Gradient is selected in Filling type.
Line width	Example: `2`
Line style	Example: Dots
Point style	The data is displayed in the chart as dots in point style. None Dot Cross Small circle Big circle

Curve value captured by the cursor

Variable (integer data type) in which the Y-position of the cursor is written to the curve.

Example: Sine.Cursor_Pos_Y

Extended Variables
Curve variable	Variable (data type `VisuStructXYChartCurve` from the `VisuElemXYChart` library) The variable configured here is initialized with the static configuration. In runtime mode, the Cartesian XY Chart element responds to changes in this structure. As a result, the element can be controlled programmatically in runtime mode. See example: Curve variable

Example: Curve variable

Declaration

PROGRAM Sine
VAR_INPUT
   Curve : VisuStructXYChartCurve;
END_VAR

Assignment

Sine.Curve

Reference curve
Curve	Curve that is referenced. The area between the curves is filled in color.
Color	Color for filling the area between the curves. Style color from the drop-down list. Example: `Light gray` Fixed value that is selected in the color dialog. Example: `0; 0; 0`

Group 'Axis Settings'

The settings are related to the axis selected in the tree view.

Display Mode
Position	X-axis: The X-axis is selected. There is exactly one X-axis in the XY chart. On the left side: The Y-axis is selected and displayed on the left in the chart. On the right side: The Y-axis is selected and displayed on the right in the chart.
Minimum Maximum	Minimum and maximum limit of the axis value within which the curve is displayed. Limit specified as Variable (numeric data type) Example: `PLC_PRG.iMinX`, `PLC_PRG.iMaxX` Constant variable (numeric data type) Declaration in GVL: `VAR_GLOBAL CONSTANT c_iMINX : INT; c_iMAXX : INT; END_VAR` Example: `GVL.c_iMINX`, `GVL.c_iMAXX` Fixed value (numeric literal) Example: `-1000`, `1000` Numeric data type: `SINT` \| `INT` \| `DINT` \| `LINT` \| `USINT` \| `UINT` \| `UDINT` \| `ULDINT` \| `REAL` \| `LREAL` Note: Visible only when Autoscale is disabled.
Autoscale	: The axis is scaled automatically. The Minimum and Maximum settings are not visible.

Axis color

Style color from the drop-down list. Example: LightGreen
Fixed value that is selected in the color dialog.

Background
Type	No background Plain color: Color background configured in the input fields Color and Transparency. Gradient: Background with a gradient. opens the gradient editor. Image: Background with image; configured in the input field Image ID.
Color	Style color from the drop-down list. Example: LightGreen Fixed value that is selected in the color dialog. Available if the type Plain color is selected.
Transparency	Value (0 to 255) for defining the transparency of the selected color. Example `255`: The color is opaque. `0`: The color is completely transparent. Available if the type Plain color is selected.
Image ID	`<image pool name>.<ID>` Example: `Images.Logo` Available if the type Image is selected.
Transparent color	: Background displayed with transparent color. Style color from the drop-down list. Example: LightGreen Fixed value that is selected in the color dialog. Available if the type Image is selected.
Scaling type	Isotropic: The entire image is shown in the element Frame, either larger or smaller. As a result, the proportion of height and width are retained. Anisotropic: The image resizes automatically to the dimensions of the element frame, filling the entire element Frame. As a result, the proportions are not retained. Fixed: The image retains its original size, even if the element frame is resized. Please note also that the clipping option is selected. Available if the type Image is selected.

Extended Variables
Axis variable	Variable (data type `VisuStructXYChartAxis` from the `VisuElemXYChart` library) The variable configured here is initialized with the static configuration. In runtime mode, the Cartesian XY Chart element responds to changes in this structure. As a result, the element can be controlled programmatically in runtime mode. See example: Axis variable

Example: Axis variable

Declaration

PROGRAM Sine
VAR_INPUT
   AxisX : VisuStructXYChartAxis;
END_VAR

Assignment

Sine.AxisX

Extended Display Parameters
Display ruler Axes overlap in origin Display numbers Display of maximum number Display of minimum number Display of numbers in the middle Overwrite numbers	: The axis is displayed accordingly.

Label
Text ID	`<text list name>.<ID>` Example: `Texts.mm` (The text list `Texts` is already available in the project.)
Color	: Label in the axis color Style color from the drop-down list. Example: LightGreen Fixed value that is selected in the color dialog. Available if Test ID is initialized.
Rotation	0°: Parallel to the axis 90°: Rotated on the axis 270°: Rotated on the axis Available if Test ID is initialized.
Font	Font style from the drop-down list. Example: Annotation Fixed value that is selected in the default Font dialog. Available if Test ID is initialized.

Level Lines
Line along the axis. The line is horizontal for a Y-axis and vertical for an X-axis. Maximum of 10 lines are possible.
Line number	Addresses the line and results in the corresponding parameter settings being displayed for this line in the window area below Parameter for line <n>. Example: `3`

Parameter for line <n>
Value	Example: `3`
	Maximum of 10 lines are possible.
Line style	Example: Dots
Line width	Example: `2`
Color	: Line of the level line value in the axis color Style color from the drop-down list. Example: LightGreen Fixed value that is selected in the color dialog.
Label text ID	`<text list name>.<ID>` Example: `Texts.mm` (The text list `Texts` is already available in the project.)
Label position	Inline Above Below Left Right
Label rotation	0°: Parallel to the axis 90°: Rotated on the axis 270°: Rotated on the axis Available if Test ID of the label is initialized.
Font	Font style from the drop-down list. Example: Annotation Fixed value that is selected in the default Font dialog. Available if Test ID of the label is initialized.