Options
All
  • Public
  • Public/Protected
  • All
Menu

Class PolarChart<CursorPointMarkerType, CursorResultTableBackgroundType>

Chart for visualizing data in a Polar coordinate system ( angle + amplitude ). It has a multitude of methods for adding various types of Series. For example:

PolarCharts Axes can be styled similarly as those of ChartXY. Refer to them via methods:

Charts are created by methods of LightningChart interface or a Dashboard.

Index

Properties

Methods

Properties

Readonly engine

engine : PublicEngine

Public, safe interface for Panels rendering engine.

pixelScale

pixelScale : LinearScaleXY

Scale for panel area in pixels.

uiScale

uiScale : LinearScaleXY

Scale for panel area in percentages (0-100).

Methods

addAreaSeries

  • Add a Area series to the PolarChart.

    [[PolarAreaSeries]] are used to render a list of PolarPoints by filling the enclosed area.

    Example usage:

    • Plot sub section (< 360 degrees) of the Polar Chart

      const areaSeries = polarChart.addAreaSeries()
         .setData(
             new Array( 90 ).fill( 0 ).map(( _, i ) => ({
                 angle: i,
                 amplitude: 60 + 25 * Math.cos( 5 * i * Math.PI / 180 )
             }))
         )
      
    • Plot a fully connected (360 degrees) section of the Polar Chart

      const areaSeries = polarChart.addAreaSeries()
         .setConnectDataAutomaticallyEnabled(true)
         .setData(
             new Array(360).fill(0).map((_, i) => ({
                 angle: i,
                 amplitude: 60 + 25 * Math.cos((5 * i * Math.PI) / 180),
             })),
         )
      

    Returns PolarAreaSeriesInterior

    [[PolarAreaSeries]].

addLegendBox

  • Add a legendbox.

    Legendbox is a type of UI element, that floats inside the chart/component it is created inside. It can be freely moved around with user interactions, as well as positioned in application code.

    The purpose of legendbox is to describe the series and other visual components of the chart, by displaying their names and colors. Hovering over a series' legendbox entry will highlight that series, and clicking on the entry will toggle that series' visibility.

    Legendbox alignment:

    Alignment of legendbox can be selected by supplying one of the available LegendBoxBuilders to addLegendBox:

     // Default (vertical) LegendBox.
     const legendBox = ChartXY.addLegendBox()
    
     // Horizontal LegendBox.
     const horizontalLegendBox = ChartXY.addLegendBox(LegendBoxBuilders.HorizontalLegendBox)
    

    Custom Legendbox positioning:

    By default LegendBoxes are placed on the right side, or bottom of the chart (depending on alignment).

    A custom location can be configured with UIElement API:

    Position coordinate system is specified when creating legendbox.

    1. LegendBox with default positioning coordinate system.
     addLegendBox( LegendBoxBuilders.VerticalLegendBox )
         // Position = [0, 100] as percentages.
         .setPosition({ x: 50, y: 50 })
    
    1. Position in pixel coordinate system.
     addLegendBox( LegendBoxBuilders.VerticalLegendBox, chart.pixelScale )
         // Position = pixels.
         .setPosition({ x: 300, y: 100 })
    
    1. Position on Axes.
     addLegendBox( LegendBoxBuilders.VerticalLegendBox, { x: chartXY.getDefaultAxisX(), y: chartXY.getDefaultAxisY() } )
         // Position = Axis values.
         .setPosition({ x: 5, y: 5 })
    

    Parameters

    • builder: UILegendBoxBuilder

      LegendBoxBuilder. If omitted, VerticalLegendBox will be selected. Use LegendBoxBuilders for selection.

    • scale: UserScaleDefinition

      Optional parameter for altering the coordinate system used for positioning the LegendBox. Defaults to whole Chart in percentages [0, 100].

    Returns LegendBox & UIElement

    Object with two interfaces: LegendBox and UIElement.

