MiscellaneousOptions class (Graph)

MiscellaneousOptions()

new MiscellaneousOptions()

The MiscellaneousOptions object defines the control's default miscellaneous options, hold by misc field of the Graph.Options or Misc property. The control's miscellaneous options include various settings that affect the overall behavior and appearance of the graph, such as how major units are calculated for axes, padding for labels and titles, and other display-related configurations. These options provide flexibility in customizing the graph to meet specific requirements or preferences. For example, the "baseMajorUnits" option allows you to specify alternative base major units that the control uses to calculate the major unit for the axes. By setting this option, you can control which values are considered as major units on the axes, which can help improve readability and presentation of the data.

For instance, the "baseMajorUnits" option:

misc: { baseMajorUnits: "1,5" }
forces the control to use only 1 and 5 or any multiple (10,50,100,...) or subdivision (0.1,0.5,0.01,...) can be a major-unit

Members

(static) allowValueScroll :number

The allowValueScroll option indicates a positive number that defines whether the value-scroll is visible or hidden (valid for area-type charts only). The value-scroll is the vertical-scroll bar for horizontal charts (categories goes horizontally), and horizontal scroll bars for vertical charts (categories goes vertically). By default, the control shows no value-scroll. For instance, the value-scroll could be shown if the control is zoomed.
Type:
  • number
Since:
  • 3.0
Example
0 {number} or null {null}, the value-scroll is not visible
1 {number}, the value-scroll is visible once the control's zoom is greater than 100 (the control is zoomed)
2 {number}, the value-scroll is always visible, as the view uses twice the space of the page to show the values
allowValueScroll

(static) baseMajorUnits :string

The baseMajorUnits field defines the base major-units alternatives (separated by comma) the control uses to calculate the major-unit for the axes. By default, the baseMajorUnits field is set to "1,2.5,5", which means that the control considers values of 1, 2.5 and 5 or any multiple or subdivision of these values as potential major units when calculating the major unit for the axes. This option allows you to customize the major unit calculation to better suit the range and distribution of your data, ensuring that the axis labels are meaningful and appropriately spaced. For example, if you set the baseMajorUnits to "1,5", the control will only consider values of 1 and 5 or any multiple (10,50,100,...) or subdivision (0.1,0.5,0.01,...) as potential major units, which can help create a cleaner and more interpretable axis for certain types of data.
Type:
  • string
Example
"1,2.5,5" {string}, specifies that values of 1, 2.5 and 5 or any multiple or subdivision can be a major-unit
"1,5" {string}, specifies that values of 1 and 5 or any multiple (10,50,100,...) or subdivision (0.1,0.5,0.01,...) can be a major-unit
baseMajorUnits

(static) categoryAxisPad :number

The categoryAxisPad field specifies the padding for labels and title of the category-axis. This option allows you to control the spacing between the category axis labels and title and the axis line, providing better readability and visual separation. By default, the categoryAxisPad field is set to 4, which means that there is a 4-pixel padding for the labels and title of the category axis. If you set this field to 0, it specifies that there is no padding for the labels and title of the category axis, which may cause them to be closer to the axis line and potentially harder to read.
Type:
  • number
Example
0 {number}, no padding for for labels and title
4 {number}, sets a 4-pixels padding
categoryAxisPad

(static) categoryAxisSize :number

The categoryAxisSize field specifies the size (height for horizontal axis and width for vertical axis) to display the category-axis (line and ticks). This option allows you to control the visual prominence of the category axis by adjusting its size. By default, the categoryAxisSize field is set to 4, which means that the line and ticks of the category axis are shown on a portion of 4 pixels tall for horizontal axes or 4 pixels wide for vertical axes. If you set this field to 0, it specifies that the line and ticks of the category axis are not shown at all, effectively hiding the category axis from view.
Type:
  • number
Example
0 {number}, specifies that the line and ticks of the category-axis is not shown at all
4 {number}, the category-axis line and ticks are shown on a portion of 4-pixels tall
categoryAxisSize

(static) circularStartAngle :number

The circularStartAngle field specifies the angle (in degrees) to start the circular-compatible charts (radial or pie). This option allows you to control the orientation of circular-compatible charts, such as radial or pie charts, by specifying the starting angle for the first data point. By default, the circularStartAngle field is set to -90, which means that circular-compatible charts start vertically with the first data point at the top. If you set this field to 0, it specifies that circular-compatible charts start horizontally with the first data point on the right.
Type:
  • number
