Axis that the ZoomBandChart is attached to. This can be X or Y Axis.
The Band of the ZoomBandChart.
Public, safe interface of rendering engine.
Add a stand-alone LegendBox using a builder.
Type of UIElement that is specified by 'builder'-parameter.
LegendBoxBuilder. If omitted, HorizontalLegendBox will be selected. Use LegendBoxBuilders for selection.
Optional custom scale to position LegendBox on. Defaults to whole chart in percentages [0, 100].
LegendBox that fulfills interfaces: UIElementType (typeparam) and UIElement
Add a stand-alone UIElement using a builder.
Type of UIElement that is specified by 'builder'-parameter.
Optional custom scale to position UIElement on. Defaults to whole component in percentages [0, 100].
Object that fulfills interfaces: UIElementType (typeparam) and UIElement
Permanently dispose the component.
To fully allow Garbage-Collection to free the resources used by the component, make sure to remove any references to the component and its children in application code.
let chart = ...ChartXY()
let axisX = chart.getDefaultAxisX()
// Dispose Chart, and remove all references so that they can be garbage-collected.
chart.dispose()
chart = undefined
axisX = undefinedObject itself for fluent interface
Dispose a Series reference from the ZoomBandChart.
This ensures that all resources that were previously allocated for this series instance are released for Garbage Collection.
Series object.
Object itself.
Get fillstyle of chart background.
FillStyle
Get stroke style of chart background.
LineStyle
Get fillstyle of chart background. This is the area enclosed by the axis'.
FillStyle
Get stroke style of chart background. This is the area enclosed by the axis'.
LineStyle
Get the X Axis of the ZoomBandChart.
Axis
Get the Y Axis of the ZoomBandChart.
Axis
Get minimum size of Panel. Depending on the type of class this value might be automatically computed to fit different elements.
Point minimum size or undefined if unimplemented
Get padding around Chart in pixels.
Padding datastructure
Get text of Chart title.
Chart title as a string.
Get fill style of Chart Title.
FillStyle object
Get font of Chart title.
FontSettings object
Padding after Chart title
Padding before Chart title
Capture rendered state in an image file. Prompts the browser to download the created file.
NOTE: The download might be blocked by browser/plugins as harmful. To prevent this, only call the method in events tied to user-interactions. From mouse-event handlers, for example.
Has two optional parameters which directly reference JavaScript API HTMLCanvasElement.toDataURL. For supported image formats, compression quality, Etc. refer to:
https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasElement/toDataURL
Example usage:
// Download 'screenshot.png'
saveToFile('screenshot')
// Attempt download 'maybeNotSupported.bmp'
saveToFile('maybeNotSupported', 'image/bmp')
// Attempt download jpeg.file with specified compression quality
saveToFile('fileName', 'image/jpeg', 0.50)Name of prompted download file as string. File extension shouldn't be included as it is automatically detected from 'type'-argument.
A DOMString indicating the image format. The default format type is image/png.
A Number between 0 and 1 indicating the image quality to use for image formats that use lossy compression such as image/jpeg and image/webp. If this argument is anything else, the default value for image quality is used. The default value is 0.92.
Set fillStyle of panel background.
FillStyle or function which modifies it
Object itself
Set stroke style of panel background.
LineStyle or function which modifies it
Object itself
Set fillStyle of chart background. This is the area enclosed by the axis'.
FillStyle or mutator to modify existing one
Object itself
Set stroke of chart background. This is the area enclosed by the axis'.
LineStyle or mutator to modify existing one
Object itself
Set padding around Chart in pixels.
Number with pixel margins for all sides or datastructure with individual pixel paddings for each side. Any side can be omitted, only passed values will be overridden.
Object itself for fluent interface
Set style of Series of ZoomBandChart.
ZoomBandChart creates series automatically based on the Series attached to the ZoomBandCharts reference Axis, that is specified when it is created. This method lets the user specify a function that is called on each Series created by ZoomBandChart, allowing the full configuration of these Series.
Set text of Chart title.
Chart title as a string.
Object itself for fluent interface.
Set fill style of Chart Title.
Example usage:
// Create a new style
ZoomBandChart.setTitleFillStyle(new SolidFill({ color: ColorHEX('#F00') }))
// Change transparency
ZoomBandChart.setTitleFillStyle((solidFill) => solidFill.setA(80))
// Set hidden
ZoomBandChart.setTitleFillStyle(emptyFill)Either a FillStyle object or a function, which will be used to create a new FillStyle based on current value.
Chart itself
Set font of Chart Title.
Example usage:
// Create a new FontSettings
ZoomBandChart.setTitleFont(new FontSettings({ size: 24, style: 'italic' }))
// Change existing settings
ZoomBandChart.setTitleFont((fontSettings) => fontSettings.setWeight('bold'))Either a FontSettings object or a function, which will be used to create a new FontSettings based on current value.
Chart itself
Specifies padding after chart title.
This does not have an effect if title is hidden (empty FillStyle).
Gap after the chart title in pixels.
Chart itself for fluent interface
Specifies padding before chart title.
This does not have an effect if title is hidden (empty FillStyle).
Gap between the top of chart and its title in pixels.
Chart itself for fluent interface
Chart that is attached to a single Axis of a ChartXY.
It shows a compilation of all data from all Series that are attached to that Axis, and allows the user to configure the view of the attached Axis easily by interacting with a Band on the ZoomBandChart.
Created with Dashboard.createZoomBandChart.
const dashboard = lightningChart().Dashboard( { numberOfColumns: 1, numberOfRows: 4 } ) const chart = dashboard.createChartXY( { columnIndex: 0, columnSpan: 1, rowIndex: 0, rowSpan: 3 }) const zoomBandChart = dashboard.createZoomBandChart({ columnIndex: 0, columnSpan: 1, rowIndex: 3, rowSpan: 1, axis: chart.getDefaultAxisX() }) const line = chart.addLineSeries() createProgressiveTraceGenerator() .setNumberOfPoints( 1000 ) .generate() .toPromise() .then( data => line.add( data ) )