addLineSeries

  • Add a Line series to the PolarChart.

    PolarLineSeries are used to render a list of PolarPoints by a continuous line that can be styled arbitrarily.

    Example usage:

     const lineSeries = polarChart.addLineSeries().setData(
         new Array( 90 ).fill( 0 ).map(( _, i ) => ({
             angle: i,
             amplitude: 60 + 25 * Math.cos( 5 * i * Math.PI / 180 )
         }))
     )
    

    Returns PolarLineSeries

    PolarLineSeries.

addPointLineSeries

  • Add a Point Line series to the PolarChart.

    PolarPointLineSeries are used to render a list of PolarPoints by a continuous line drawn between the points plus configurable shapes over each data point.

    Example usage:

     const pointLineSeries = polarChart.addPointLineSeries().setData(
         new Array( 90 ).fill( 0 ).map(( _, i ) => ({
             angle: i,
             amplitude: 60 + 25 * Math.cos( 5 * i * Math.PI / 180 )
         }))
     )
    

    Returns PolarPointLineSeries

    PolarPointLineSeries.

addPointSeries

  • Add a Point series to the PolarChart.

    PolarPointSeries are used to render a list of PolarPoints by different shapes.

    Example usage:

     const pointSeries = polarChart.addPointSeries().setData(
         new Array( 90 ).fill( 0 ).map(( _, i ) => ({
             angle: i,
             amplitude: 60 + 25 * Math.cos( 5 * i * Math.PI / 180 )
         }))
     )
    

    Returns PolarPointSeries

    PolarPointSeries.

addPolygonSeries

  • Add a Polygon series to the PolarChart.

    PolarPolygonSeries are used to render a collection of polygons inside the Polar coordinate system. They are especially useful for highlighting parts of the Polar coordinate system.

    Example usage:

     const polygonSeries = polarChart.addPolygonSeries()
     let ang = 45
     let amplitude = 50
     const polygon = polygonSeries.addPolygon()
         .setGeometry([
             { angle: (ang += 10), amplitude: (amplitude += 10) },
             { angle: (ang += 10), amplitude: (amplitude += 5) },
             { angle: (ang += 10), amplitude: (amplitude += 10) },
             { angle: (ang += 10), amplitude: (amplitude -= 5) },
             { angle: (ang += 10), amplitude: (amplitude += 5) },
             { angle: (ang += 5), amplitude: (amplitude -= 5) },
             { angle: (ang += 0), amplitude: (amplitude -= 10) },
             { angle: (ang -= 5), amplitude: (amplitude -= 5) },
             { angle: (ang -= 10), amplitude: (amplitude -= 10) },
             { angle: (ang -= 10), amplitude: (amplitude -= 5) },
             { angle: (ang -= 10), amplitude: (amplitude += 5) },
             { angle: (ang -= 10), amplitude: (amplitude += 10) },
         ])
    

    Returns PolarPolygonSeries

    PolarPolygonSeries.

addSector

addUIElement

  • Add a stand-alone UIElement using a builder.

    Example usage:

    1. TextBox with default positioning coordinate system.
     addUIElement( UIElementBuilders.TextBox )
         // Position = [0, 100] as percentages.
         .setPosition({ x: 50, y: 50 })
    
    1. Position in pixel coordinate system.
     addUIElement( UIElementBuilders.TextBox, chart.pixelScale )
         // Position = pixels.
         .setPosition({ x: 300, y: 100 })
    
    1. Position on Axes.
     addUIElement( UIElementBuilders.TextBox, { x: chartXY.getDefaultAxisX(), y: chartXY.getDefaultAxisY() } )
         // Position = Axis values.
         .setPosition({ x: 5, y: 5 })
    

    Type parameters

    • UIElementType: UIPart = UITextBox

      Type of UIElement that is specified by 'builder'-parameter.

    Parameters

    • builder: UIElementBuilder<UIElementType>

      UIElementBuilder. If omitted, TextBoxBuilder will be selected. Use UIElementBuilders for selection.

    • scale: UserScaleDefinition

      Optional parameter for altering the coordinate system used for positioning the UIElement. Defaults to whole Chart in percentages [0, 100].

    Returns UIElementType & UIElement

    Object that fulfills interfaces: UIElementType (typeparam) and UIElement