Example
0 {number}, the circular-compatible charts start horizontally
-90 {number}, the circular-compatible charts start vertically
circularStartAngle

(static) cursorTrans :string

The cursorTrans option defines the transition applied to cursor tooltips when the pointer hovers over the chart. Available transitions are defined in the exontrol.Def.G.Transitions namespace. This option allows you to control the animation effect of cursor tooltips, enhancing the visual experience when interacting with the chart. By default, the cursorTrans field is set to "linear,ease-in,ease-out,ease", which means that cursor tooltips can perform linear, ease-in, ease-out, and ease transitions. If you set this field to an empty string "", it specifies that cursor tooltips will only perform linear transitions. If you set this field to "ease", it specifies that cursor tooltips will only perform ease transitions.
Type:
  • string
Example
null {null}, the cursor performs linear, ease-in, ease-out and ease transitions
"" {string}, the cursor performs only linear transitions
"ease" {string}, the cursor performs only ease transitions
cursorTrans

(static) digits :number

The digits field specifies the number of digits to appear after the decimal point. The showValue field of the serie specifies whether values, lines, and points are displayed for the serie's data. By default, the digits field is set to 2, which means that all numeric values displayed in the chart will show up to two decimal places. If you set the digits field to -1, no conversion is performed, and numeric values are displayed as they are without any rounding or formatting. Setting the digits field to 0 will display all numeric values as integers, while setting it to a positive number will display that many digits after the decimal point for all numeric values in the chart. This option allows you to control the precision of the numeric values displayed in the chart, making it easier to read and interpret the data based on your specific needs.
Type:
  • number
Example
-1 {number}, no conversion is performed, so the numeric-values are displayed as is
0 {number}, all numeric-values are displayed as integers
2 {number}, all numeric-values show up to two-decimals
digits

(static) epsilon :number

The epsilon field defines the minimum positive threshold applied to the logarithmic scale to prevent undefined behavior (e.g., log(0)) and improve numerical stability for very small values. The default value is 1e-8. If your dataset includes values below this threshold, you should adjust epsilon accordingly. Note that epsilon also influences the visual spacing between 0 and 1 on a logarithmic axis, a smaller epsilon increases the perceptual gap, while a larger value compresses it.
Type:
  • number
Since:
  • 4.5
Example
1e-8 {number} or null {null}, defines the epsilon value to 1e-8
1e-10 {number}, defines a smaller epsilon value, equivalent to 0.0000000001
epsilon

(static) extVisibleAfterAxis :number

The extVisibleAfterAxis field indicates the minimum portion (as a proportion of major unit, as a numeric-value between 0 and 1) to extend the axis after the last value of the serie (maximum value). This option allows you to control how much the axis extends after the maximum value of the series, providing additional space for better visualization and readability of the data. By default, the extVisibleAfterAxis field is set to 0, which means that the axis is not extended after the last value of the series (maximum value). If you set this field to a positive value between 0 and 1, it will extend the axis by that proportion of a major unit after the maximum value, creating a margin that can help prevent data points from being too close to the edge of the chart.
Type:
  • number
Example
0 {number}, specifies that the axis is not extended after the last value of the serie (maximum value)
extVisibleAfterAxis

(static) extVisibleBeforeAxis :number

The extVisibleBeforeAxis field indicates the minimum portion (as a proportion of major unit, as a numeric-value between 0 and 1) to extend the axis before the first value of the serie (minimum value). This option allows you to control how much the axis extends before the minimum value of the series, providing additional space for better visualization and readability of the data. By default, the extVisibleBeforeAxis field is set to 0, which means that the axis is not extended before the first value of the series (minimum value). If you set this field to a positive value between 0 and 1, it will extend the axis by that proportion of a major unit before the minimum value, creating a margin that can help prevent data points from being too close to the edge of the chart.
Type:
  • number
Example
0 {number}, specifies that the axis is not extended before the first value of the serie (minimum value)
extVisibleBeforeAxis

(static) marginValueRatio :number

