Properties
Data
| Name | Description | Property Type |
|---|---|---|
| data | An array of objects for trend data | Array |
Data Array Object
| Name | Description | Property Type |
|---|---|---|
| name | The name of the data object member | String |
| dataset | Contains the data points for the plot | Dataset |
| containsNaN | Specifies if NaN values are in the dataset | Boolean |
| isSorted | Specifies if the values in the dataset are sorted | Boolean |
Example of Data Prop:
It is helpful to have the the dataset structured with timestamp in the first column.
Plots: (Future Release)
| Name | Description | Property Type |
|---|---|---|
Axes
| Name | Description | Property Type |
|---|---|---|
| axes | An object containing defined axes arrays for both x and y | Object |
X Axis Array Object
| Name | Description | Property Type |
|---|---|---|
| name | The name of the axis | String |
| plot | The type of plot displayed. Default value is default | String |
| type | The axis type for the plot | Object |
| title | The title for the axis | Object |
| units | Specifies the units of measure for axis title | String |
| border | Control for the axis border | Object |
| range | Controls the range of the axis | Object |
| position | Controls the position of the axis on the chart. Options are Left, Right, Up, and Down | String |
| label | The label configuration for the axis | Object |
Type
| Name | Description | Property Type |
| CategoryAxis | Text axis suitable to chart out text based items or categories | String |
| DateTimeNumericAxis | Value axis suitable when the axis data is DateTime | String |
| NumericAxis | Value axis suitable when the axis data is numeric | String |
| LogarithmicAxis | Value axis suitable for numeric data to be presented in logarithmic | String |
Title
| Name | Description | Property Type | Default |
| text | The displayed axis title | String | X Axis |
| fontSize | Font configuration for the title | Double | 12 |
| fontFamily | Specifies the font for the title. Examples are Arial, Times, etc. | String | Arial |
| color | Specifies the color for the title | String | --neutral-90 |
Border
| Name | Description | Property Type | Default |
| color | Controls the border color | String | --neutral-90 |
| width | Controls the border thickness of the axis | Double | 1 |
Label
| Name | Description | Property Type | Default |
| provider | See details for this object and its members below... | NoFormat | |
| fontSize | Font size configuration for the label | Double | 12 |
| fontFamily | Specifies the font family for the label. Examples are Arial, Times, etc. | String | Arial |
| color | Specifies the color for the label | Hex | --neutral-90 |
Range.Auto
| Name | Description | Property Type |
| Always | Sets the axis range to automatic | String |
| Never | Sets the axis range to manual. A min and max range value is required to set the range | String |
| Once | ?????? | String |
Y Axis Array Object
| Name | Description | Property Type |
|---|---|---|
| name | The name of the axis | String |
| plot | The type of plot displayed. Default value is default | String |
| type | The axis type for the plot | Object |
| title | The title for the axis | Object |
| units | Specifies the units of measure for axis title | String |
| border | Control for the axis border | Object |
| range | Controls the range of the axis | Object |
| position | Controls the position of the axis on the chart. Options are Left, Right, Up, and Down | String |
| label | The label configuration for the axis | Object |
Type
| Name | Description | Property Type |
| CategoryAxis | Text axis suitable to chart out text based items or categories | String |
| DateTimeNumericAxis | Value axis suitable when the axis data is DateTime | String |
| NumericAxis | Value axis suitable when the axis data is numeric | String |
| LogarithmicAxis | Value axis suitable for numeric data to be presented in logarithmic | String |
Title
| Name | Description | Property Type | Default |
| text | The displayed axis title | String | Y Axis |
| fontSize | Font configuration for the title | Double | 12 |
| fontFamily | Specifies the font for the title. Examples are Arial, Times, etc. | String | Arial |
| color | Specifies the color for the title | String | --neutral-90 |
Border
| Name | Description | Property Type | Default |
| color | Controls the border color | String | --neutral-90 |
| width | Controls the border thickness of the axis | Double | 1 |
Label
| Name | Description | Property Type | Default |
| provider | See details for this object and its members below... | NoFormat | |
| fontSize | Font size configuration for the label | Double | 12 |
| fontFamily | Specifies the font family for the label. Examples are Arial, Times, etc. | String | Arial |
| color | Specifies the color for the label | Hex | --neutral-90 |
Range.Auto
| Name | Description | Property Type |
| Always | Sets the axis range to automatic | String |
| Never | Sets the axis range to manual. A min and max range value is required to set the range | String |
| Once | ?????? | String |
Provider
| Name | Description | Property Type |
|---|---|---|
| provider | An object containing formats for the axis label | Object |
Provider Members
| Name | Description | Property Type |
|---|---|---|
| NoFormat | Specifies No Formatting to the axis labels (defaults to integer whole values) | String |
| Decimal | Formats the axis labels with a single decimal place | String |
| SignificantFigures | Formats the axis labels as a whole number (no decimal places) | String |
| Date_DDMMYYYY | Formats the axis label to DateTime (eg. 12/31/1969) | String |
| Date_DDMMYY | Formats the axis label to DateTime (eg. 01/01/70) | String |
| Date_DDMMHHMM | Formats the axis label to DateTime (eg. 01/01 00:00) | String |
| Date_DDMM | Formats the axis label to DateTime (eg. 01/01/70) | String |
| Date_HHMM | Formats the axis label to DateTime (eg. 01/01) | String |
| Date_HHMMSS | Formats the axis label to DateTime (eg. 00:00) | String |
| Exponential | Formats the axis label to exponential notation (eg. 2.0e+1) | String |
| Scientific | Formats the axis label to scientific notation (eg. 3x10³) | String |
Pens Array Object
| Name | Description | Property Type |
|---|---|---|
| An array of pens to display on the graph | Array | |
| name | The name of the pen to be displayed in the legend on the chart | String |
| visible | Determines if the pen is visible on the chart or not | Boolean |
| type | The chart type desired. Options are Line, Scatter, Column, Mountain and Spline | String |
| interpolationPoints | Used with the Spline type curve to set the interpolation filter - a higher value results in a smoother waveform - only visible when MountainSpline or Spline curves are selected | Integer |
| axis | Defines the axes (x and y) for the selected pen | Object |
| data | Defines where the data for the pen is coming from | |
| stroke | Configuration of the line on the chart corresponding to a specific pen | Object |
Type
| Name | Description | Property Type |
| Line | String | |
|
Scatter |
String | |
| Column | String | |
| Mountain | String | |
| MountainSpline | String | |
| Spline | String |
Axis
| Name | Description | Property Type |
| x | Sets the pen x axis to the named x axis in the axes array object | String |
|
y |
Sets the pen y axis to the named y axis in the axes array object | String |
Data
| Name | Description | Property Type |
| name | The name for where the data for the pen is coming from - corresponds to the name member of the Data array object | String |
| xColumnName | The column from the dataset in the Data array that is to be used for the X axis | String |
| yColumnName | The column from the dataset in the Data array that is to be used for the Y axis | String |
Stroke
| Name | Description | Property Type |
| color | The color applied to the line stroke | String |
| dashArray | The spacing between dashes of the line stroke | Array |
| opacity | The opacity to apply to the line stroke (numeric value) | Integer |
| width | The width to apply to the line stroke (numeric value) | Integer |
ADD SCREENSHOT OF PENS????
When configuring pens, it is important to ensure that the pen axes correspond to the specific x and y axes that are configured in the props section (see below).
Chart
| Name | Description | Property Type |
|---|---|---|
| height | The size of the chart on the y axis (as a %) | Integer |
| legend | Props for the legend at the top left | Integer |
Legend
| Name | Description | Property Type |
|---|---|---|
| visible | Determines whether the legend is displayed on the chart | Boolean |
| showCheckBoxes | Determines whether the checkboxes in the legend are displayed | Boolean |
Theme
| Name | Description | Property Type | Default |
| axisBorder | String |
--neutral-90 | |
| axistitleColor | String |
--neutral-90 | |
| annotationsGripsBackroundBrush | String |
--neutral-90 | |
| annotationsGripsBorderBrush | String |
--neutral-90 | |
| axis3DBandsFill | String |
transparent | |
| axisBandsFill | String |
transparent | |
| axisPlaneBackgroundFill | String |
transparent | |
| chartTitleColor | String |
--neutral-90 | |
| columnFillBrush | String |
transparent | |
| columnLineColor | String |
transparent | |
| cursorLineBrush | String |
--neutral-90 |
|
| defaultColorMapBrush | Object |
||
| downBandSeriesFillColor | String |
transparent | |
| downBandSeriesLineColor | String |
transparent | |
| downBodyBrush | String |
transparent | |
| downWickColor | String |
transparent | |
| gridBackgroundBrush | String |
transparent | |
| gridBorderBrush | String |
transparent | |
| labelBackgroundBrush | String |
transparent | |
| labelBorderBrush | String |
transparent | |
| labelForegroundBrush | String |
--neutral-90 |
|
| legendBackgroundBrush | String |
--neutral-20 |
|
| lineSeriesColor | String |
--neutral-50 |
|
| loadingAnimationBackground | String | --neutral-10 | |
| loadingAnimationForeground | String | --neutral-90 | |
| majorGridLineBrush | String | --neutral-30 | |
| minorGridLineBrush | String | --neutral-20 | |
| mountainAreaBrush | String | --neutral-90 | |
| mountainLineColor | String | --neutral-90 | |
| overviewFillBrush | String | --neutral-90 | |
| planeBorderColor | String | --neutral-90 | |
| rolloverLineBrush | String | --neutral-90 | |
| rubberBandFillBrush | String | --neutral-90 | |
| rubberBandStrokeBrush | String | --neutral-90 | |
| sciChartBackground | String | --neutral-10 | |
| scrollbarBackgroundBrush | String | --neutral-90 | |
| scrollbarBorderBrush | String | --neutral-90 | |
| scrollbarGripsBackgroundBrush | String | --neutral-90 | |
| scrollbarViewportBackgroundBrush | String | --neutral-90 | |
| scrollbarViewportBorderBrush | String | --neutral-90 | |
| shadowEffectColor | String | --neutral-90 | |
| textAnnotationBackground | String | --neutral-10 | |
| textAnnotationForeground | String | --neutral-90 | |
| tickTextBrush | String | --neutral-90 | |
| upBandSeriesFillColor | String | --neutral-90 | |
| upBandSeriesLineColor | String | --neutral-90 | |
| upBodyBrush | String | --neutral-90 | |
| upWickColor | String | --neutral-90 |
defaultColorMapBrush
| Name | Description | Property Type | Default |
| 0.offset | Double | 0 | |
| 0.color | String | --neutral-10 | |
|
1.offset |
Double | 0.5 | |
| 1.color | --neutral-20 |
||
| 2.offset | Double | 1 | |
| 2.color | |||
--neutral-30 |