disableAnimations

  • disableAnimations(): this
  • Disable all animations for the chart.

    All animations have to be re-enabled individually if you wish to re-enable animations.

    deprecated

    Deprecated in v3.1.0. Will be removed in v4.0.0. Use setAnimationsEnabled instead.

    Returns this

    Chart itself for fluent interface.

dispose

  • dispose(): this
  • 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 = undefined
    

    Returns this

    Object itself for fluent interface

forEachAxis

  • forEachAxis(clbk: function): void
  • Iterate over each Axis of Chart.

    Parameters

    • clbk: function

      Callback function for each Axis.

        • Parameters

          • axis: PolarAxis

          Returns void

    Returns void

getAmplitudeAxis

getAnimationsEnabled

  • getAnimationsEnabled(): boolean
  • Get animations disable/enable state.

    Returns boolean

    Animations default state.

getAutoCursor

  • getAutoCursor(): AutoCursor<CursorPointMarkerType, CursorResultTableBackgroundType>
  • Get reference to charts AutoCursor.

    See AutoCursorXY for all available methods for configuring the AutoCursor.

    Returns AutoCursor<CursorPointMarkerType, CursorResultTableBackgroundType>

    AutoCursor.

getAutoCursorMode

getBackgroundFillStyle

  • Get fillstyle of chart background.

    Returns FillStyle

    FillStyle

getBackgroundStrokeStyle

  • Get stroke style of chart background.

    Returns LineStyle

    LineStyle

getMinimumSize

  • getMinimumSize(): Point | undefined
  • Get minimum size of Panel. Depending on the type of class this value might be automatically computed to fit different elements.

    Returns Point | undefined

    Vec2 minimum size or undefined if unimplemented

getMouseInteractions

  • getMouseInteractions(): boolean
  • Get are mouse-interactions on chart enabled or not

    Returns boolean

    Boolean flag

getPadding

  • Get padding around Chart in pixels.

    Returns Margin

    Padding datastructure

getRadialAxis

getSeries

  • getSeries(): PolarSeries[]
  • Get reference to all series inside PolarChart.

    Returns PolarSeries[]

    List of Polar series.

getSeriesBackgroundFillStyle

  • Get FillStyle of Series background area (area behind series).

    Returns FillStyle

    FillStyle

getSeriesBackgroundStrokeStyle

  • getSeriesBackgroundStrokeStyle(): LineStyle
  • Get Stroke style of Series background area (area behind series).

    Returns LineStyle

    LineStyle

getTheme

  • Returns the Theme currently being used.

    Returns Theme

    An object containing the Theme.

getTitle

  • getTitle(): string
  • Get text of Chart title.

    Returns string

    Chart title as a string.

getTitleFillStyle

  • Get fill style of Chart Title.

    Returns FillStyle

    FillStyle object

getTitleFont

  • Get font of Chart title.

    Returns FontSettings

    FontSettings object

getTitleMarginBottom

  • getTitleMarginBottom(): number
  • Returns number

    Padding after Chart title

getTitleMarginTop

  • getTitleMarginTop(): number
  • Returns number

    Padding before Chart title

getTitleRotation

  • getTitleRotation(): number
  • Get rotation of Chart title.

    Returns number

    Rotation in degrees

offBackgroundMouseClick

  • offBackgroundMouseClick(token: Token): boolean
  • Remove subscription from mouse-click event on Chart background

    Parameters

    • token: Token

      Event listener

    Returns boolean

    True if the listener is successfully removed and false if it is not found

offBackgroundMouseDoubleClick

  • offBackgroundMouseDoubleClick(token: Token): boolean
  • Remove subscription from mouse-doubleClick event on Chart background

    Parameters

    • token: Token

      Event listener

    Returns boolean

    True if the listener is successfully removed and false if it is not found