The marginValueRatio field specifies the distance (proportionally with the valueSize field) between the first and last value of the same category and its border. This option allows you to control the spacing between the values of a category and the edges of the chart, providing better readability and visual separation. By default, the marginValueRatio field is set to 0.25 (1/4), which means that there is a margin equal to 1/4 of the valueSize field between the first and last value of a category and its border. If you set this field to 0, it specifies that there is no margin between the first and last value of a category and its border, which may cause the values to be too close to the edges of the chart.
Type:
  • number
Example
0 {number}, no margins are defined
1/4 {number}, the margin is defined as 1/4 of valueSize
marginValueRatio

(static) newLayoutOnVisibleChange :boolean

The newLayoutOnVisibleChange field specifies whether the control requests for a new layout once the serie's visible option is changed. This option allows you to control the behavior of the chart when a series visibility changes, determining whether the chart should recalculate its layout and potentially update the minimum and maximum values for the axes. By default, the newLayoutOnVisibleChange field is set to true, which means that the control computes a new layout once a series visibility changes, requesting new minimum and maximum values for the axes if necessary. If you set this field to false, it specifies that when a series visibility changes, the series is just hidden or shown without requesting a new layout or updating the minimum and maximum values for the axes.
Type:
  • boolean
Example
false {boolean}, the serie is just hidden, while the minimum-maximum values are kept
true {boolean}, the control computes a new layout once the serie's visible option is changed (requests for new minimum-maximum values)
newLayoutOnVisibleChange

(static) paddingInsidePie :number

The paddingInsidePie field specifies the padding between rings of the "pie" chart-type (should be zero or a positive value). This option allows you to control the spacing between the rings in a pie chart, which can help improve readability and visual separation of the different segments. By default, the paddingInsidePie field is set to 0, which means that there is no padding between the rings of the pie chart. If you set this field to a positive value, it specifies the distance in pixels between the rings of the pie chart, creating a visual gap that can make it easier to distinguish between different segments of the chart.
Type:
  • number
Example
null {null}, specifies that no padding between rings of the "pie" chart-type
12 {number}, the distance between rings of the "pie" chart-type, is 12 pixels
paddingInsidePie

(static) paddingValueRatio :number

The paddingValueRatio field specifies the distance (proportionally with the valueSize field) between two values of the same category. This option allows you to control the spacing between values within the same category, providing better readability and visual separation. By default, the paddingValueRatio field is set to 0.125 (1/8), which means that there is a padding equal to 1/8 of the valueSize field between two values of the same category. If you set this field to 0, it specifies that there is no padding between values of the same category, which may cause them to be too close to each other and harder to distinguish.
Type:
  • number
Example
0 {number}, no distance between values
1/8 {number}, the margin is defined as 1/8 of valueSize
paddingValueRatio

(static) radarPolygonal :boolean

The radarPolygonal field specifies whether the radar-compatible chart-types (radararea,radarline,radarcolumn) show as polygonal instead of circular. This option allows you to control the visual style of radar-compatible charts, choosing between a polygonal representation or a circular one. By default, the radarPolygonal field is set to false, which means that radar-compatible charts are displayed in a circular style. If you set this field to true, it specifies that radar-compatible charts are displayed in a polygonal style, where the data points are connected by straight lines forming a polygon shape.
Type:
  • boolean
Example
false {boolean}, the circular-compatible charts show elliptical
true {boolean}, the circular-compatible charts show polygonal
radarPolygonal

(static) radialRotateLabels :boolean

The radialRotateLabels field specifies whether the radial-labels are rotated around the chart. This option allows you to control the orientation of radial labels in circular-compatible charts, such as radial or pie charts, by specifying whether the labels should be rotated to follow the curvature of the chart or remain horizontal. By default, the radialRotateLabels field is set to true, which means that radial labels are rotated around the chart, following the curvature of the circular-compatible charts. If you set this field to false, it specifies that radial labels are shown horizontally, regardless of their position around the chart.
Type:
  • boolean
Example
false {boolean}, the labels are horizontally shown
true {boolean}, the labels are rotated shown
radialRotateLabels

(static) rangeMajorUnits :array

The rangeMajorUnits field defines the inferior and superior limits of the number of major-unit intervals an axis can display. The control calculates the major-unit for the axes based on the base major-units defined by the baseMajorUnits field, and it considers only those major-unit candidates that result in a number of major-unit intervals within the limits specified by the rangeMajorUnits field. By default, the rangeMajorUnits field is set to [5,10], which means that the control will only consider major-unit candidates that result in a number of major-unit intervals between 5 and 10. This option allows you to control the density of the axis labels by specifying how many major units should be displayed on the axes, ensuring that the labels are not too crowded or too sparse for better readability.
Type:
  • array
