interface BasedAxisOptions {
    binned?: boolean;
    bins?: number | any[];
    correspondingDatasets?: string[];
    domain?: AxisDomain[];
    extendLinearDomainBy?: string;
    includeZero?: boolean;
    limitDomainToBins?: boolean;
    mapsTo?: string;
    scaleType?: ScaleTypes;
    thresholds?: ThresholdOptions[];
    ticks?: {
        formatter?: ((tick: number | Date, i: number) => string) | ((tick: number | Date) => string);
        max?: number;
        min?: number;
        number?: number;
        rotateIfSmallerThan?: number;
        rotation?: TickRotations;
        values?: any[];
    };
    title?: string;
    titleOrientation?: string;
    truncation?: TruncationOptions;
    visible?: boolean;
}

Hierarchy (view full)

Properties

binned?: boolean

should be set to true on the domain axis that's being broken into bins

bins?: number | any[]

Bins to display (Histogram) bins: 20 bins: [0, 20, 40, 60] bins: [new Date(...), new Date(...), ...]

correspondingDatasets?: string[]

used to map data on the secondary axis

domain?: AxisDomain[]

Whether the Axis should use the specified domain instead of it being dynamically generated based on data extents. The type of values should depend on the scale type. Example for continuous axis scale: [-100, 100] Example for discrete axis scale: ['Qty', 'More', 'Sold'] No need to define domain for percentage axis scale

extendLinearDomainBy?: string

an additional key from the charting data that is used to extend the domain of an axis by (e.g. in the bullet graph we need both the marker & the data values to define the domain of the linear scale)

includeZero?: boolean

Whether the Axis should be forced to include 0 as a starting point (or ending point, in case of all negative axis). Default: true

limitDomainToBins?: boolean

limit the visible axis domain to only the binned area

mapsTo?: string

identifies what key within the data the axis values would map to

scaleType?: ScaleTypes

type of the scale used on axis

thresholds?: ThresholdOptions[]

thresholds

[
{ value: 10000 },
{ value: 40020, valueFormatter: (x) => x },
{ value: 55000, label: "Custom label", fillColor: "#03a9f4" },
]
ticks?: {
    formatter?: ((tick: number | Date, i: number) => string) | ((tick: number | Date) => string);
    max?: number;
    min?: number;
    number?: number;
    rotateIfSmallerThan?: number;
    rotation?: TickRotations;
    values?: any[];
}

tick configuration

Type declaration

  • Optionalformatter?: ((tick: number | Date, i: number) => string) | ((tick: number | Date) => string)

    function to format the ticks

  • Optionalmax?: number

    maximum tick value

  • Optionalmin?: number

    minimum tick value

  • Optionalnumber?: number

    number of ticks to show

  • OptionalrotateIfSmallerThan?: number

    minimum width of a tick before getting rotated (in pixels)

  • Optionalrotation?: TickRotations

    when to rotate ticks

  • Optionalvalues?: any[]

    optional array of tick values that is within the domain of data

title?: string

optional title for the scales

titleOrientation?: string

Override for the orientation of the title (for vertical axes). The title string can be overrided to be rotated left or right.

truncation?: TruncationOptions
visible?: boolean

is axis visible or not