Protected _keepReadonly scaleAdd callback function to be triggered when specified event is fired.
// Example syntax
object.addEventListener('click', (event) => {
console.log(event)
})
Some classes also report extra information about the interacted object with the second parameter:
// Most series share information about interacted data point
series.addEventListener('click', (event, info) => {
console.log(info)
})
Optional third parameter allows registering event handlers that will automatically remove themselves after first trigger:
// Example this listener will only fire once
object.addEventListener('click', (event) => {})
Each class has its own list of supported events.
Some events are from HTML standard (click, pointerdown, etc.),
while others are own events from LightningChart JS (dispose, resize, etc.)
To find what events are available, you can try following:
TypeScript enabled, just write addEventListener and see what possible event types the IDE suggests. These APIs are strongly typed, and even the callback event will be correctly typed.K type parameter extends.Callback function that is triggered when event is fired.
Optional options: LCJSAddEventListenerOptionsOptional extra configuration options.
Permanently destroy 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 = undefined
Object itself for fluent interface
Remove event listener added using addEventListener.
The expected argument should be the exact same callback function that was supplied using addEventListener:
// Basic example syntax
const listener = () => {}
obj.addEventListener('click', listener)
obj.removeEventListener('click', listener)
// Basic boilerplate of custom interaction when user drags on an object
obj.addEventListener('pointerdown', (eventDown) => {
let prevCoord = eventDown
const handlePointerMove: LCJSInteractionEventListener<'pointermove'> = (eventMove) => {
const delta = { x: eventMove.clientX - prevCoord.clientX, y: eventMove.clientY - prevCoord.clientY }
prevCoord = eventMove
console.log(delta, eventMove.clientX, eventMove.clientY)
}
const handlePointerUp: LCJSInteractionEventListener<'pointerup'> = (eventUp) => {
window.removeEventListener('pointermove', handlePointerMove)
window.removeEventListener('pointerup', handlePointerUp)
}
window.addEventListener('pointermove', handlePointerMove)
window.addEventListener('pointerup', handlePointerUp)
})
Listener that was added using addEventListener.
Set auto-fit strategy of Cursor. Affects logic of automatic fitting of Cursors ResultTable to the screen.
Object itself for fluent interface
Optional autoFitStrategy: AutoFitStrategyFactoryAutoFitStrategy factory or undefined to disable auto-fitting
Set style of x gridstroke
Object itself for fluent interface
LineStyle object
Set lineStyle of y gridstroke
Object itself for fluent interface
LineStyle object
Beta
Method that allows enabling a secondary cursor auto fit behavior. Normally, auto fitting tries to keep the cursor result table within the boundaries of the whole chart.
By enabling this alternate behavior, the cursor will try to keep result table within the boundaries of pointed axes. This means, for example:
// Example syntax
chart.setCursor(cursor => cursor
.setKeepWithinAxisBoundaries(true)
)
Object itself.
Introduced in v6.1. May change according to user feedback.
Boolean
Mutator function for Cursors PointMarker. PointMarker is a visual that is displayed at the Cursors position
Object itself for fluent interface
Mutator function for PointMarker
Mutator function for Cursors ResultTable. ResultTable is a visual that displays currently pointed data next to its location
Object itself for fluent interface
Mutator function for ResultTable
Mutator function for x tick marker. Applies function to current tick marker if it exists and for any newly created tick marker in order of adding.
Object itself
Method can't currently be implemented in a clean way so its usage currently will consume unneeded memory. It's repeating usage should be avoided for now.
Mutator function for TickMarker
Mutator function for y tick marker. Applies function to current tick marker if it exists and for any newly created tick marker in order of adding.
Object itself
Method can't currently be implemented in a clean way so its usage currently will consume unneeded memory. It's repeating usage should be avoided for now.
Mutator function for TickMarker
Configure whether tick markers allocate space on Axis or not. Defaults to false to prevent cursor visibility from changing chart layout.
Object itself.
Boolean.
Extended auto fit configuration; if true considers cursor "out of scale" if result table bounds go outside currently nearest pointed AXIS bounds. This is specifically intended for stacked axis use cases that utilize HTML interop (meaning there is some HTML content that can block the cursor from being visible)