Example
[5,10] {array}, any count of major-unit intervals between 5 and 10 is accepted
rangeMajorUnits

(static) showGridLinesIf :number

The showGridLinesIf option specifies the category-unit's minimum size so the category grid-lines are visible. This option allows you to control the visibility of category grid lines based on the size of the category units, which can help improve readability and prevent clutter in cases where category units are too small to accommodate grid lines. By default, the showGridLinesIf field is set to 18, which means that category grid lines are visible if the category-unit size is greater than 18 pixels. If you set this field to a positive number, it specifies the minimum size in pixels for category units to display grid lines, ensuring that grid lines are only shown when there is sufficient space for them to be clearly visible.
Type:
  • number
Example
null {number}, by default, the showGridLinesIf is 18
8 {number}, category grid-lines are visible is the category-unit size is greater than 8 pixels
showGridLinesIf

(static) showLabelsIf :number

The showLabelsIf option specifies the category-unit's minimum size so the category labels are visible. This option allows you to control the visibility of category labels based on the size of the category units, which can help improve readability and prevent clutter in cases where category units are too small to accommodate labels. By default, the showLabelsIf field is set to 24, which means that category labels are visible if the category-unit size is greater than 24 pixels. If you set this field to a positive number, it specifies the minimum size in pixels for category units to display labels, ensuring that labels are only shown when there is sufficient space for them to be clearly visible.
Type:
  • number
Example
null {number}, by default, the showLabelsIf is 24
18 {number}, category labels are visible is the category-unit size is greater than 18 pixels
showLabelsIf

(static) showTicksIf :number

The showTicksIf option specifies the category-unit's minimum size so the category-ticks are visible. This option allows you to control the visibility of category ticks based on the size of the category units, which can help improve readability and prevent clutter in cases where category units are too small to accommodate ticks. By default, the showTicksIf field is set to 12, which means that category ticks are visible if the category-unit size is greater than 12 pixels. If you set this field to a positive number, it specifies the minimum size in pixels for category units to display ticks, ensuring that ticks are only shown when there is sufficient space for them to be clearly visible.
Type:
  • number
Example
null {number}, by default, the showTicksIf is 12
8 {number}, category-ticks are visible is the category-unit size is greater than 8 pixels
showTicksIf

(static) showValueIf :number

The showValueIf option specifies the category-unit's minimum size so the data-values are visible. This option allows you to control the visibility of data values based on the size of the category units, which can help improve readability and prevent clutter in cases where category units are too small to accommodate value labels. By default, the showValueIf field is set to 24, which means that data values are visible if the category-unit size is greater than 24 pixels. If you set this field to a positive number, it specifies the minimum size in pixels for category units to display data values, ensuring that value labels are only shown when there is sufficient space for them to be clearly visible.
Type:
  • number
Example
null {number}, by default, the showValueIf is 24
18 {number}, data-values are visible is the category-unit size is greater than 18 pixels
showValueIf

(static) updateRangeOnScroll :number

The updateRangeOnScroll field specifies the time in ms to update the chart's minimum and maximum values while user scrolls the chart (0 indicates that the chart's minimum and maximum values are updated only when changing the data). This option allows you to control the performance and responsiveness of the chart when scrolling through data. By default, the updateRangeOnScroll field is set to 128, which means that the chart's minimum and maximum values are updated 128 milliseconds after the user scrolls the chart. If you set this field to 0, it specifies that the chart's minimum and maximum values are updated only when the data changes, which can improve performance during scrolling but may result in less accurate axis ranges while navigating through the data.
Type:
  • number
Example
0 {number}, the chart's minimum and maximum values are updated once the data is changed
64 {number}, the chart's minimum and maximum values are updated in 64 ms after user scrolls the chart
updateRangeOnScroll

(static) valueAxisFitLabel :boolean

The valueAxisFitLabel field ensures that the marginal labels of the value-axis ensure fit the axis's client-rectangle. This option allows you to control the display of the marginal labels on the value axis, ensuring that they fit within the available space and do not overlap with other elements of the chart. By default, the valueAxisFitLabel field is set to false, which means that no adjustments are made to ensure that the marginal labels fit within the axis's client rectangle. If you set this field to true, it specifies that the marginal labels of the value axis are adjusted to fit within the axis's client rectangle, which can help improve readability and prevent overlapping of labels with other chart elements.
Type:
  • boolean
