Options
All
  • Public
  • Public/Protected
  • All
Menu

Class Axis

Axis is a child component of ChartXY. It defines a numeric range on a single plane (X or Y), that will be used to scale attached Series to the ChartXYs viewport.

The default Axis can be referenced with ChartXY.getDefaultAxisX and ChartXY.getDefaultAxisY.

ChartXY doesn't have a limit on number of axes. Additional axes can be created with ChartXY.addAxisX and ChartXY.addAxisY. Multiple Axes can be stacked on top of another, and axes can be positioned on either side of the chart (left, right, top, bottom, see AxisOptions).

The visual components of axis are:

See Scrolling and interval configuration for detailed information about management of axis interval.

Axis Ticks

Ticks are labels attached to the axis line that visualize the progression of values along the axis. A tick consists of three individually stylable parts:

  • Label (text)
  • Tick line.
  • Grid line.

There are currently three different ways of managing axis ticks:

  1. Automatic numeric ticks (default).
  2. Automatic time ticks.
  3. Automatic datetime ticks.
  4. Custom ticks.
Numeric ticks

Numeric ticks are enabled by default for all axes. They are designed for depicting numeric values of all magnitudes.

Configuring the ticks is done with Axis.setTickStrategy.

Axis.setTickStrategy(AxisTickStrategies.Numeric, (strategy) => strategy
  // Configure NumericTickStrategy
  .setMinorFormattingFunction((tickPosition) => `X: ${tickPosition}`)
  .setMinorTickStyle((tickStyle: VisibleTicks) => tickStyle
    .setTickLength(12)
    .setTickPadding(2)
  )
)

Frequently used API:

For full list of configuration API, see NumericTickStrategy.

Examples showcasing numeric axes:

Time ticks

Time ticks are designed for depicting time ranges between hundreds of hours to individual nanoseconds.

They are enabled, as well as configured, with Axis.setTickStrategy.

Axis.setTickStrategy(AxisTickStrategies.Time, (strategy) => strategy
  // Configure TimeTickStrategy
  .setMinorFormattingFunction((tickPosition) => `X: ${tickPosition}`)
  .setMinorTickStyle((tickStyle: VisibleTicks) => tickStyle
    .setTickLength(12)
    .setTickPadding(2)
  )
)

Frequently used API:

For full list of configuration API, see TimeTickStrategy.

Examples showcasing TimeTickStrategy:

  • No listed examples as of yet.
Datetime ticks

DateTime ticks are enabled, as well as configured, with Axis.setTickStrategy.

Axis.setTickStrategy(AxisTickStrategies.DateTime, (strategy) => strategy
  // Configure DateTimeTickStrategy
  .setMinorTickStyle((tickStyle: VisibleTicks) => tickStyle
    .setTickLength(12)
    .setTickPadding(2)
  )
)

Frequently used API:

For full list of configuration API, see DateTimeTickStrategy.

Examples showcasing datetime axes:

Custom ticks

Automatic creation of ticks can be disabled with Axis.setTickStrategy:

// Disable automatic axis ticks.
Axis.setTickStrategy(AxisTickStrategies.Empty)

Custom ticks can be created with Axis.addCustomTick:

// Create custom ticks.
for (let x = 0; x < 100; x += 10) {
  const tick = Axis.addCustomTick(UIElementBuilders.AxisTick)
}

Frequently used CustomTick API:

Examples showcasing custom axis ticks:

Axis automatic scrolling and Axis intervals configuration

Axis interval is the range of data values that are visible on the Axis, they are referred to as start and end.

By default, all axes fit the interval automatically to reveal all attached series. This behavior is called fitting scroll strategy.

Automatic scrolling behavior can be controlled by selecting the scroll strategy, with Axis.setScrollStrategy:

// Select progressive scroll strategy.
Axis.setScrollStrategy(AxisScrollStrategies.progressive)

Following scroll strategies are supported:

Axis interval can be manually set with Axis.setInterval:

// Axis start = 0, end = 100.
Axis.setInterval(0, 100)

However, if automatic scrolling is either 'fitting' or 'expansion' the configured axis interval might immediately be overridden.

Frequently used methods:

Axis interval limitations