offBackgroundMouseDown

  • offBackgroundMouseDown(token: Token): boolean
  • Remove subscription from mouse-down event on Chart background

    Parameters

    • token: Token

      Event listener

    Returns boolean

    True if the listener is successfully removed and false if it is not found

offBackgroundMouseDrag

  • offBackgroundMouseDrag(token: Token): boolean
  • Remove subscription from mouse-drag event on Chart background

    Parameters

    • token: Token

      Event listener

    Returns boolean

    True if the listener is successfully removed and false if it is not found

offBackgroundMouseDragStart

  • offBackgroundMouseDragStart(token: Token): boolean
  • Remove subscription from mouse-dragStart event on Chart background

    Parameters

    • token: Token

      Event listener

    Returns boolean

    True if the listener is successfully removed and false if it is not found

offBackgroundMouseDragStop

  • offBackgroundMouseDragStop(token: Token): boolean
  • Remove subscription from mouse-dragStop event on Chart background

    Parameters

    • token: Token

      Event listener

    Returns boolean

    True if the listener is successfully removed and false if it is not found

offBackgroundMouseEnter

  • offBackgroundMouseEnter(token: Token): boolean
  • Remove subscription from mouse-enter event on Chart background

    Parameters

    • token: Token

      Event listener

    Returns boolean

    True if the listener is successfully removed and false if it is not found

offBackgroundMouseLeave

  • offBackgroundMouseLeave(token: Token): boolean
  • Remove subscription from mouse-leave event on Chart background

    Parameters

    • token: Token

      Event listener

    Returns boolean

    True if the listener is successfully removed and false if it is not found

offBackgroundMouseMove

  • offBackgroundMouseMove(token: Token): boolean
  • Remove subscription from mouse-move event on Chart background

    Parameters

    • token: Token

      Event listener

    Returns boolean

    True if the listener is successfully removed and false if it is not found

offBackgroundMouseTouchStart

  • offBackgroundMouseTouchStart(token: Token): boolean
  • Remove subscription from touch-start event on Chart background

    Parameters

    • token: Token

      Event listener

    Returns boolean

    True if the listener is successfully removed and false if it is not found

offBackgroundMouseUp

  • offBackgroundMouseUp(token: Token): boolean
  • Remove subscription from mouse-up event on Chart background

    Parameters

    • token: Token

      Event listener

    Returns boolean

    True if the listener is successfully removed and false if it is not found

offBackgroundMouseWheel

  • offBackgroundMouseWheel(token: Token): boolean
  • Remove subscription from mouse-wheel event on Chart background

    Parameters

    • token: Token

      Event listener

    Returns boolean

    True if the listener is successfully removed and false if it is not found

offBackgroundTouchEnd

  • offBackgroundTouchEnd(token: Token): boolean
  • Remove subscription from touch-end event on Panel background

    Parameters

    • token: Token

      Event listener

    Returns boolean

    True if the listener is successfully removed and false if it is not found

offBackgroundTouchMove

  • offBackgroundTouchMove(token: Token): boolean
  • Remove subscription from touch-move event on Chart background

    Parameters

    • token: Token

      Event listener

    Returns boolean

    True if the listener is successfully removed and false if it is not found

offResize

  • offResize(token: Token): boolean
  • Remove event listener from resize event.

    Parameters

    • token: Token

      Token of event listener which has to be removed

    Returns boolean

    True if the listener is successfully removed and false if it is not found

offSeriesBackgroundMouseClick

  • offSeriesBackgroundMouseClick(token: Token): boolean
  • Remove event listener from mouse-click event on Series Background

    Parameters

    • token: Token

    Returns boolean

offSeriesBackgroundMouseDoubleClick

  • offSeriesBackgroundMouseDoubleClick(token: Token): boolean
  • Remove event listener from mouse-doubleClick event on Series Background

    Parameters

    • token: Token

    Returns boolean