Example
false {boolean}, no change
true {boolean}, the marginal labels are moved to fit the axis's client-rectangle
valueAxisFitLabel

(static) valueAxisPad :number

The valueAxisPad field specifies the padding for labels and title of the value-axis. This option allows you to control the spacing between the value axis labels and title and the axis line, providing better readability and visual separation. By default, the valueAxisPad field is set to 4, which means that there is a 4-pixel padding for the labels and title of the value axis. If you set this field to 0, it specifies that there is no padding for the labels and title of the value axis, which may cause them to be closer to the axis line and potentially harder to read.
Type:
  • number
Example
0 {number}, no padding for for labels and title
4 {number}, sets a 4-pixels padding
valueAxisPad

(static) valueAxisSize :number

The valueAxisSize field specifies the size (width for horizontal axis and height for vertical axis) to display the value-axis (line and ticks). This option allows you to control the visual prominence of the value axis by adjusting its size. By default, the valueAxisSize field is set to 4, which means that the line and ticks of the value axis are shown on a portion of 4 pixels wide for horizontal axes or 4 pixels tall for vertical axes. If you set this field to 0, it specifies that the line and ticks of the value axis are not shown at all, effectively hiding the value axis from view.
Type:
  • number
Example
0 {number}, specifies that the line and ticks of the value-axis is not shown at all
4 {number}, the value-axis line and ticks are shown on a portion of 4-pixels wide
valueAxisSize

(static) valueDistInnerCircular :number

The valueDistInnerCircular field specifies the distance from the edge of the inner circle where the values are displayed. This option allows you to control the positioning of data values in circular-compatible charts, such as radial or pie charts, by specifying how far from the inner edge of the circle the values should be displayed. By default, the valueDistInnerCircular field is set to 0, which means that values are displayed at the center of the circle. If you set this field to a negative value, it specifies that values are displayed inside the circle at a distance proportional to half of the radius of the circle. If you set this field to a positive value, it specifies that values are displayed outside the circle at a distance proportional to half of the radius of the circle.
Type:
  • number
Example
0 {number}, the values are shown in the center of the circle
-0.5 {number}, the values are shown inside the circle at half of its radius
0.5 {number}, the values are shown outside the circle at half of its radius
valueDistInnerCircular

(static) valueDistOuterCircular :number

The valueDistOuterCircular field specifies the distance from the edge of the inner circle where the values are displayed. This option allows you to control the positioning of data values in circular-compatible charts, such as radial or pie charts, by specifying how far from the outer edge of the circle the values should be displayed. By default, the valueDistOuterCircular field is set to 18, which means that values are displayed at a distance of 18 pixels from the outer edge of the circle. If you set this field to a negative value, it specifies that values are displayed inside the circle at a distance proportional to half of the radius of the circle. If you set this field to a positive value, it specifies that values are displayed outside the circle at a distance proportional to half of the radius of the circle.
Type:
  • number
Example
0 {number}, the values are shown in the center of the circle
-0.5 {number}, the values are shown inside the circle at half of its radius
0.5 {number}, the values are shown outside the circle at half of its radius
valueDistOuterCircular

(static) valueLineAddAngle :number

The valueLineAddAngle field specifies the additional angle (in degrees) the value-line is rotated by, as explained:
  • null {null}, no effect
  • negative or 0 {number}, if negative or zero all value-lines are rotated by exact angle
  • positive {number}, if positive the value-lines are rotated additionally by specific angle

The showValue option of the serie specifies whether values, lines, and points are displayed for the serie's data.

By default, the valueLineAddAngle field is set to null, which means that no additional rotation is applied to the value lines. If you set this field to a negative value or zero, it specifies that all value lines are rotated by that exact angle, regardless of whether the values are increasing or decreasing. If you set this field to a positive value, it specifies that the value lines are rotated by their respective angles for increasing or decreasing values (as defined by the valueLineUpAngle and valueLineDownAngle fields), and then additionally rotated by the specified positive angle.

Type:
  • number