LightningChart JS is easily the market leader in zooming interactions and visualization resolution, and contrary to most chart libraries, we are open about axis zooming limits;

"Axis zooming limits" refer to constraints on the magnitude of Axis interval, which is calculated as Math.abs(end - start). When the limit is reached, the Axis will not be able to zoom in and out further by programmatic calls (Axis.setInterval) or user interactions.

The constraints are primarily affected by two factors:

  • Active Tick Strategy.
  • Axis type.

Both of these factors have their own definition of support minimum and maximum Axis interval, and when combined the lesser values are used. For example, if Tick Strategy would allow min interval of 0.001 and Axis type 0.005, effectively the min interval would be 0.001.

The Axis interval limits imposed by each available Tick Strategy are documented at AxisTickStrategies.

The Axis interval limits imposed by Axis Type are documented at AxisOptions.

Axis highlighters

Two kinds of highlighters are supported:

  • ConstantLine | highlights a position on the Axis.
  • Band | highlights a range on the Axis.

Examples showcasing axis highlighters:

Index

Properties

Methods

Properties

Readonly chart

chart : ChartXY

Chart that owns the Axis.

Methods

addBand

  • addBand(onTop: boolean): Band
  • Add a highlighter Band to the Axis. A Band can be used to highlight an interval on the Axis.

    Parameters

    • onTop: boolean

      Is Band rendered above Series, or below. Default to above.

    Returns Band

    Band object.

addConstantLine

  • Add a highlighter ConstantLine to the Axis. A ConstantLine can be used to highlight a specific value on the Axis.

    Parameters

    • onTop: boolean

      Is ConstantLine rendered above Series, or below. Default to above.

    Returns ConstantLine

    ConstantLine object.

addCustomTick

  • Add custom tick to Axis. Custom ticks can be used to expand on default tick placement, or completely override Axis ticks placement with custom logic.

    Example usage:

    Create custom tick, specify position on Axis and label text.

     const customTick = Axis.addCustomTick()
         .setValue(5)
         // Label text is specified with a callback function.
         // This example formats Axis positions with one fraction, like this: "5.0"
         .setTextFormatter((value) => value.toFixed(1))
    

    Select CustomTick Marker type.

     // CustomTick shape can be changed by supplying a tick marker builder.
     // The only supported values are 'AxisTick' and 'PointableTextBox'
     const customTick1 = Axis.addCustomTick(UIElementBuilders.AxisTick)
     const customTick2 = Axis.addCustomTick(UIElementBuilders.PointableTextBox)
    

    Disable default ticks, and create custom positioned ticks.

     // Disable default Axis ticks.
     Axis.setTickStrategy(AxisTickStrategies.Empty)
    
     // Create a bunch of custom positioned ticks.
     for (let x = 0; x <= 100; x += 10) {
         Axis.addCustomTick(UIElementBuilders.AxisTick)
             .setValue(x)
     }
    

    For more information, like styling custom ticks, see CustomTick.

    Parameters

    Returns CustomTick

    CustomTick.

disableAnimations

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

    After calling this function, animations (Zooming, scaling) will be disabled. Animations must be recreated manually afterwards.

    Returns this

    Axis itself for fluent interface.

dispose

  • dispose(): this
  • Dispose all Axis sub-elements and remove this Axis from collection it's in.

    Returns this

    this for fluent interface

fit

  • fit(animate?: number | boolean, freeze: boolean): this
  • Fit axis view to attached series.

    Parameters

    • animate: number | boolean

      Boolean for animation enabled, or number for animation duration in milliseconds

    • freeze: boolean

      Freeze axis to fitted view? False by default.

    Returns this

formatValue

  • formatValue(value: number): string
  • Format a value along axis to string. Behavior depends on the Axis' TickStrategy. Eq. A DateTime-Axis will interpret 'value' as a Date.

    Parameters

    • value: number

      Value along axis

    Returns string

    Value formated to string

getAnimationsEnabled

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

    Returns boolean

    Animations default state.

getAxisInteractionPanByDragging

  • getAxisInteractionPanByDragging(): boolean
  • Get is mouse-interaction enabled: Panning by dragging on axis. (RMB)

    Returns boolean

    Boolean flag