offSeriesBackgroundMouseDown

  • offSeriesBackgroundMouseDown(token: Token): boolean
  • Remove event listener from mouse-down event on Series Background

    Parameters

    • token: Token

    Returns boolean

offSeriesBackgroundMouseDrag

  • offSeriesBackgroundMouseDrag(token: Token): boolean
  • Remove event listener from mouse-drag event on Series Background

    Parameters

    • token: Token

    Returns boolean

offSeriesBackgroundMouseDragStart

  • offSeriesBackgroundMouseDragStart(token: Token): boolean
  • Remove event listener from mouse-drag start event on Series Background

    Parameters

    • token: Token

    Returns boolean

offSeriesBackgroundMouseDragStop

  • offSeriesBackgroundMouseDragStop(token: Token): boolean
  • Remove event listener from mouse-drag stop event on Series Background

    Parameters

    • token: Token

    Returns boolean

offSeriesBackgroundMouseEnter

  • offSeriesBackgroundMouseEnter(token: Token): boolean
  • Remove event listener from mouse-enter event on Series Background

    Parameters

    • token: Token

    Returns boolean

offSeriesBackgroundMouseLeave

  • offSeriesBackgroundMouseLeave(token: Token): boolean
  • Remove event listener from mouse-leave event on Series Background

    Parameters

    • token: Token

    Returns boolean

offSeriesBackgroundMouseMove

  • offSeriesBackgroundMouseMove(token: Token): boolean
  • Remove event listener from mouse-move event on Series Background

    Parameters

    • token: Token

    Returns boolean

offSeriesBackgroundMouseUp

  • offSeriesBackgroundMouseUp(token: Token): boolean
  • Remove event listener from mouse-up event on Series Background

    Parameters

    • token: Token

    Returns boolean

offSeriesBackgroundMouseWheel

  • offSeriesBackgroundMouseWheel(token: Token): boolean
  • Remove event listener from mouse-wheel event on Series Background

    Parameters

    • token: Token

    Returns boolean

offSeriesBackgroundTouchEnd

  • offSeriesBackgroundTouchEnd(token: Token): boolean
  • Remove event listener from touch end event on Series Background

    Parameters

    • token: Token

    Returns boolean

offSeriesBackgroundTouchMove

  • offSeriesBackgroundTouchMove(token: Token): boolean
  • Remove event listener from touch move event on Series Background

    Parameters

    • token: Token

    Returns boolean

offSeriesBackgroundTouchStart

  • offSeriesBackgroundTouchStart(token: Token): boolean
  • Remove event listener from touch start event on Series Background

    Parameters

    • token: Token

    Returns boolean

onBackgroundMouseClick

  • Subscribe to mouse-click event on Chart background

    Parameters

    Returns Token

onBackgroundMouseDoubleClick

  • Subscribe to mouse-doubleClick event on Chart background

    Parameters

    Returns Token

onBackgroundMouseDown

  • Subscribe to mouse-down event on Chart background

    Parameters

    Returns Token

onBackgroundMouseDrag

  • Subscribe to mouse-drag event on Chart background

    Parameters

    Returns Token

onBackgroundMouseDragStart

onBackgroundMouseDragStop

onBackgroundMouseEnter

  • Subscribe to mouse-enter event on Chart background

    Parameters

    Returns Token

onBackgroundMouseLeave

  • Subscribe to mouse-leave event on Chart background

    Parameters

    Returns Token

onBackgroundMouseMove

  • Subscribe to mouse-move event on Chart background

    Parameters

    Returns Token

onBackgroundMouseUp

  • Subscribe to mouse-up event on Chart background

    Parameters

    Returns Token

onBackgroundMouseWheel

  • Subscribe to mouse-wheel event on Chart background

    Parameters

    Returns Token

onBackgroundTouchEnd

  • Subscribe to touch-end event on Chart background

    Parameters

    Returns Token