Example
0 {number}, shows vertically value-lines (the value is displayed on top)
-180 {number}, shows vertically value-lines (the value is displayed on bottom)
-45 {number}, the value-line is rotated anti-clockwise by 45 degrees
45 {number}, the value-line is rotated additionally by 45 degrees
valueLineAddAngle

(static) valueLineDownAngle :number

The valueLineDownAngle field specifies the angle (in degrees) the value-line is rotated by, when the values goes down. The valueLineUpAngle/valueLineDownAngle has effect for charts of the following types:
  • "area" {string}, an area chart or area graph displays graphically quantitative data. It is based on the line chart. The area between axis and line are commonly emphasized with colors, textures and hatchings. Commonly one compares two or more quantities with an area chart. (data requires array of numbers, supports vertical field, scrollable)
  • "line" {string}, a line chart or line graph, also known as curve chart is a type of chart which displays information as a series of data points called 'markers' connected by straight line segments. It is a basic type of chart common in many fields. It is similar to a scatter plot except that the measurement points are ordered (typically by their x-axis value) and joined with straight line segments. A line chart is often used to visualize a trend in data over intervals of time - a time series - thus the line is often drawn chronologically. In these cases they are known as run charts. (data requires array of numbers, supports vertical field, scrollable)
  • "column" {string}, a column chart or column graph is a chart or graph that presents categorical data with rectangular columns with heights proportional to the values that they represent. A horizontal column chart is called a bar chart. (data requires array of numbers, supports vertical field, scrollable)
  • "waterfall" {string}, a waterfall chart is a form of data visualization that helps in understanding the cumulative effect of sequentially introduced positive or negative values. These intermediate values can either be time based or category based. The waterfall chart is also known as a flying bricks chart or Mario chart due to the apparent suspension of columns (bricks) in mid-air. Often in finance, it will be referred to as a bridge. (data requires array of numbers, supports vertical field, scrollable)
  • "rangeArea" {string}, a range chart displays sets of data points, each of which is defined by multiple values for the same category, and emphasizes the distance between the two values. The category labels are displayed on the category axis. The plain Range chart fills in the area between the top and the bottom value for each data point. (data requires array of array of two-numbers, such as [[from, to]], supports vertical field, scrollable)
  • "rangeColumn" {string}, a range column chart displays information as a range of data by plotting two Y-values (low and high) per data point. The vertical axis shows the values, and the horizontal axis shows the categories they belong to; in multiple-series range column charts, values are grouped by categories. (data requires array of array of two-numbers, such as [[from, to]], supports vertical field, scrollable)

The valueLineUpAngle/valueLineDownAngle fields specify the angle (in degrees) the value-line is rotated by, when the values goes up or down respectively. If the valueLineAddAngle field is set to a positive value, the value lines are rotated by their respective angles for increasing or decreasing values, and then additionally rotated by the specified positive angle.

By default, the valueLineDownAngle field is set to -135, which means that when the values go down, the value-line is rotated by -135 degrees. If you set this field to 0, it specifies that when the values go down, the value-line is shown vertically with the value displayed on bottom. If you set this field to a negative value other than -135, it specifies that when the values go down, the value-line is rotated by that negative angle, which can result in the value being displayed at a different position relative to the data point.

Type:
  • number
Example
0 {number}, shows vertically value-lines (the value is displayed on top)
-180 {number}, shows vertically value-lines (the value is displayed on bottom)
-45 {number}, the value-line is rotated anti-clockwise by 45 degrees
45 {number}, the value-line is rotated clockwidt by 45 degrees
valueLineDownAngle

(static) valueLineExt :number

The valueLineExt field specifies the distance to extend the value-line by. The showValue option of the serie specifies whether values, lines, and points are displayed for the serie's data. The value-line is a line that connects the data point to its value label, and extending it can help improve the visual connection between the data point and its corresponding value, especially when the value labels are positioned away from the data points. By default, the valueLineExt field is set to 4, which means that the value-line is extended by 4 pixels beyond the data point. If you set this field to 0, it specifies that the value-line is not extended beyond the data point, which may result in a shorter line connecting the data point to its value label.
Type:
  • number
Example
null {null}, no effect
4 {number}, the value-line is extended by 4 pixels
valueLineExt

(static) valueLineUpAngle :number