getAxisInteractionReleaseByDoubleClicking

  • getAxisInteractionReleaseByDoubleClicking(): boolean
  • Get is mouse-interaction enabled: Release axis by double-clicking on axis.

    Returns boolean

    Boolean flag

getAxisInteractionZoomByDragging

  • getAxisInteractionZoomByDragging(): boolean
  • Get is mouse-interaction enabled: Zooming by dragging on axis. (LMB)

    Returns boolean

    Boolean flag

getAxisInteractionZoomByWheeling

  • getAxisInteractionZoomByWheeling(): boolean
  • Get is mouse-interaction enabled: Zooming by mouse-wheeling on axis.

    Returns boolean

    Boolean flag

getAxisMouseHoverStyle

  • getAxisMouseHoverStyle(): string
  • Get mouse style when hovering over axis area.

    Returns string

    Mouse-style preset name

getAxisMousePanStyle

  • getAxisMousePanStyle(): string
  • Get mouse style when panning axis.

    Returns string

    Mouse-style preset name

getAxisMouseZoomStyle

  • getAxisMouseZoomStyle(): string
  • Get mouse style when zooming axis.

    Returns string

    Mouse-style preset name

getChartInteractionFitByDrag

  • getChartInteractionFitByDrag(): boolean
  • Get is mouse-interaction enabled: Fitting by capturing rectangle on chart.

    Returns boolean

    Boolean flag

getChartInteractionPanByDrag

  • getChartInteractionPanByDrag(): boolean
  • Get is mouse-interaction enabled: Panning by dragging on chart.

    Returns boolean

    Boolean flag

getChartInteractionZoomByDrag

  • getChartInteractionZoomByDrag(): boolean
  • Get is mouse-interaction enabled: Zooming by capturing rectangle on chart.

    Returns boolean

    Boolean flag

getChartInteractionZoomByWheel

  • getChartInteractionZoomByWheel(): boolean
  • Get is mouse-interaction enabled: Zooming by mouse-wheeling on chart.

    Returns boolean

    Boolean flag

getHeight

  • getHeight(): number
  • Get height of axis in pixels

    Returns number

    Number

getHighlighters

  • getHighlighters(): Highlighter[]
  • Get all Highlighters of Axis.

    Returns Highlighter[]

    array of highlighters

getInterval

  • Get the currently applied axis scale interval.

    Returns AxisInterval

    Object containing the current start and end of Axis.

getNibInteractionScaleByDragging

  • getNibInteractionScaleByDragging(): boolean
  • Get is mouse-interaction enabled: Scaling by dragging on nib.

    Returns boolean

    Boolean flag

getNibInteractionScaleByWheeling

  • getNibInteractionScaleByWheeling(): boolean
  • Get is mouse-interaction enabled: Scaling by mouse-wheeling on nib.

    Returns boolean

    Boolean flag

getNibLength

  • getNibLength(): number
  • Returns number

    Axis nib stroke length in pixels

getNibMouseHoverStyle

  • getNibMouseHoverStyle(): string
  • Get mouse style when hovering over nib area.

    Returns string

    Mouse-style preset name

getNibMousePickingAreaSize

  • getNibMousePickingAreaSize(): number
  • Get size of nib mouse-picking area in pixels.

    Returns number

    Size in pixels

getNibMouseScaleStyle

  • getNibMouseScaleStyle(): string
  • Get mouse style when hovering over nib area.

    Returns string

    Mouse-style preset name

getNibOverlayStyle

  • Get style of nib overlay (shown only when interacting with mouse / touch).

    Returns FillStyle

    FillStyle object

getNibStyle

  • Returns LineStyle

    nib stroke fillstyle as a Fillstyle object

getOverlayStyle

  • Get style of axis overlay (shown only when interacting with mouse / touch).

    Returns FillStyle

    FillStyle object

getScrollStrategy

  • getScrollStrategy(): AxisScrollStrategy | undefined
  • Returns AxisScrollStrategy | undefined

    Current AxisScrollStrategy

getStrokeStyle

  • Returns LineStyle

    Axis stroke as a LineStyle object

getTickStrategy

  • getTickStrategy(): TickStrategyType
  • Get the currently used tick strategy

    Returns TickStrategyType