onBackgroundTouchMove

  • Subscribe to touch-move event on Chart background

    Parameters

    Returns Token

onBackgroundTouchStart

  • Subscribe to touch-start event on Chart background

    Parameters

    Returns Token

onResize

  • onResize(handler: function): Token
  • Subscribe to resize event. This event is triggered whenever the area of chart changes (due to document or dashboard resizing).

     // Example usage,
     ChartXY.onResize((chart, width, height, engineWidth, engineHeight) => {
         console.log('Chart resized', 'width', width, 'height', height, 'engineWidth', engineWidth, 'engineHeight', engineHeight)
     })
    

    Parameters

    • handler: function

      Handler function for event

        • Parameters

          • obj: this
          • width: pixel
          • height: pixel
          • engineWidth: pixel
          • engineHeight: pixel

          Returns void

    Returns Token

    Token of subscription

onSeriesBackgroundMouseClick

  • Subscribe to mouse-click event on Series Background

    Parameters

    Returns Token

onSeriesBackgroundMouseDoubleClick

  • Subscribe to mouse-doubleClick event on Series Background

    Parameters

    Returns Token

onSeriesBackgroundMouseDown

  • Subscribe to mouse-down event on Series Background

    Parameters

    Returns Token

onSeriesBackgroundMouseDrag

  • Subscribe to mouse-drag event on Series Background

    Parameters

    Returns Token

onSeriesBackgroundMouseDragStart

onSeriesBackgroundMouseDragStop

onSeriesBackgroundMouseEnter

  • Subscribe to mouse-enter event on Series Background

    Parameters

    Returns Token

onSeriesBackgroundMouseLeave

  • Subscribe to mouse-leave event on Series Background

    Parameters

    Returns Token

onSeriesBackgroundMouseMove

  • Subscribe to mouse-move event on Series Background

    Parameters

    Returns Token

onSeriesBackgroundMouseUp

  • Subscribe to mouse-up event on Series Background

    Parameters

    Returns Token

onSeriesBackgroundMouseWheel

  • Subscribe to mouse-wheel event on Series Background

    Parameters

    Returns Token

onSeriesBackgroundTouchEnd

  • Subscribe to touch end event on Series Background

    Parameters

    Returns Token

onSeriesBackgroundTouchMove

  • Subscribe to touch move event on Series Background

    Parameters

    Returns Token

onSeriesBackgroundTouchStart

  • Subscribe to touch start event on Series Background

    Parameters

    Returns Token

saveToFile

  • saveToFile(fileName: string, type?: undefined | string, encoderOptions?: undefined | number): this
  • 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'
    Panel.saveToFile('screenshot')
    // Attempt download 'maybeNotSupported.bmp'
    Panel.saveToFile('maybeNotSupported', 'image/bmp')
    // Attempt download jpeg.file with specified compression quality
    Panel.saveToFile('fileName', 'image/jpeg', 0.50)
    
    sideeffect

    If 'type' is not supported by browser, an Error will be thrown.

    Parameters

    • fileName: string

      Name of prompted download file as string. File extension shouldn't be included as it is automatically detected from 'type'-argument.

    • type: undefined | string

      A DOMString indicating the image format. The default format type is image/png.

    • encoderOptions: undefined | number

      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.

    Returns this

setAnimationsEnabled

  • setAnimationsEnabled(animationsEnabled: boolean | undefined): this
  • Disable/enable all animations for the chart.

    Parameters

    • animationsEnabled: boolean | undefined

      Boolean value to enable/disable animations.

    Returns this

    Chart itself for fluent interface.

