XY Chart
Description:
XY Chart
Provides a graphical representation of data, in which the data is represented by lines along X-axis and Y-axis.
Allowed Parent Components:
Card Body
Col
Grid Child
Horizontal Section
Vertical Section
Allowed Child Components:
Popover
Pulse
Trigger Before Render
Trigger On Click
Properties
➤ Type
Bubble Chart uses bubble-like symbols to depict data on the Plot Area. Scatter chart is used to plot co-relations between two variables for a set of dataPoints. Zoomscatter is an extension of the scatter chart with the zooming and panning features.
Allowed Values:
bubble
scatter
zoomscatter
➤ Caption
Provide a title for the Chart.
Allowed Values: An expression which should return string after evaluation
➤ Sub Caption
Provide a sub title for the chart.
Allowed Values: An expression which should return string after evaluation
➤ Enable Smart Labels
By default smart labels manage overlapping of labels even when a large number of labels are placed in the close vicinity. Uncheck to disable these smart labels.
Allowed Values: Yes/No
➤ Height
Provide a number to set height for the chart.
Allowed Values: Any number value
➤ Place Values Inside
Enable this to display values inside of the chart symbols.
Allowed Values: Yes/No
➤ Show Labels
Enable this to display labels of the chart.
Allowed Values: Yes/No
➤ Show Legend
Enable this to display legend properties for the chart.
Allowed Values: Yes/No
➤ Show Legend On Right
Enable this to display legend properties properties on right side of the chart
Allowed Values: Yes/No
➤ Show Shadow
Enabel this to display shadow for the chart.
Allowed Values: Yes/No
➤ Show Values
Enable this to display values if any for the category fields.
Allowed Values: Yes/No
➤ Show Xaxis Line
Enable this to display a line along X-axis
Allowed Values: Yes/No
➤ Show Yaxis Line
Enable this to display a line along Y-axis
Allowed Values: Yes/No
➤ Use3 Dlighting
Enable this to appear 3DLightegning effect for the chart.
Allowed Values: Yes/No
➤ Width
Provide a number to set width of the chart
Allowed Values: Any number value
➤ X Axis Name
Provide a name that you would want to display on the X-axis.
Allowed Values: Free text field
➤ Y Axis Name
Provide a name that you would want to display on the Y-axis.
Allowed Values: Free text field
➤ Label Display
Select the way you want your label to display.
Allowed Values:
auto
wrap
stagger
rotate
➤ Slant Labels
Enable this to display labels in slant manner
Allowed Values: Yes/No
➤ Stagger Lines
Enter a numeric value above 2 to control how many lines to stagger the label to. By default, all labels are displayed in a single line.
Allowed Values: Any number value
➤ Label Step
Value to display every n-th label, instead of all labels on the x-axis
Allowed Values: Any number value
➤ Palette Colors
Specify your custom list of hex colors for the data items. The list of colors have to be separated by comma e.g., "paletteColors": "#FF0000, #0372AB, #FF5904...". The chart will cycle through the list of specified colors and then render the data plot accordingly.
Allowed Values: Free text field
➤ Export Enabled
Enable this to allow export in png, jpg, pdf, svg or xls formats.
Allowed Values: Yes/No
➤ Export File Name
Specify the name (excluding the extension) of the output (export) file. default: chart
Allowed Values: Free text field
➤ Anchor Radius
This attribute sets the radius (in pixels) of the anchor.
Allowed Values: Any number value
➤ Anchor Border Thickness
Helps you set border thickness of anchors.
Allowed Values: Any number value
➤ On Click
Allowed Values: Controller Function
➤ Use Existing Data Source
Choose this prop if you want to reuse a Data Source that was defined on some other component on this page or any of the parent abstract pages.
Allowed Values: Yes/No
➤ Data Source
Select a datasource from the list.
Allowed Values: Select a datasource from the list.
➤ Data Source Alias
Allowed Values: Free text field
➤ Default Where Clause
Allowed Values: Free text field
➤ Max Rows
Allowed Values: Any number value
➤ Order By Clause
e.g. #firstAttr#, #secondAttr# DESC
Allowed Values: Free text field
➤ Auto Query
Check this property to query the selected datasource on component render.
Allowed Values: Yes/No
➤ Execute Count SQL
Check this to execute count SQL to get the total number of rows in the database on a query. You can get this value by using the expression: #{DataStore.totalLength}
Allowed Values: Yes/No
➤ Execute Distinct SQL
Check this to execute distinct SQL to get the total number of distinct rows in the database on a query.
Allowed Values: Yes/No
➤ Key Attribute
It is the primary key field in the current data source.
Allowed Values: It is the primary key field in the current data source.
➤ Label Attribute
The attribute that you would want to display as the label on the X- axis
Allowed Values: The attribute that you would want to display as the label on the X- axis
➤ Category Key Attribute
Select a attribute so that the mathematical functions will be performed on this attribute.
Allowed Values: Select a attribute so that the mathematical functions will be performed on this attribute.
➤ Category Attribute
To display all the categories based on the attribute that you provide in a legend at the bottom.
Allowed Values: To display all the categories based on the attribute that you provide in a legend at the bottom.
➤ X Axis Value Attribute
It is a column through which you can get the data from DataSource to display along X-axis.
Allowed Values: It is a column through which you can get the data from DataSource to display along X-axis.
➤ Y Axis Value Attribute
It is a column through which you can get the data from DataSource to display along Y-axis.
Allowed Values: It is a column through which you can get the data from DataSource to display along Y-axis.
➤ Z Axis Value Attribute
It is a column through which you can get the data from DataSource to display along Z-axis.
Allowed Values: It is a column through which you can get the data from DataSource to display along Z-axis.
➤ Function
Select a function to do arithmetic operations on data.
Allowed Values:
SUM
COUNT
AVG
MAX
MIN
➤ Auto Refresh Interval
Specify this property in seconds to refresh the component to specified interval.
Allowed Values: Any number value
➤ Label Format Expression
Specify an expression that should be evaluated to a string
Allowed Values: An expression which should return string after evaluation
Last updated