getTitle

  • getTitle(): string
  • Returns string

    Axis title string

getTitleFillStyle

getTitleFont

  • Get font of axis labels.

    Returns FontSettings

    FontSettings

getTitleMargin

  • getTitleMargin(): number
  • Returns number

    Padding after Axis title

getTitleRotation

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

    Returns number

    Rotation in degrees

getUiPosition

  • getUiPosition(): number
  • Get position of axis on its chart as a %

    Returns number

isDisposed

  • isDisposed(): boolean
  • Returns boolean

    True if all Axis sub-elements are disposed, false if not.

isStopped

  • isStopped(): boolean
  • Get is axes' scrolling currently prevented by usage of mouse-interactions or 'stop()' method.

    Returns boolean

    Boolean flag

offAxisInteractionAreaMouseClick

  • offAxisInteractionAreaMouseClick(token: Token): boolean
  • Remove event listener from Mouse Click 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

offAxisInteractionAreaMouseDoubleClick

  • offAxisInteractionAreaMouseDoubleClick(token: Token): boolean
  • Remove event listener from Mouse Double Click 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

offAxisInteractionAreaMouseDown

  • offAxisInteractionAreaMouseDown(token: Token): boolean
  • Remove event listener from Mouse Down 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

offAxisInteractionAreaMouseDrag

  • offAxisInteractionAreaMouseDrag(token: Token): boolean
  • Remove event listener from Mouse Drag 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

offAxisInteractionAreaMouseDragStart

  • offAxisInteractionAreaMouseDragStart(token: Token): boolean
  • Remove event listener from Mouse Drag Start 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

offAxisInteractionAreaMouseDragStop

  • offAxisInteractionAreaMouseDragStop(token: Token): boolean
  • Remove event listener from Mouse Drag Stop 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

offAxisInteractionAreaMouseEnter

  • offAxisInteractionAreaMouseEnter(token: Token): boolean
  • Remove event listener from Mouse Enter 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

offAxisInteractionAreaMouseLeave

  • offAxisInteractionAreaMouseLeave(token: Token): boolean
  • Remove event listener from Mouse Leave 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

offAxisInteractionAreaMouseMove

  • offAxisInteractionAreaMouseMove(token: Token): boolean
  • Remove event listener from Mouse Move 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

offAxisInteractionAreaMouseTouch

  • offAxisInteractionAreaMouseTouch(token: Token): boolean
  • Remove event listener from Mouse Touch 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

offAxisInteractionAreaMouseTouchStart

  • offAxisInteractionAreaMouseTouchStart(token: Token): boolean
  • Remove event listener from Mouse Touch Start 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

offAxisInteractionAreaMouseTouchStop

  • offAxisInteractionAreaMouseTouchStop(token: Token): boolean
  • Remove event listener from Mouse Touch Stop 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

offAxisInteractionAreaMouseUp

  • offAxisInteractionAreaMouseUp(token: Token): boolean
  • Remove event listener from Mouse Up 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

offAxisInteractionAreaMouseWheel

  • offAxisInteractionAreaMouseWheel(token: Token): boolean
  • Remove event listener from Mouse Wheel 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

offScaleChange

  • offScaleChange(token: Token): boolean
  • Remove subscription from scale change event

    Parameters

    • token: Token

      Event listener

    Returns boolean

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

onAxisAreaMouseDrag

  • Add event listener to Mouse Drag event on Axis

    Parameters

    Returns Token

    Token of subscription

onAxisAreaMouseDragStart

  • Add event listener to Mouse Drag Start event on Axis

    Parameters

    Returns Token

    Token of subscription

onAxisAreaMouseDragStop

  • Add event listener to Mouse Drag Stop event on Axis

    Parameters

    Returns Token

    Token of subscription

onAxisInteractionAreaMouseClick

  • Add event listener to Mouse Click on Axis

    Parameters

    Returns Token

    Token of subscription

onAxisInteractionAreaMouseDoubleClick

  • Add event listener to Mouse Double Click on Axis

    Parameters

    Returns Token

    Token of subscription

onAxisInteractionAreaMouseDown

  • Add event listener to Mouse Down on Axis

    Parameters

    Returns Token

    Token of subscription