setAutoCursor

  • setAutoCursor(mutator: Mutator<AutoCursor<CursorPointMarkerType, CursorResultTableBackgroundType>>): this
  • Style chart AutoCursor using a callback function.

     // Example syntax
     ChartXY.setAutoCursor((autoCursor) => autoCursor
         // `autoCursor` is of type AutoCursorXY, use its API for styling the cursor.
         .setGridStrokeXStyle(new SolidLine({
             thickness: 1,
             fillStyle: new SolidFill({ color: ColorRGBA( 255, 0, 0 ) })
         }))
     )
    

    See AutoCursorXY for all available methods for configuring the AutoCursor.

    Example usage:

     // Example 1, disable Y Axis tick marker & grid line.
     ChartXY.setAutoCursor((autoCursor) => autoCursor
         .disposeTickMarkerY()
         .setGridStrokeYStyle(emptyLine),
     )
    
     // Example 2, style AutoCursor ResultTable.
     ChartXY.setAutoCursor((autoCursor) => autoCursor
         .setResultTable((resultTable) => resultTable
             .setOrigin(UIOrigins.LeftTop)
             .setTextFillStyle(new SolidFill({ color: ColorRGBA(255, 0, 0) }))
             .setTextFont((font) => font
                 .setSize(12)
                 .setFamily('sans-serif')
             )
             .setBackground((background) => background
                 .setFillStyle(new SolidFill({ color: ColorRGBA(0, 0, 0, 0) }))
             )
         )
     )
    
     // Example 3, style AutoCursor TickMarker X.
     ChartXY.setAutoCursor((autoCursor) => autoCursor
         .setTickMarkerX((tickMarker: UIPointableTextBox) => tickMarker
             .setTextFont((font) => font.setWeight('bold'))
             .setTextFillStyle(new SolidFill({ color: ColorRGBA(0, 255, 0) }))
             .setBackground((background) => background.setFillStyle(emptyFill).setStrokeStyle(emptyLine)),
         )
     )
    

    Parameters

    • mutator: Mutator<AutoCursor<CursorPointMarkerType, CursorResultTableBackgroundType>>

      Callback function that receives reference to the charts AutoCursor.

    Returns this

    Object itself for fluent interface.

setAutoCursorMode

  • Set chart AutoCursor behavior, by selecting a preset option from AutoCursorModes.

    Possible values:

    • AutoCursorModes.snapToClosest (default) | AutoCursor snaps to closest data point from mouse location.
    • AutoCursorModes.onHover | AutoCursor is only shown when it is directly over a series.
    • AutoCursorModes.disabled | AutoCursor is disabled
     // Example, disable AutoCursor
     ChartXY.setAutoCursorMode(AutoCursorModes.disabled)
    

    Related information:

    On series level, AutoCursor behavior can be configured individually for each series, and there are also more series specific options available. Here is LineSeries for example:

    Parameters

    Returns this

    Object itself for fluent interface.

setBackgroundFillStyle

  • Set FillStyle of chart background.

     // Example usage,
     ChartXY.setBackgroundFillStyle(new SolidFill({ color: ColorRGBA( 80, 0, 0 ) }))
    

    Related API:

    • Use SolidFill to describe a solid fill color.
    • Use ColorRGBA to create a color from Red, Green, Blue (and optionally) Alpha values in range [0, 255].

    Parameters

    Returns this

    Object itself

setBackgroundStrokeStyle

  • Set LineStyle of chart background border stroke.

     // Example usage,
     ChartXY.setBackgroundStrokeStyle(new SolidLine({
         thickness: 2,
         fillStyle: new SolidFill({ color: ColorRGBA( 0, 255, 0 ) })
     }))
    

    Related API:

    • Use SolidLine to describe a solid line style.
    • Use SolidFill to describe a solid fill color.
    • Use ColorRGBA to create a color from Red, Green, Blue (and optionally) Alpha values in range [0, 255].

    Parameters

    Returns this

    Object itself

setMouseInteractions

  • setMouseInteractions(enabled: boolean): this
  • Set if mouse-interactions on chart are enabled or not

    Parameters

    • enabled: boolean

      Boolean flag

    Returns this

    Object itself