The valueLineUpAngle field specifies the angle (in degrees) the value-line is rotated by, when the values goes up. The valueLineUpAngle/valueLineDownAngle has effect for charts of the following types:
  • "area" {string}, an area chart or area graph displays graphically quantitative data. It is based on the line chart. The area between axis and line are commonly emphasized with colors, textures and hatchings. Commonly one compares two or more quantities with an area chart. (data requires array of numbers, supports vertical field, scrollable)
  • "line" {string}, a line chart or line graph, also known as curve chart is a type of chart which displays information as a series of data points called 'markers' connected by straight line segments. It is a basic type of chart common in many fields. It is similar to a scatter plot except that the measurement points are ordered (typically by their x-axis value) and joined with straight line segments. A line chart is often used to visualize a trend in data over intervals of time - a time series - thus the line is often drawn chronologically. In these cases they are known as run charts. (data requires array of numbers, supports vertical field, scrollable)
  • "column" {string}, a column chart or column graph is a chart or graph that presents categorical data with rectangular columns with heights proportional to the values that they represent. A horizontal column chart is called a bar chart. (data requires array of numbers, supports vertical field, scrollable)
  • "waterfall" {string}, a waterfall chart is a form of data visualization that helps in understanding the cumulative effect of sequentially introduced positive or negative values. These intermediate values can either be time based or category based. The waterfall chart is also known as a flying bricks chart or Mario chart due to the apparent suspension of columns (bricks) in mid-air. Often in finance, it will be referred to as a bridge. (data requires array of numbers, supports vertical field, scrollable)
  • "rangeArea" {string}, a range chart displays sets of data points, each of which is defined by multiple values for the same category, and emphasizes the distance between the two values. The category labels are displayed on the category axis. The plain Range chart fills in the area between the top and the bottom value for each data point. (data requires array of array of two-numbers, such as [[from, to]], supports vertical field, scrollable)
  • "rangeColumn" {string}, a range column chart displays information as a range of data by plotting two Y-values (low and high) per data point. The vertical axis shows the values, and the horizontal axis shows the categories they belong to; in multiple-series range column charts, values are grouped by categories. (data requires array of array of two-numbers, such as [[from, to]], supports vertical field, scrollable)

The valueLineUpAngle/valueLineDownAngle fields specify the angle (in degrees) the value-line is rotated by, when the values goes up or down respectively. If the valueLineAddAngle field is set to a positive value, the value lines are rotated by their respective angles for increasing or decreasing values, and then additionally rotated by the specified positive angle.

By default, the valueLineUpAngle field is set to 45, which means that when the values go up, the value-line is rotated by 45 degrees. If you set this field to 0, it specifies that when the values go up, the value-line is shown vertically with the value displayed on top. If you set this field to a negative value, it specifies that when the values go up, the value-line is rotated by that negative angle, which can result in the value being displayed at a different position relative to the data point.

Type:
  • number
Example
0 {number}, shows vertically value-lines (the value is displayed on top)
-180 {number}, shows vertically value-lines (the value is displayed on bottom)
-45 {number}, the value-line is rotated anti-clockwise by 45 degrees
45 {number}, the value-line is rotated clockwidt by 45 degrees
valueLineUpAngle

(static) valueSizeRange :number|array

The valueSizeRange field specifies the lower and upper margins of the valueSize field. The valueSize field specifies the size to show a column or a bar within the chart of area-compatible type. By default, the valueSizeRange field is set to 2, which means that the lower limit for the valueSize field is 2 pixels, and there is no upper limit. If you set this field to a positive number, it specifies the lower limit for the valueSize field, ensuring that columns or bars are displayed with a minimum size for better visibility. If you set this field to an array of two numbers [min, max], it specifies both the lower and upper limits for the valueSize field, allowing you to control the range of sizes for columns or bars in area-compatible charts. The negative max value indicates that there is no upper limit for the valueSize field.

The valueSizeRange field can be any of the following type:

  • valueSizeRange {number}, specifies the lower limit the valueSize can be
  • valueSizeRange {array}, specifies a two-elements array of [min,max] type that defines the lower and upper margins of the valueSize. The negative max value indicates no upper limit (no effect)
Type:
  • number | array
Example
null {number}, by default, the lower limit the valueSize is 2
4 {number}, specifies the lower limit the valueSize can be is 4
[8,128] {number}, specifies the the valueSize can be between 8 and 128
valueSizeRange