onAxisInteractionAreaMouseEnter

  • Add event listener to Mouse Enter Event on Axis

    Parameters

    Returns Token

    Token of subscription

onAxisInteractionAreaMouseLeave

  • Add event listener to Mouse Leave Event on Axis

    Parameters

    Returns Token

    Token of subscription

onAxisInteractionAreaMouseMove

  • Add event listener to Mouse Move on Axis

    Parameters

    Returns Token

    Token of subscription

onAxisInteractionAreaMouseTouch

  • Add event listener to Mouse Touch event on Axis

    Parameters

    Returns Token

    Token of subscription

onAxisInteractionAreaMouseTouchStart

  • Add event listener to Mouse Touch Start event on Axis

    Parameters

    Returns Token

    Token of subscription

onAxisInteractionAreaMouseTouchStop

  • Add event listener to Mouse Touch Stop event on Axis

    Parameters

    Returns Token

    Token of subscription

onAxisInteractionAreaMouseUp

  • Add event listener to Mouse Up on Axis

    Parameters

    Returns Token

    Token of subscription

onAxisInteractionAreaMouseWheel

  • Add event listener to Mouse Wheel event on Axis

    Parameters

    Returns Token

    Token of subscription

onScaleChange

  • onScaleChange(listener: function): Token
  • Subscribe to on scale change event

    Parameters

    • listener: function

      Event listener

        • Parameters

          • start: number
          • end: number

          Returns void

    Returns Token

    Token that is used to unsubscribe from the event

pan

  • pan(amount: pixel): void
  • Pan scale by pixel value delta.

    Used by ChartXY as well as Axis itself.

    Parameters

    • amount: pixel

      Amount to shift scale of axis in pixels

    Returns void

Readonly release

  • release(): void
  • Undo effects of 'stop'.

    Returns void

restore

  • restore(): this
  • Restore all Axis sub-elements and restore this Axis to the collection it was in.

    Returns this

    this for fluent interface

setAnimationScroll

  • setAnimationScroll(enabled: boolean | undefined): this
  • Specifies scroll animation.

    Parameters

    • enabled: boolean | undefined

      Boolean flag for whether scrolling should be animated or not.

    Returns this

setAnimationZoom

  • setAnimationZoom(easing: AnimationEasing | undefined, duration: number): this
  • Specifies zoom animation to use.

    Example usage:

    Desired result Argument Parameters
    Change animation setAnimationZoom(AnimationEasings.easeOut, 500) First parameter defines the easing to use for the animation. Second parameter is optional, and defines the duration for the animation
    Disable zooming animations axis.setAnimationZoom(undefined) Passing undefined as the parameter will disable the zooming animations for the Axis.

    Parameters

    • easing: AnimationEasing | undefined

      Easing of animation. Undefined disables zoom animations. See 'common/animator.Easings' for defaults

    • duration: number

      Optional default duration for zooming animations in milliseconds

    Returns this

setAnimationsEnabled

  • setAnimationsEnabled(animationsEnabled: boolean | undefined): this
  • Disable/Enable all animations of the Chart.

    Parameters

    • animationsEnabled: boolean | undefined

      Boolean value to enable/disable animations.

    Returns this

    Axis itself for fluent interface.

setAxisInteractionPanByDragging

  • setAxisInteractionPanByDragging(enabled: boolean): this
  • Set is mouse-interaction enabled: Panning by dragging on axis. (RMB)

    Parameters

    • enabled: boolean

      Boolean flag

    Returns this

setAxisInteractionReleaseByDoubleClicking

  • setAxisInteractionReleaseByDoubleClicking(enabled: boolean): this
  • Set is mouse-interaction enabled: Release axis by double-clicking on axis.

    Parameters

    • enabled: boolean

      Boolean flag

    Returns this

setAxisInteractionZoomByDragging

  • setAxisInteractionZoomByDragging(enabled: boolean): this
  • Set is mouse-interaction enabled: Zooming by dragging on axis. (LMB)

    Parameters

    • enabled: boolean

      Boolean flag

    Returns this

setAxisInteractionZoomByWheeling

  • setAxisInteractionZoomByWheeling(enabled: boolean): this
  • Set is mouse-interaction enabled: Zooming by mouse-wheeling on axis.

    Parameters

    • enabled: boolean

      Boolean flag

    Returns this