setPadding

  • setPadding(padding: Partial<Margin> | number): this
  • Set padding around Chart in pixels.

     // Example 1, specify complete padding (four sides).
     ChartXY.setPadding({ left: 16, right: 16, top: 32, bottom: 8 })
    
     // Example 2, specify only single padding.
     ChartXY.setPadding({ right: 64 })
    

    Parameters

    • padding: Partial<Margin> | number

      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.

    Returns this

    Object itself

setSeriesBackgroundFillStyle

  • Set FillStyle of series background (area behind series).

     // Example usage,
     ChartXY.setSeriesBackgroundFillStyle(new SolidFill({ color: ColorRGBA( 60, 0, 0 ) }))
    

    Related API:

    • Use SolidFill to describe a solid fill color.
    • Use ColorRGBA to create a color from Red, Green, Blue (and optionally) Alpha values in range [0, 255].

    Parameters

    Returns this

    Object itself

setSeriesBackgroundStrokeStyle

  • Set LineStyle of series background border stroke.

     // Example usage,
     ChartXY.setSeriesBackgroundStrokeStyle(new SolidLine({
         thickness: 2,
         fillStyle: new SolidFill({ color: ColorRGBA( 0, 255, 0 ) })
     }))
    

    Related API:

    • Use SolidLine to describe a solid line style.
    • Use SolidFill to describe a solid fill color.
    • Use ColorRGBA to create a color from Red, Green, Blue (and optionally) Alpha values in range [0, 255].

    Parameters

    Returns this

    Object itself

setSeriesHighlightOnHover

  • setSeriesHighlightOnHover(state: boolean): this
  • Set the state for all Series in the Chart to highlight on mouse hover.

    Parameters

    • state: boolean

      True if all Series should be highlighted on mouse hover, false if not.

    Returns this

    Object itself for fluent interface.

setTitle

  • setTitle(title: string): this
  • Set text of Chart title.

    Parameters

    • title: string

      Chart title as a string.

    Returns this

    Object itself for fluent interface.

setTitleFillStyle

  • Set fill style of Chart Title.

    Example usage:

    // Create a new style
    Chart.setTitleFillStyle(new SolidFill({ color: ColorHEX('#F00') }))
    // Change transparency
    Chart.setTitleFillStyle((solidFill) => solidFill.setA(80))
    // Set hidden
    Chart.setTitleFillStyle(emptyFill)
    

    Parameters

    Returns this

    Chart itself

setTitleFont

  • Set font of Chart Title.

    Example usage:

    // Create a new FontSettings
    Chart.setTitleFont(new FontSettings({ size: 24, style: 'italic' }))
    // Change existing settings
    Chart.setTitleFont((fontSettings) => fontSettings.setWeight('bold'))
    

    Parameters

    Returns this

    Chart itself

setTitleMarginBottom

  • setTitleMarginBottom(marginPixels: pixel): this
  • Specifies padding after chart title.

    This does not have an effect if title is hidden (empty FillStyle).

     // Example usage,
     // Add empty space between title and series.
     ChartXY.setTitleMarginBottom(32)
    

    Parameters

    • marginPixels: pixel

      Gap after the chart title in pixels.

    Returns this

    Chart itself for fluent interface

setTitleMarginTop

  • setTitleMarginTop(marginPixels: pixel): this
  • Specifies padding before chart title.

    This does not have an effect if title is hidden (empty FillStyle).

     // Example usage,
     // Add empty space at top of chart, before title.
     ChartXY.setTitleMarginTop(32)
    

    Parameters

    • marginPixels: pixel

      Gap between the top of chart and its title in pixels.

    Returns this

    Chart itself for fluent interface

setTitleRotation

  • setTitleRotation(value: number): this
  • Set rotation of Chart title.

    Parameters

    • value: number

      Rotation in degrees

    Returns this

    Object itself

solveNearest

  • Solves the nearest data-point from series inside Chart of a given coordinate on screen

    Parameters

    • location: Point | undefined

      Location on screen or omit for cur mouse location

    Returns undefined | CursorPoint

    Undefined or data-structure for positioning of markers (and cursors)