setAxisMouseHoverStyle

  • setAxisMouseHoverStyle(mouseStyle: string): this
  • Set mouse style when hovering over axis area.

    Parameters

    • mouseStyle: string

      Mouse-style preset name (see MouseStyles)

    Returns this

    Object itself

setAxisMousePanStyle

  • setAxisMousePanStyle(mouseStyle: string): this
  • Set mouse style when panning axis.

    Parameters

    • mouseStyle: string

      Mouse-style preset name (see MouseStyles)

    Returns this

    Object itself

setAxisMouseZoomStyle

  • setAxisMouseZoomStyle(mouseStyle: string): this
  • Set mouse style when zooming axis.

    Parameters

    • mouseStyle: string

      Mouse-style preset name (see MouseStyles)

    Returns this

    Object itself

setChartInteractionFitByDrag

  • setChartInteractionFitByDrag(enabled: boolean): this
  • Set is mouse-interaction enabled: Fitting by capturing rectangle on chart.

    Parameters

    • enabled: boolean

      Boolean flag

    Returns this

setChartInteractionPanByDrag

  • setChartInteractionPanByDrag(enabled: boolean): this
  • Set is mouse-interaction enabled: Panning by dragging on chart.

    Parameters

    • enabled: boolean

      Boolean flag

    Returns this

setChartInteractionZoomByDrag

  • setChartInteractionZoomByDrag(enabled: boolean): this
  • Set is mouse-interaction enabled: Zooming by capturing rectangle on chart.

    Parameters

    • enabled: boolean

      Boolean flag

    Returns this

setChartInteractionZoomByWheel

  • setChartInteractionZoomByWheel(enabled: boolean): this
  • Set is mouse-interaction enabled: Zooming by mouse-wheeling on chart.

    Parameters

    • enabled: boolean

      Boolean flag

    Returns this

setChartInteractions

  • setChartInteractions(enabled: boolean): this
  • Set all states of chart mouse interactions on axis at once.

    Parameters

    • enabled: boolean

      Boolean flag

    Returns this

setInterval

  • setInterval(start: number, end: number, animate: number | boolean | undefined, disableScrolling: boolean | undefined): this
  • Set axis scale interval.

    Parameters

    • start: number

      Start scale value

    • end: number

      End scale value

    • animate: number | boolean | undefined

      Boolean for animation enabled, or number for animation duration in milliseconds

    • disableScrolling: boolean | undefined

      If true, disables automatic scrolling after setting interval

    Returns this

    Object itself for fluent interface

setMouseInteractions

  • setMouseInteractions(enabled: boolean): this
  • Set enabled flags for all mouse-interactions on axis directly. Does not affect chart mouse-interactions.

    Parameters

    • enabled: boolean

      Boolean: are mouse-interactions enabled

    Returns this

    Axis itself for fluent interface

setNibInteractionScaleByDragging

  • setNibInteractionScaleByDragging(enabled: boolean): this
  • Set is mouse-interaction enabled: Scaling by dragging on nib.

    Parameters

    • enabled: boolean

      Boolean flag

    Returns this

setNibInteractionScaleByWheeling

  • setNibInteractionScaleByWheeling(enabled: boolean): this
  • Set is mouse-interaction enabled: Scaling by mouse-wheeling on nib.

    Parameters

    • enabled: boolean

      Boolean flag

    Returns this

setNibLength

  • setNibLength(length: pixel): this
  • Specifies Axis nib stroke length in pixels

    Parameters

    • length: pixel

      Axis nib stroke length in pixels

    Returns this

    Axis itself for fluent interface

setNibMouseHoverStyle

  • setNibMouseHoverStyle(mouseStyle: string): this
  • Set mouse style when hovering over nib area.

    Parameters

    • mouseStyle: string

      Mouse-style preset name (see MouseStyles)

    Returns this

    Object itself

setNibMousePickingAreaSize

  • setNibMousePickingAreaSize(size: pixel): this
  • Set ideal size of nib mouse-picking area in pixels.

    Parameters

    • size: pixel

      Size in pixels

    Returns this

    Object itself

setNibMouseScaleStyle

  • setNibMouseScaleStyle(mouseStyle: string): this
  • Set mouse style when scaling nib.

    Parameters

    • mouseStyle: string

      Mouse-style preset name (see MouseStyles)

    Returns this

    Object itself

setNibOverlayStyle

  • Set style of nib overlay (shown only when interacting with mouse / touch).

    Parameters

    Returns this

setNibStyle

  • Specifies Axis nibs StrokeStyle

    Parameters

    Returns this

    Axis itself for fluent interface

setOverlayStyle

  • Set style of axis overlay (shown only when interacting with mouse / touch).

    Parameters

    Returns this

setScrollStrategy

  • setScrollStrategy(scrollStrategy?: AxisScrollStrategy): this
  • Specify ScrollStrategy of the Axis. This decides where the Axis scrolls based on current view and series boundaries.

    Parameters

    • scrollStrategy: AxisScrollStrategy

      AxisScrollStrategy or undefined to disable automatic scrolling. See AxisScrollStrategies for all options.

    Returns this

    Object itself for fluent interface.

setStrokeStyle

setTickStrategy

  • setTickStrategy(tickStrategy: TickStrategy, styler?: TickStrategyStyler<TickStrategyParameters, TickStrategy>): this
  • Set TickStrategy of Axis.

    The TickStrategy defines the positioning and formatting logic of Axis ticks as well as the style of created ticks.

    Example usage:

    DateTime Axis:

    Axis.setTickStrategy( AxisTickStrategies.DateTime )
    

    Disable automatic ticks completely:

    Axis.setTickStrategy( AxisTickStrategies.Empty )
    

    Customized TickStrategy:

    Axis.setTickStrategy( AxisTickStrategies.Numeric, ( tickStrategy: NumericTickStrategy ) => tickStrategy
        .setNumericUnits( true )
        .setMajorTickStyle( ( tickStyle ) => tickStyle
            .setLabelFont( ( font ) => font
                .setWeight( 'bold' )
            )
        )
    )
    

    Type table for optional second parameter ('styler'):

    tickStrategy styler
    'Numeric' ( tickStrategy: NumericTickStrategy ) => tickStrategy
    'Time' ( tickStrategy: TimeTickStrategy ) => tickStrategy
    'DateTime' ( tickStrategy: DateTimeTickStrategy ) => tickStrategy
    'Empty' undefined

    Type parameters

    • TickStrategy: TickStrategyType

    Parameters

    • tickStrategy: TickStrategy

      Selected TickStrategy. See AxisTickStrategies for a collection of options.

    • styler: TickStrategyStyler<TickStrategyParameters, TickStrategy>

      Optional callback that can be used to customize the TickStrategy. The type of supplied TickStrategy object depends on what was supplied to 'tickStrategy' parameter; See the above method documentation for a value table.

    Returns this

    Object itself for fluent interface.

setTickStyle

  • setTickStyle(styler: TickStrategyStyler<TickStrategyParameters, TickStrategy>): this
  • Type parameters

    • TickStrategy: TickStrategyType

    Parameters

    • styler: TickStrategyStyler<TickStrategyParameters, TickStrategy>

    Returns this

setTitle

  • setTitle(title: string): this
  • Specifies an Axis title string

    Parameters

    • title: string

      Axis title as a string

    Returns this

    Axis itself for fluent interface

setTitleFillStyle

  • Specifies Axis title FillStyle

    Parameters

    Returns this

    Axis itself for fluent interface

setTitleFont

setTitleMargin

  • setTitleMargin(margin: pixel): this
  • Specifies padding after Axis title. This is only accounted when title is visible.

    Parameters

    • margin: pixel

      Gap between the title and the next axis in pixels. Can also affect chart margins

    Returns this

    Axis itself for fluent interface

setTitleRotation

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

    Parameters

    • value: number

      Rotation in degrees

    Returns this

    Object itself

stop

  • stop(): this
  • Stop scrolling of axis until restored.

    Returns this

zoom

  • zoom(referencePosition: number, zoomAmount: number): void
  • Zoom scale from/to a position.

    Used by ChartXY as well as Axis itself.

    Parameters

    • referencePosition: number

      Position to zoom towards or from on axis

    • zoomAmount: number

    Returns void