echarts

echarts

Version 5.5.0
Published 2 months ago
52.8 MB
2 dependencies
Apache-2.0 license

Install

npm i echarts

yarn add echarts

pnpm add echarts

Overview

Apache ECharts is a powerful, interactive charting and data visualization library for browser

Index

Variables

variable dataTool

const dataTool: {};

variable dependencies

const dependencies: { zrender: string };

variable disConnect

const disConnect: (groupId: string) => void;

Alias and backward compatibility
Deprecated

variable env

const env: Env;

variable PRIORITY

const PRIORITY: {
    PROCESSOR: { FILTER: number; SERIES_FILTER: number; STATISTIC: number };
    VISUAL: {
        LAYOUT: number;
        PROGRESSIVE_LAYOUT: number;
        GLOBAL: number;
        CHART: number;
        POST_CHART_LAYOUT: number;
        COMPONENT: number;
        BRUSH: number;
        CHART_ITEM: number;
        ARIA: number;
        DECAL: number;
    };
};

variable registerTransform

const registerTransform: (
    externalTransform: ExternalDataTransform<DataTransformOption>
) => void;

variable version

const version: string;

Functions

function connect

connect: (groupId: string | EChartsType[]) => string;

(A)

let chart1 = echarts.init(dom1);
let chart2 = echarts.init(dom2);
chart1.group = 'xxx';
chart2.group = 'xxx';
echarts.connect('xxx');

(B)

let chart1 = echarts.init(dom1);
let chart2 = echarts.init(dom2);
echarts.connect('xxx', [chart1, chart2]);

function disconnect

disconnect: (groupId: string) => void;

function dispose

dispose: (chart: EChartsType | HTMLElement | string) => void;

Dispose a chart instance

function extendChartView

extendChartView: (proto: object) => ChartView;

function extendComponentModel

extendComponentModel: (proto: object) => ComponentModel;

function extendComponentView

extendComponentView: (proto: object) => ChartView;

function extendSeriesModel

extendSeriesModel: (proto: object) => SeriesModel;

function getCoordinateSystemDimensions

getCoordinateSystemDimensions: (type: string) => DimensionDefinitionLoose[];

Get dimensions of specified coordinate system.
Parameter type
{Array.<string|Object>}

function getInstanceByDom

getInstanceByDom: (dom: HTMLElement) => EChartsType | undefined;

function getInstanceById

getInstanceById: (key: string) => EChartsType | undefined;

function getMap

getMap: (mapName: string) => any;

function init

init: (
    dom?: HTMLElement | null,
    theme?: string | object | null,
    opts?: EChartsInitOpts
) => EChartsType;

Parameter
opts.devicePixelRatio Use window.devicePixelRatio by default
Parameter
opts.renderer Can choose 'canvas' or 'svg' to render the chart.
Parameter
opts.width Use clientWidth of the input dom by default. Can be 'auto' (the same as null/undefined)
Parameter
opts.height Use clientHeight of the input dom by default. Can be 'auto' (the same as null/undefined)
Parameter
opts.locale Specify the locale.
Parameter
opts.useDirtyRect Enable dirty rectangle rendering or not.

function innerDrawElementOnCanvas

innerDrawElementOnCanvas: (
    ctx: CanvasRenderingContext2D,
    el: Displayable
) => void;

function parseGeoJson

parseGeoJson: (
    geoJson: GeoJSON | GeoJSONCompressed,
    nameProperty: string
) => GeoJSONRegion[];

function parseGeoJSON

parseGeoJSON: (
    geoJson: GeoJSON | GeoJSONCompressed,
    nameProperty: string
) => GeoJSONRegion[];

function registerAction

registerAction: {
    (type: string, eventName: string, action: ActionHandler): void;
    (type: string, action: ActionHandler): void;
    (actionInfo: ActionInfo, action: ActionHandler): void;
};

registerAction('someAction', 'someEvent', function () { ... }); registerAction('someAction', function () { ... }); registerAction( {type: 'someAction', event: 'someEvent', update: 'updateView'}, function () { ... } );
Parameter actionInfo
Parameter
{string} actionInfo.type
Parameter
{string} [actionInfo.event]
Parameter
{string} [actionInfo.update]
Parameter eventName
Parameter action

function registerCoordinateSystem

registerCoordinateSystem: (
    type: string,
    coordSysCreator: CoordinateSystemCreator
) => void;

function registerLayout

registerLayout: {
    (priority: number, layoutTask: StageHandler | StageHandlerOverallReset): void;
    (layoutTask: StageHandler | StageHandlerOverallReset): void;
};

Layout is a special stage of visual encoding Most visual encoding like color are common for different chart But each chart has it's own layout algorithm

function registerLoading

registerLoading: (name: string, loadingFx: LoadingEffectCreator) => void;

function registerLocale

registerLocale: (locale: string, localeObj: LocaleOption) => void;

function registerMap

registerMap: (
    mapName: RegisterMapParams[0],
    geoJson: RegisterMapParams[1],
    specialAreas?: RegisterMapParams[2]
) => void;

The parameters and usage: see geoSourceManager.registerMap. Compatible with previous echarts.registerMap.

function registerPostInit

registerPostInit: (postInitFunc: PostIniter) => void;

function registerPostUpdate

registerPostUpdate: (postUpdateFunc: PostUpdater) => void;

function registerPreprocessor

registerPreprocessor: (preprocessorFunc: OptionPreprocessor) => void;

function registerProcessor

registerProcessor: (
    priority: number | StageHandler | StageHandlerOverallReset,
    processor?: StageHandler | StageHandlerOverallReset
) => void;

function registerTheme

registerTheme: (name: string, theme: ThemeOption) => void;

function registerUpdateLifecycle

registerUpdateLifecycle: <T extends keyof LifecycleEvents>(
    name: T,
    cb: (...args: LifecycleEvents[T]) => void
) => void;

function registerVisual

registerVisual: {
    (priority: number, layoutTask: StageHandler | StageHandlerOverallReset): void;
    (layoutTask: StageHandler | StageHandlerOverallReset): void;
};

function setCanvasCreator

setCanvasCreator: (creator: () => HTMLCanvasElement) => void;

ZRender need a canvas context to do measureText. But in node environment canvas may be created by node-canvas. So we need to specify how to create a canvas instead of using document.createElement('canvas')
Example 1
let Canvas = require('canvas'); let echarts = require('echarts'); echarts.setCanvasCreator(function () { // Small size is enough. return new Canvas(32, 32); });
Deprecated
use setPlatformAPI({ createCanvas }) instead.

function setPlatformAPI

setPlatformAPI: (newPlatformApis: Partial<Platform>) => void;

function throttle

throttle: <T extends ThrottleFunction>(
    fn: T,
    delay?: number,
    debounce?: boolean
) => T & ThrottleController;

Parameter fn
Parameter delay
Unit: ms.
Parameter debounce
true: If call interval less than delay, only the last call works. false: If call interval less than `delay, call works on fixed rate. {(Function)} throttled fn.
Modifiers
- @public

function use

use: (
    ext:
        | EChartsExtensionInstaller
        | EChartsExtension
        | (EChartsExtensionInstaller | EChartsExtension)[]
) => void;

Classes

class Axis

class Axis {}

Base class of Axis.

constructor

constructor(
    dim: string,
    scale: Scale<Dictionary<unknown>>,
    extent: [number, number]
);

property dim

readonly dim: string;

property getRotate

getRotate: () => number;

Get axis rotate, by degree.

property inverse

inverse: boolean;

property model

model: AxisBaseModel<AxisBaseOptionCommon>;

property onBand

onBand: boolean;

property scale

scale: Scale<Dictionary<unknown>>;

property type

type: 'value' | 'category' | 'time' | 'log';

Axis type - 'category' - 'value' - 'time' - 'log'

method calculateCategoryInterval

calculateCategoryInterval: () => ReturnType<typeof calculateCategoryInterval>;

Only be called in category axis. Can be overridden, consider other axes like in 3D. Auto interval for cateogry axis tick and label

method contain

contain: (coord: number) => boolean;

If axis extent contain given coord

method containData

containData: (data: ScaleDataValue) => boolean;

If axis extent contain given data

method coordToData

coordToData: (coord: number, clamp?: boolean) => number;

Convert coord to data. Data is the rank if it has an ordinal scale

method dataToCoord

dataToCoord: (data: ScaleDataValue, clamp?: boolean) => number;

Convert data to coord. Data is the rank if it has an ordinal scale

method getBandWidth

getBandWidth: () => number;

Get width of band

method getExtent

getExtent: () => [number, number];

Get coord extent.

method getLabelModel

getLabelModel: () => Model<AxisBaseOption['axisLabel']>;

method getMinorTicksCoords

getMinorTicksCoords: () => TickCoord[][];

method getPixelPrecision

getPixelPrecision: (dataExtent?: [number, number]) => number;

Get precision used for formatting

method getTickModel

getTickModel: () => Model;

Notice here we only get the default tick model. For splitLine or splitArea, we should pass the splitLineModel or splitAreaModel manually when calling getTicksCoords. In GL, this method may be overridden to: axisModel.getModel('axisTick', grid3DModel.getModel('axisTick'));

method getTicksCoords

getTicksCoords: (opt?: { tickModel?: Model; clamp?: boolean }) => TickCoord[];

Different from zrUtil.map(axis.getTicks(), axis.dataToCoord, axis), axis.getTicksCoords considers onBand, which is used by boundaryGap:true of category axis and splitLine and splitArea.
Parameter
opt.tickModel default: axis.model.getModel('axisTick')
Parameter
opt.clamp If true, the first and the last tick must be at the axis end points. Otherwise, clip ticks that outside the axis extent.

method getViewLabels

getViewLabels: () => ReturnType<typeof createAxisLabels>['labels'];

method pointToData

pointToData: (point: number[], clamp?: boolean) => number;

Convert pixel point to data in axis

method setExtent

setExtent: (start: number, end: number) => void;

Set coord extent

class ChartView

class ChartView {}

constructor

constructor();

property group

readonly group: ViewRootGroup;

property ignoreLabelLineUpdate

ignoreLabelLineUpdate: boolean;

Ignore label line update in global stage. Will handle it in chart itself. Used in pie / funnel

property protoInitialize

static protoInitialize: void;

property registerClass

static registerClass: (clz: Constructor) => Constructor;

property renderTask

readonly renderTask: SeriesTask;

property type

type: string;

property uid

readonly uid: string;

method dispose

dispose: (ecModel: GlobalModel, api: ExtensionAPI) => void;

Dispose self.

method downplay

downplay: (
    seriesModel: SeriesModel,
    ecModel: GlobalModel,
    api: ExtensionAPI,
    payload: Payload
) => void;

Downplay series or specified data item.

method eachRendered

eachRendered: (cb: (el: Element) => boolean | void) => void;

Traverse the new rendered elements.
It will traverse the new added element in progressive rendering. And traverse all in normal rendering.

method highlight

highlight: (
    seriesModel: SeriesModel,
    ecModel: GlobalModel,
    api: ExtensionAPI,
    payload: Payload
) => void;

Highlight series or specified data item.

method init

init: (ecModel: GlobalModel, api: ExtensionAPI) => void;

method markUpdateMethod

static markUpdateMethod: (payload: Payload, methodName: keyof ChartView) => void;

method remove

remove: (ecModel: GlobalModel, api: ExtensionAPI) => void;

Remove self.

method render

render: (
    seriesModel: SeriesModel,
    ecModel: GlobalModel,
    api: ExtensionAPI,
    payload: Payload
) => void;

method updateLayout

updateLayout: (
    seriesModel: SeriesModel,
    ecModel: GlobalModel,
    api: ExtensionAPI,
    payload: Payload
) => void;

method updateView

updateView: (
    seriesModel: SeriesModel,
    ecModel: GlobalModel,
    api: ExtensionAPI,
    payload: Payload
) => void;

method updateVisual

updateVisual: (
    seriesModel: SeriesModel,
    ecModel: GlobalModel,
    api: ExtensionAPI,
    payload: Payload
) => void;

class ComponentModel

class ComponentModel<
    Opt extends ComponentOption = ComponentOption
> extends Model<Opt> {}

constructor

constructor(
    option: ComponentOption,
    parentModel: Model<any>,
    ecModel: GlobalModel
);

property componentIndex

componentIndex: number;

Modifiers
- @readOnly

property defaultOption

protected defaultOption: ComponentOption;

Modifiers
- @readOnly

property dependencies

static dependencies: string[];

Modifiers
- @readOnly

property ecModel

ecModel: GlobalModel;

Modifiers
- @readOnly

property hasClass

static hasClass: (componentType: string) => boolean;

property id

id: string;

Modifiers
- @readonly

property layoutMode

static layoutMode: ComponentLayoutMode | 'box';

Support merge layout params. Only support 'box' now (left/right/top/bottom/width/height).

property mainType

mainType: string;

Modifiers
- @readOnly

property name

name: string;

Because simplified concept is probably better, series.name (or component.name) has been having too many responsibilities: (1) Generating id (which requires name in option should not be modified). (2) As an index to mapping series when merging option or calling API (a name can refer to more than one component, which is convenient is some cases). (3) Display. But injected
Modifiers
- @readOnly

property preventAutoZ

preventAutoZ: boolean;

Prevent from auto set z, zlevel, z2 by the framework.

property protoInitialize

static protoInitialize: void;

property registerClass

static registerClass: (clz: Constructor) => Constructor;

property registerSubTypeDefaulter

static registerSubTypeDefaulter: (
    componentType: string,
    defaulter: SubTypeDefaulter
) => void;

property subType

subType: string;

Modifiers
- @readOnly

property type

type: string;

Modifiers
- @readonly

property uid

readonly uid: string;

method getBoxLayoutParams

getBoxLayoutParams: () => {
    left: string | number;
    top: string | number;
    right: string | number;
    bottom: string | number;
    width: string | number;
    height: string | number;
};

method getDefaultOption

getDefaultOption: () => Opt;

[How to declare defaultOption]:

(A) If using class declaration in typescript (since echarts 5):

import {ComponentOption} from '../model/option.js';
export interface XxxOption extends ComponentOption {
    aaa: number
}
export class XxxModel extends Component {
    static type = 'xxx';
    static defaultOption: XxxOption = {
        aaa: 123
    }
}
Component.registerClass(XxxModel);

import {inheritDefaultOption} from '../util/component.js';
import {XxxModel, XxxOption} from './XxxModel.js';
export interface XxxSubOption extends XxxOption {
    bbb: number
}
class XxxSubModel extends XxxModel {
    static defaultOption: XxxSubOption = inheritDefaultOption(XxxModel.defaultOption, {
        bbb: 456
    })
    fn() {
        let opt = this.getDefaultOption();
        // opt is {aaa: 123, bbb: 456}
    }
}

(B) If using class extend (previous approach in echarts 3 & 4):

let XxxComponent = Component.extend({
    defaultOption: {
        xx: 123
    }
})

let XxxSubComponent = XxxComponent.extend({
    defaultOption: {
        yy: 456
    },
    fn: function () {
        let opt = this.getDefaultOption();
        // opt is {xx: 123, yy: 456}
    }
})

method getReferringComponents

getReferringComponents: (
    mainType: ComponentMainType,
    opt: QueryReferringOpt
) => { models: ComponentModel[]; specified: boolean };

Notice: always force to input param useDefault in case that forget to consider it. The same behavior as modelUtil.parseFinder.
Parameter useDefault
In many cases like series refer axis and axis refer grid, If axis index / axis id not specified, use the first target as default. In other cases like dataZoom refer axis, if not specified, measn no refer.

method getZLevelKey

getZLevelKey: () => string;

Get key for zlevel. If developers don't configure zlevel. We will assign zlevel to series based on the key. For example, lines with trail effect and progressive series will in an individual zlevel.

method init

init: (option: Opt, parentModel: Model, ecModel: GlobalModel) => void;

method mergeDefaultAndTheme

mergeDefaultAndTheme: (option: Opt, ecModel: GlobalModel) => void;

method mergeOption

mergeOption: (option: Opt, ecModel: GlobalModel) => void;

method optionUpdated

optionUpdated: (newCptOption: Opt, isInit: boolean) => void;

Called immediately after init or mergeOption of this instance called.

method setZLevel

setZLevel: (zlevel: number) => void;

class ComponentView

class ComponentView {}

constructor

constructor();

property group

readonly group: ViewRootGroup;

property registerClass

static registerClass: (clz: Constructor) => Constructor;

property uid

readonly uid: string;

method dispose

dispose: (ecModel: GlobalModel, api: ExtensionAPI) => void;

method eachRendered

eachRendered: (cb: (el: Element) => boolean | void) => void;

Traverse the new rendered elements.
It will traverse the new added element in progressive rendering. And traverse all in normal rendering.

method init

init: (ecModel: GlobalModel, api: ExtensionAPI) => void;

method render

render: (
    model: ComponentModel,
    ecModel: GlobalModel,
    api: ExtensionAPI,
    payload: Payload
) => void;

method toggleBlurSeries

toggleBlurSeries: (
    seriesModels: SeriesModel[],
    isBlur: boolean,
    ecModel: GlobalModel
) => void;

Hook for toggle blur target series. Can be used in marker for blur or leave blur the markers

method updateLayout

updateLayout: (
    model: ComponentModel,
    ecModel: GlobalModel,
    api: ExtensionAPI,
    payload: Payload
) => void;

method updateView

updateView: (
    model: ComponentModel,
    ecModel: GlobalModel,
    api: ExtensionAPI,
    payload: Payload
) => void;

method updateVisual

updateVisual: (
    model: ComponentModel,
    ecModel: GlobalModel,
    api: ExtensionAPI,
    payload: Payload
) => void;

class List

class SeriesData<
    HostModel extends Model = Model,
    Visual extends DefaultDataVisual = DefaultDataVisual
> {}

constructor

constructor(
    dimensionsInput: SeriesDataSchema | SeriesDimensionDefineLoose[],
    hostModel: Model<any>
);

Parameter
dimensionsInput.dimensions For example, ['someDimName', {name: 'someDimName', type: 'someDimType'}, ...]. Dimensions should be concrete names like x, y, z, lng, lat, angle, radius

property CHANGABLE_METHODS

CHANGABLE_METHODS: readonly ['filterSelf', 'selectRange'];

property dataType

dataType: SeriesDataType;

Modifiers
- @readonly

property dimensions

readonly dimensions: string[];

Name of dimensions list of SeriesData.
Carefully use the index of this array. Because when DataStore is an extra high dimension(>30) dataset. We will only pick the used dimensions from DataStore to avoid performance issue.

property DOWNSAMPLE_METHODS

DOWNSAMPLE_METHODS: readonly ['downSample', 'lttbDownSample'];

property graph

graph?: Graph;

Host graph if List is used to store graph nodes / edges.
Modifiers
- @readonly

property hasItemOption

hasItemOption: boolean;

property hostModel

readonly hostModel: Model<any>;

property TRANSFERABLE_METHODS

TRANSFERABLE_METHODS: readonly [
    'cloneShallow',
    'downSample',
    'lttbDownSample',
    'map'
];

property tree

tree?: Tree<Model<any>, any>;

Host tree if List is used to store tree nodes.
Modifiers
- @readonly

property type

readonly type: string;

property userOutput

userOutput: DimensionUserOuput;

method appendData

appendData: (data: ArrayLike$1<any>) => void;

Caution: Can be only called on raw data (before this._indices created).

method appendValues

appendValues: (values: any[][], names?: string[]) => void;

Caution: Can be only called on raw data (before this._indices created). This method does not modify rawData (dataProvider), but only add values to store.
The final count will be increased by Math.max(values.length, names.length).
Parameter values
That is the SourceType: 'arrayRows', like [ [12, 33, 44], [NaN, 43, 1], ['-', 'asdf', 0] ] Each item is exactly corresponding to a dimension.

method clearAllVisual

clearAllVisual: () => void;

Clear itemVisuals and list visual.

method clearItemLayouts

clearItemLayouts: () => void;

Clear all layout of single data item

method cloneShallow

cloneShallow: (list?: SeriesData<HostModel>) => SeriesData<HostModel>;

Shallow clone a new list except visual and layout properties, and graph elements. New list only change the indices.

method count

count: () => number;

method diff

diff: (otherList: SeriesData) => DataDiffer;

Create a data differ

method downSample

downSample: (
    dimension: DimensionLoose,
    rate: number,
    sampleValue: (frameValues: ArrayLike$1<ParsedValue>) => ParsedValueNumeric,
    sampleIndex: (
        frameValues: ArrayLike$1<ParsedValue>,
        value: ParsedValueNumeric
    ) => number
) => SeriesData<HostModel>;

Large data down sampling on given dimension
Parameter sampleIndex
Sample index for name and id

method each

each: {
    <Ctx>(cb: EachCb0<Ctx>, ctx?: Ctx, ctxCompat?: Ctx): void;
    <Ctx>(dims: DimensionLoose, cb: EachCb1<Ctx>, ctx?: Ctx): void;
    <Ctx>(dims: [DimensionLoose], cb: EachCb1<Ctx>, ctx?: Ctx): void;
    <Ctx>(
        dims: [DimensionLoose, DimensionLoose],
        cb: EachCb2<Ctx>,
        ctx?: Ctx
    ): void;
    <Ctx>(dims: ItrParamDims, cb: EachCb$1<Ctx>, ctx?: Ctx): void;
};

Data iteration
Parameter ctx
default this
Example 1
list.each('x', function (x, idx) {}); list.each(['x', 'y'], function (x, y, idx) {}); list.each(function (idx) {})

method eachItemGraphicEl

eachItemGraphicEl: <Ctx = unknown>(
    cb: (this: Ctx, el: Element, idx: number) => void,
    context?: Ctx
) => void;

method ensureUniqueItemVisual

ensureUniqueItemVisual: <K extends keyof Visual>(
    idx: number,
    key: K
) => Visual[K];

Make sure itemVisual property is unique

method filterSelf

filterSelf: {
    <Ctx>(cb: FilterCb0<Ctx>, ctx?: Ctx, ctxCompat?: Ctx): this;
    <Ctx>(dims: DimensionLoose, cb: FilterCb1<Ctx>, ctx?: Ctx): this;
    <Ctx>(dims: [DimensionLoose], cb: FilterCb1<Ctx>, ctx?: Ctx): this;
    <Ctx>(
        dims: [DimensionLoose, DimensionLoose],
        cb: FilterCb2<Ctx>,
        ctx?: Ctx
    ): this;
    <Ctx>(dims: ItrParamDims, cb: FilterCb$1<Ctx>, ctx?: Ctx): this;
};

Data filter

method get

get: (dim: SeriesDimensionName, idx: number) => ParsedValue;

Get value. Return NaN if idx is out of range.
Should better to use data.getStore().get(dimIndex, dataIdx) instead.

method getApproximateExtent

getApproximateExtent: (dim: SeriesDimensionLoose) => [number, number];

PENDING: In fact currently this function is only used to short-circuit the calling of scale.unionExtentFromData when data have been filtered by modules like "dataZoom". scale.unionExtentFromData is used to calculate data extent for series on an axis, but if a "axis related data filter module" is used, the extent of the axis have been fixed and no need to calling scale.unionExtentFromData actually. But if we add "custom data filter" in future, which is not "axis related", this method may be still needed.
Optimize for the scenario that data is filtered by a given extent. Consider that if data amount is more than hundreds of thousand, extent calculation will cost more than 10ms and the cache will be erased because of the filtering.

method getByRawIndex

getByRawIndex: (dim: SeriesDimensionName, rawIdx: number) => ParsedValue;

Should better to use data.getStore().getByRawIndex(dimIndex, dataIdx) instead.

method getCalculationInfo

getCalculationInfo: <CALC_INFO_KEY extends keyof DataCalculationInfo<HostModel>>(
    key: CALC_INFO_KEY
) => DataCalculationInfo<HostModel>[CALC_INFO_KEY];

method getDataExtent

getDataExtent: (dim: DimensionLoose) => [number, number];

method getDimension

getDimension: (dim: SeriesDimensionLoose) => DimensionName;

Get concrete dimension name by dimension name or dimension index. If input a dimension name, do not validate whether the dimension name exits.
Parameter dim
Must make sure the dimension is SeriesDimensionLoose. Because only those dimensions will have auto-generated dimension names if not have a user-specified name, and other dimensions will get a return of null/undefined.
Because of this reason, should better use getDimensionIndex instead, for examples:
const val = data.getStore().get(data.getDimensionIndex(dim), dataIdx);
Concrete dim name.

method getDimensionIndex

getDimensionIndex: (dim: DimensionLoose) => DimensionIndex;

Get dimension index in data store. Return -1 if not found. Can be used to index value from getRawValue.

method getDimensionInfo

getDimensionInfo: (dim: SeriesDimensionLoose) => SeriesDimensionDefine;

Get type and calculation info of particular dimension
Parameter dim
Dimension can be concrete names like x, y, z, lng, lat, angle, radius Or a ordinal number. For example getDimensionInfo(0) will return 'x' or 'lng' or 'radius'

method getDimensionsOnCoord

getDimensionsOnCoord: () => SeriesDimensionName[];

concrete dimension name list on coord.

method getId

getId: (idx: number) => string;

Never null/undefined. number will be converted to string. Because: In all cases having encountered at present, id is used in making diff comparison, which are usually based on hash map. We can keep the rule that the internal id are always string (treat 2 is the same as '2') to make the related logic simple.

method getIndices

getIndices: () => globalThis.ArrayLike<number>;

method getItemGraphicEl

getItemGraphicEl: (idx: number) => Element;

method getItemLayout

getItemLayout: (idx: number) => any;

Get layout of single data item

method getItemModel

getItemModel: <ItemOpts extends unknown = unknown>(
    idx: number
) => Model<ItemOpts>;

Get model of one data item.

method getItemVisual

getItemVisual: <K extends keyof Visual>(idx: number, key: K) => Visual[K];

Get visual property of single data item

method getLayout

getLayout: (key: string) => any;

Get layout property.

method getMedian

getMedian: (dim: DimensionLoose) => number;

method getName

getName: (idx: number) => string;

Never be null/undefined. number will be converted to string. Because: In most cases, name is used in display, where returning a string is more convenient. In other cases, name is used in query (see indexOfName), where we can keep the rule that name 2 equals to name '2'.

method getRawDataItem

getRawDataItem: (idx: number) => OptionDataItem;

method getRawIndex

getRawIndex: (idx: number) => number;

method getStore

getStore: () => DataStore;

method getSum

getSum: (dim: DimensionLoose) => number;

method getValues

getValues: {
    (idx: number): ParsedValue[];
    (dimensions: readonly string[], idx: number): ParsedValue[];
};

Get value for multi dimensions.
Parameter dimensions
If ignored, using all dimensions.

method getVisual

getVisual: <K extends keyof Visual>(key: K) => Visual[K];

Get visual property.

method hasItemVisual

hasItemVisual: () => boolean;

If exists visual property of single data item

method hasValue

hasValue: (idx: number) => boolean;

If value is NaN. Including '-' Only check the coord dimensions.

method indexOfName

indexOfName: (name: string) => number;

Retrieve the index with given name

method indexOfRawIndex

indexOfRawIndex: (rawIndex: number) => number;

method indicesOfNearest

indicesOfNearest: (
    dim: DimensionLoose,
    value: number,
    maxDistance?: number
) => number[];

Retrieve the index of nearest value
Parameter dim
Parameter value
Parameter maxDistance
If and only if multiple indices has the same value, they are put to the result.

method initData

initData: (
    data: Source | OptionSourceData | DataStore | DataProvider,
    nameList?: string[],
    dimValueGetter?: DimValueGetter
) => void;

Initialize from data
Parameter data
source or data or data store.
Parameter nameList
The name of a datum is used on data diff and default label/tooltip. A name can be specified in encode.itemName, or dataItem.name (only for series option data), or provided in nameList from outside.

method lttbDownSample

lttbDownSample: (
    valueDimension: DimensionLoose,
    rate: number
) => SeriesData<HostModel>;

Large data down sampling using largest-triangle-three-buckets
Parameter valueDimension
Parameter targetCount

method map

map: {
    <Ctx>(
        dims: DimensionLoose,
        cb: MapCb1<Ctx>,
        ctx?: Ctx,
        ctxCompat?: Ctx
    ): SeriesData<HostModel>;
    <Ctx>(
        dims: [DimensionLoose],
        cb: MapCb1<Ctx>,
        ctx?: Ctx,
        ctxCompat?: Ctx
    ): SeriesData<HostModel, DefaultDataVisual>;
    <Ctx>(
        dims: [DimensionLoose, DimensionLoose],
        cb: MapCb2<Ctx>,
        ctx?: Ctx,
        ctxCompat?: Ctx
    ): SeriesData<HostModel, DefaultDataVisual>;
};

Data mapping to a new List with given dimensions

method mapArray

mapArray: {
    <Ctx, Cb extends MapArrayCb0<Ctx>>(
        cb: Cb,
        ctx?: Ctx,
        ctxCompat?: Ctx
    ): ReturnType<Cb>[];
    <Ctx, Cb extends MapArrayCb1<Ctx>>(
        dims: DimensionLoose,
        cb: Cb,
        ctx?: Ctx,
        ctxCompat?: Ctx
    ): ReturnType<Cb>[];
    <Ctx, Cb extends MapArrayCb1<Ctx>>(
        dims: [DimensionLoose],
        cb: Cb,
        ctx?: Ctx,
        ctxCompat?: Ctx
    ): ReturnType<Cb>[];
    <Ctx, Cb extends MapArrayCb2<Ctx>>(
        dims: [DimensionLoose, DimensionLoose],
        cb: Cb,
        ctx?: Ctx,
        ctxCompat?: Ctx
    ): ReturnType<Cb>[];
    <Ctx, Cb extends MapArrayCb<Ctx>>(
        dims: ItrParamDims,
        cb: Cb,
        ctx?: Ctx,
        ctxCompat?: Ctx
    ): ReturnType<Cb>[];
};

Data mapping to a plain array

method mapDimension

mapDimension: {
    (coordDim: SeriesDimensionName): SeriesDimensionName;
    (coordDim: string, idx: number): string;
};

Parameter coordDim
Parameter idx
A coordDim may map to more than one data dim. If not specified, return the first dim not extra. concrete data dim. If not found, return null/undefined

method mapDimensionsAll

mapDimensionsAll: (coordDim: SeriesDimensionName) => SeriesDimensionName[];

method modify

modify: {
    <Ctx>(
        dims: DimensionLoose,
        cb: MapCb1<Ctx>,
        ctx?: Ctx,
        ctxCompat?: Ctx
    ): void;
    <Ctx>(
        dims: [DimensionLoose],
        cb: MapCb1<Ctx>,
        ctx?: Ctx,
        ctxCompat?: Ctx
    ): void;
    <Ctx>(
        dims: [DimensionLoose, DimensionLoose],
        cb: MapCb2<Ctx>,
        ctx?: Ctx,
        ctxCompat?: Ctx
    ): void;
};

!!Danger: used on stack dimension only.

method rawIndexOf

rawIndexOf: (dim: SeriesDimensionName, value: OrdinalNumber) => number;

Only support the dimension which inverted index created. Do not support other cases until required.
Parameter dim
concrete dim
Parameter value
ordinal index rawIndex

method selectRange

selectRange: (range: Record<string, [number, number]>) => SeriesData;

Select data in range. (For optimization of filter) (Manually inline code, support 5 million data filtering in data zoom.)

method setApproximateExtent

setApproximateExtent: (
    extent: [number, number],
    dim: SeriesDimensionLoose
) => void;

Calculate extent on a filtered data might be time consuming. Approximate extent is only used for: calculate extent of filtered data outside.

method setCalculationInfo

setCalculationInfo: {
    (key: DataCalculationInfo<HostModel>): void;
    <CALC_INFO_KEY extends keyof DataCalculationInfo<HostModel>>(
        key: CALC_INFO_KEY,
        value: DataCalculationInfo<HostModel>[CALC_INFO_KEY]
    ): void;
};

Parameter key
or k-v object

method setItemGraphicEl

setItemGraphicEl: (idx: number, el: Element) => void;

Set graphic element relative to data. It can be set as null

method setItemLayout

setItemLayout: <M = false>(
    idx: number,
    layout: M extends true ? Dictionary<any> : any,
    merge?: M
) => void;

Set layout of single data item

method setItemVisual

setItemVisual: {
    <K extends keyof Visual>(idx: number, key: K, value: Visual[K]): void;
    (idx: number, kvObject: Partial<Visual>): void;
};

Set visual property of single data item
Parameter idx
Parameter key
Parameter value
Example 1
setItemVisual(0, 'color', color); setItemVisual(0, { 'color': color });

method setLayout

setLayout: { (key: string, val: any): void; (kvObj: Dictionary<any>): void };

Set layout property.

method setVisual

setVisual: {
    <K extends keyof Visual>(key: K, val: Visual[K]): void;
    (kvObj: Partial<Visual>): void;
};

Set visual property
Example 1
setVisual('color', color); setVisual({ 'color': color });

method wrapMethod

wrapMethod: (
    methodName: FunctionPropertyNames<SeriesData>,
    injectFunction: (...args: any) => any
) => void;

Wrap some method to add more feature

class Model

class Model<Opt = ModelOption> {}

constructor

constructor(option?: {}, parentModel?: Model<any>, ecModel?: GlobalModel);

property ecModel

ecModel: GlobalModel;

property option

option: {};

property parentModel

parentModel: Model<any>;

method clone

clone: () => Model<Opt>;

method get

get: {
    <R extends keyof Opt>(path: R, ignoreParent?: boolean): Opt[R];
    <R extends keyof Opt>(path: readonly [R], ignoreParent?: boolean): Opt[R];
    <R extends keyof Opt, S extends keyof Opt[R]>(
        path: readonly [R, S],
        ignoreParent?: boolean
    ): Opt[R][S];
    <R extends keyof Opt, S extends keyof Opt[R], T extends keyof Opt[R][S]>(
        path: readonly [R, S, T],
        ignoreParent?: boolean
    ): Opt[R][S][T];
};

method getModel

getModel: {
    <R extends keyof Opt>(path: R, parentModel?: Model): Model<Opt[R]>;
    <R extends keyof Opt>(path: readonly [R], parentModel?: Model<any>): Model<
        Opt[R]
    >;
    <R extends keyof Opt, S extends keyof Opt[R]>(
        path: readonly [R, S],
        parentModel?: Model<any>
    ): Model<Opt[R][S]>;
    <Ra extends keyof Opt, Rb extends keyof Opt, S extends keyof Opt[Rb]>(
        path: readonly [Ra] | readonly [Rb, S],
        parentModel?: Model<any>
    ): Model<Opt[Ra]> | Model<Opt[Rb][S]>;
    <R extends keyof Opt, S extends keyof Opt[R], T extends keyof Opt[R][S]>(
        path: readonly [R, S, T],
        parentModel?: Model<any>
    ): Model<Opt[R][S][T]>;
};

method getShallow

getShallow: <R extends keyof Opt>(key: R, ignoreParent?: boolean) => Opt[R];

method init

init: (
    option: Opt,
    parentModel?: Model,
    ecModel?: GlobalModel,
    ...rest: any
) => void;

method isAnimationEnabled

isAnimationEnabled: () => boolean;

method isEmpty

isEmpty: () => boolean;

If model has option

method mergeOption

mergeOption: (option: Opt, ecModel?: GlobalModel) => void;

Merge the input option to me.

method parsePath

parsePath: (path: string | readonly string[]) => readonly string[];

method resolveParentPath

resolveParentPath: (path: readonly string[]) => string[];

method restoreData

restoreData: () => void;

class SeriesModel

class SeriesModel<
    Opt extends SeriesOption = SeriesOption
> extends ComponentModel<Opt> {}

property [SERIES_UNIVERSAL_TRANSITION_PROP]

[SERIES_UNIVERSAL_TRANSITION_PROP]: boolean;

property coordinateSystem

coordinateSystem: CoordinateSystem;

property dataTask

dataTask: SeriesTask;

property defaultOption

defaultOption: SeriesOption<unknown, DefaultStatesMixin>;

property defaultSymbol

defaultSymbol: string;

property hasSymbolVisual

hasSymbolVisual: boolean;

property ignoreStyleOnData

ignoreStyleOnData: boolean;

property legendIcon

legendIcon: string;

property legendVisualProvider

legendVisualProvider: LegendVisualProvider;

property pipelineContext

pipelineContext: PipelineContext;

property preventUsingHoverLayer

readonly preventUsingHoverLayer: boolean;

property protoInitialize

static protoInitialize: void;

property seriesIndex

seriesIndex: number;

property type

type: string;

property visualDrawType

visualDrawType: 'fill' | 'stroke';

property visualStyleAccessPath

visualStyleAccessPath: string;

property visualStyleMapper

visualStyleMapper: (
    model: Model<any>,
    excludes?: readonly string[],
    includes?: readonly string[]
) => PathStyleProps;

method appendData

appendData: (params: { data: ArrayLike<any> }) => void;

Append data to list

method coordDimToDataDim

coordDimToDataDim: (coordDim: DimensionName) => DimensionName[];

Use data.mapDimensionsAll(coordDim) instead.
Deprecated

method fillDataTextStyle

fillDataTextStyle: (data: ArrayLike<any>) => void;

method formatTooltip

formatTooltip: (
    dataIndex: number,
    multipleSeries?: boolean,
    dataType?: SeriesDataType
) => ReturnType<DataFormatMixin['formatTooltip']>;

Default tooltip formatter
Parameter dataIndex
Parameter multipleSeries
Parameter dataType
Parameter renderMode
valid values: 'html'(by default) and 'richText'. 'html' is used for rendering tooltip in extra DOM form, and the result string is used as DOM HTML content. 'richText' is used for rendering tooltip in rich text form, for those where DOM operation is not supported. formatted tooltip with html and markers Notice: The override method can also return string

method getAllData

getAllData: () => { data: SeriesData; type?: SeriesDataType }[];

method getBaseAxis

getBaseAxis: () => Axis;

Get base axis if has coordinate system and has axis. By default use coordSys.getBaseAxis(); Can be overridden for some chart. {type} description

method getColorBy

getColorBy: () => ColorBy;

method getColorFromPalette

getColorFromPalette: (
    name: string,
    scope: any,
    requestColorNum?: number
) => ZRColor;

method getData

getData: (dataType?: SeriesDataType) => SeriesData<this>;

Consider some method like filter, map need make new data, We should make sure that seriesModel.getData() get correct data in the stream procedure. So we fetch data from upstream each time task.perform called.

method getEncode

getEncode: () => HashMap<OptionEncodeValue, string>;

method getInitialData

getInitialData: (option: Opt, ecModel: GlobalModel) => SeriesData;

Init a data structure from data related option in series Must be overridden.

method getProgressive

getProgressive: () => number | false;

Get progressive rendering count each step

method getProgressiveThreshold

getProgressiveThreshold: () => number;

Get progressive rendering count each step

method getRawData

getRawData: () => SeriesData;

Get data before processed

method getSelectedDataIndices

getSelectedDataIndices: () => number[];

method getSource

getSource: () => Source;

method getSourceManager

getSourceManager: () => SourceManager;

method init

init: (option: Opt, parentModel: Model, ecModel: GlobalModel) => void;

method isAnimationEnabled

isAnimationEnabled: () => boolean;

method isColorBySeries

isColorBySeries: () => boolean;

method isSelected

isSelected: (dataIndex: number, dataType?: SeriesDataType) => boolean;

method isUniversalTransitionEnabled

isUniversalTransitionEnabled: () => boolean;

method mergeDefaultAndTheme

mergeDefaultAndTheme: (option: Opt, ecModel: GlobalModel) => void;

Util for merge default and theme to option

method mergeOption

mergeOption: (newSeriesOption: Opt, ecModel: GlobalModel) => void;

method registerClass

static registerClass: (clz: Constructor) => Constructor;

method restoreData

restoreData: () => void;

method select

select: (innerDataIndices: number[], dataType?: SeriesDataType) => void;

method setData

setData: (data: SeriesData) => void;

method toggleSelect

toggleSelect: (innerDataIndices: number[], dataType?: SeriesDataType) => void;

method unselect

unselect: (innerDataIndices: number[], dataType?: SeriesDataType) => void;

Interfaces

interface AriaComponentOption

interface AriaOption extends AriaLabelOption {}

property decal

decal?: {
    show?: boolean;
    decals?: DecalObject | DecalObject[];
};

property enabled

enabled?: boolean;

property label

label?: AriaLabelOption;

property mainType

mainType?: 'aria';

interface AxisPointerComponentOption

interface AxisPointerOption
    extends ComponentOption,
        Omit<CommonAxisPointerOption, 'type'> {}

property link

link?: AxisPointerLink[];

property mainType

mainType?: 'axisPointer';

property type

type?: 'line' | 'shadow' | 'cross' | 'none';

interface BrushComponentOption

interface BrushOption extends ComponentOption, ModelFinderObject {}

property brushLink

brushLink?: number[] | 'all' | 'none';

property brushMode

brushMode?: BrushMode;

property brushStyle

brushStyle?: {
    borderWidth?: number;
    color?: ZRColor;
    borderColor?: ZRColor;
};

property brushType

brushType?: BrushTypeUncertain;

property inBrush

inBrush?: VisualOptionFixed;

property mainType

mainType?: 'brush';

property outOfBrush

outOfBrush?: VisualOptionFixed;

property removeOnClick

removeOnClick?: boolean;

property throttleDelay

throttleDelay?: number;

property throttleType

throttleType?: 'fixRate' | 'debounce';

property toolbox

toolbox?: BrushToolboxIconType[];

property transformable

transformable?: boolean;

interface CalendarComponentOption

interface CalendarOption extends ComponentOption, BoxLayoutOptionMixin {}

property cellSize

cellSize?: number | 'auto' | (number | 'auto')[];

property dayLabel

dayLabel?: Omit<LabelOption, 'position'> & {
    /**
     * First day of week.
     */
    firstDay?: number;
    /**
     * Margin between day label and axis line.
     * Can be percent string of cell size.
     */
    margin?: number | string;
    /**
     * Position of week, at the beginning or end of the range.
     */
    position?: 'start' | 'end';
    /**
     * Week text content
     *
     * defaults to auto-detected locale by the browser or the specified locale by `echarts.init` function.
     * It supports any registered locale name (case-sensitive) or customized array.
     * index 0 always means Sunday.
     */
    nameMap?: string | string[];
};

property itemStyle

itemStyle?: ItemStyleOption;

property mainType

mainType?: 'calendar';

property monthLabel

monthLabel?: Omit<LabelOption, 'position'> & {
    /**
     * Margin between month label and axis line.
     */
    margin?: number;
    /**
     * Position of month label, at the beginning or end of the range.
     */
    position?: 'start' | 'end';
    /**
     * Month text content
     *
     * defaults to auto-detected locale by the browser or the specified locale by `echarts.init` function.
     * It supports any registered locale name (case-sensitive) or customized array.
     * index 0 always means Jan.
     */
    nameMap?: string | string[];
    formatter?:
        | string
        | ((params: CalendarMonthLabelFormatterCallbackParams) => string);
};

property orient

orient?: LayoutOrient;

property range

range?: OptionDataValueDate | OptionDataValueDate[];

// one year range: 2017 // one month range: '2017-02' // a range range: ['2017-01-02', '2017-02-23'] // note: they will be identified as ['2017-01-01', '2017-02-01'] range: ['2017-01', '2017-02']

property splitLine

splitLine?: {
    show?: boolean;
    lineStyle?: LineStyleOption;
};

property yearLabel

yearLabel?: Omit<LabelOption, 'position'> & {
    /**
     * Margin between year label and axis line.
     */
    margin?: number;
    /**
     * Position of year label, at the beginning or end of the range.
     */
    position?: 'top' | 'bottom' | 'left' | 'right';
    formatter?:
        | string
        | ((params: CalendarYearLabelFormatterCallbackParams) => string);
};

interface ChartView

interface ChartView {}

method containPoint

containPoint: (point: number[], seriesModel: SeriesModel) => boolean;

The view contains the given point. Implement it if needed.

method filterForExposedEvent

filterForExposedEvent: (
    eventType: string,
    query: EventQueryItem,
    targetEl: Element,
    packedEvent: ECActionEvent | ECElementEvent
) => boolean;

Pass only when return true. Implement it if needed.

method incrementalPrepareRender

incrementalPrepareRender: (
    seriesModel: SeriesModel,
    ecModel: GlobalModel,
    api: ExtensionAPI,
    payload: Payload
) => void;

Rendering preparation in progressive mode. Implement it if needed.

method incrementalRender

incrementalRender: (
    params: StageHandlerProgressParams,
    seriesModel: SeriesModel,
    ecModel: GlobalModel,
    api: ExtensionAPI,
    payload: Payload
) => void;

Render in progressive mode. Implement it if needed.
Parameter params
See taskParams in stream/task.js

method updateTransform

updateTransform: (
    seriesModel: SeriesModel,
    ecModel: GlobalModel,
    api: ExtensionAPI,
    payload: Payload
) => void | { update: true };

Update transform directly. Implement it if needed.

interface ComponentView

interface ComponentView {}

property focusBlurEnabled

focusBlurEnabled?: boolean;

method filterForExposedEvent

filterForExposedEvent: (
    eventType: string,
    query: EventQueryItem,
    targetEl: Element,
    packedEvent: ECActionEvent | ECElementEvent
) => boolean;

Pass only when return true. Implement it if needed.

method findHighDownDispatchers

findHighDownDispatchers: (name: string) => Element[];

Find dispatchers for highlight/downplay by name. If this methods provided, hover link (within the same name) is enabled in component. That is, in component, a name can correspond to multiple dispatchers. Those dispatchers can have no common ancestor. The highlight/downplay state change will be applied on the dispatchers and their descendents.
Must return an array but not null/undefined.

method updateTransform

updateTransform: (
    model: ComponentModel,
    ecModel: GlobalModel,
    api: ExtensionAPI,
    payload: Payload
) => void | { update: true };

Implement it if needed.

interface ContinousVisualMapComponentOption

interface ContinousVisualMapOption extends VisualMapOption {}

property align

align?: 'auto' | 'left' | 'right' | 'top' | 'bottom';

property calculable

calculable?: boolean;

This prop effect default component type determine
See Also
- echarts/component/visualMap/typeDefaulter.

property emphasis

emphasis?: {
    handleStyle?: ItemStyleOption;
};

property handleIcon

handleIcon?: string;

property handleSize

handleSize?: string | number;

property handleStyle

handleStyle?: ItemStyleOption;

property hoverLink

hoverLink?: boolean;

Whether to enable hover highlight.

property hoverLinkDataSize

hoverLinkDataSize?: number;

The extent of hovered data.

property hoverLinkOnHandle

hoverLinkOnHandle?: boolean;

Whether trigger hoverLink when hover handle. If not specified, follow the value of realtime.

property indicatorIcon

indicatorIcon?: string;

property indicatorSize

indicatorSize?: string | number;

property indicatorStyle

indicatorStyle?: ItemStyleOption;

property range

range?: number[];

selected range. In default case range is [min, max] and can auto change along with modification of min max, until user specified a range.

interface CustomSeriesRenderItemAPI

interface CustomSeriesRenderItemAPI
    extends CustomSeriesRenderItemCoordinateSystemAPI {}

method barLayout

barLayout: (opt: BarGridLayoutOptionForCustomSeries) => BarGridLayoutResult;

method currentSeriesIndices

currentSeriesIndices: () => number[];

method font

font: (
    opt: Pick<
        TextCommonOption,
        'fontStyle' | 'fontWeight' | 'fontSize' | 'fontFamily'
    >
) => string;

method getDevicePixelRatio

getDevicePixelRatio: () => number;

method getHeight

getHeight: () => number;

method getWidth

getWidth: () => number;

method getZr

getZr: () => ZRenderType;

method ordinalRawValue

ordinalRawValue: (
    dim: DimensionLoose,
    dataIndexInside?: number
) => ParsedValue | OrdinalRawValue;

method style

style: (userProps?: ZRStyleProps, dataIndexInside?: number) => ZRStyleProps;

Deprecated

method styleEmphasis

styleEmphasis: (
    userProps?: ZRStyleProps,
    dataIndexInside?: number
) => ZRStyleProps;

Deprecated

method value

value: (dim: DimensionLoose, dataIndexInside?: number) => ParsedValue;

method visual

visual: <
    VT extends
        | 'symbol'
        | 'color'
        | 'borderColor'
        | 'symbolSize'
        | 'symbolKeepAspect'
        | 'legendIcon'
        | 'visualMeta'
        | 'liftZ'
        | 'decal'
>(
    visualType: VT,
    dataIndexInside?: number
) => VT extends NonStyleVisualProps
    ? DefaultDataVisual[VT]
    : VT extends StyleVisualProps
    ? PathStyleProps[(typeof STYLE_VISUAL_TYPE)[VT]]
    : void;

interface CustomSeriesRenderItemParams

interface CustomSeriesRenderItemParams {}

property actionType

actionType?: string;

property context

context: Dictionary<unknown>;

property coordSys

coordSys: CustomSeriesRenderItemParamsCoordSys;

property dataIndex

dataIndex: number;

property dataIndexInside

dataIndexInside: number;

property dataInsideLength

dataInsideLength: number;

property encode

encode: WrapEncodeDefRet;

property seriesId

seriesId: string;

property seriesIndex

seriesIndex: number;

property seriesName

seriesName: string;

interface DatasetComponentOption

interface DatasetOption
    extends Pick<ComponentOption, 'type' | 'id' | 'name'>,
        Pick<SeriesEncodeOptionMixin, 'dimensions'> {}

This module is imported by echarts directly.
Notice: Always keep this file exists for backward compatibility. Because before 4.1.0, dataset is an optional component, some users may import this module manually.

property fromDatasetId

fromDatasetId?: string;

property fromDatasetIndex

fromDatasetIndex?: number;

property fromTransformResult

fromTransformResult?: number;

property mainType

mainType?: 'dataset';

property seriesLayoutBy

seriesLayoutBy?: SeriesLayoutBy;

property source

source?: OptionSourceData;

property sourceHeader

sourceHeader?: OptionSourceHeader;

property transform

transform?: DataTransformOption | PipedDataTransformOption;

interface DefaultLabelFormatterCallbackParams

interface CallbackDataParams {}

property $vars

$vars: string[];

property borderColor

borderColor?: string;

property color

color?: ZRColor;

property componentIndex

componentIndex: number;

property componentSubType

componentSubType: string;

property componentType

componentType: string;

property data

data: OptionDataItem;

property dataIndex

dataIndex: number;

property dataType

dataType?: SeriesDataType;

property dimensionIndex

dimensionIndex?: number;

property dimensionNames

dimensionNames?: DimensionName[];

property encode

encode?: DimensionUserOuputEncode;

property marker

marker?: TooltipMarker;

property name

name: string;

property percent

percent?: number;

property seriesId

seriesId?: string;

property seriesIndex

seriesIndex?: number;

property seriesName

seriesName?: string;

property seriesType

seriesType?: string;

property status

status?: DisplayState;

property value

value: OptionDataItem | OptionDataValue;

interface DownplayPayload

interface DownplayPayload extends Payload {}

property notBlur

notBlur?: boolean;

property type

type: 'downplay';

interface ECElementEvent

interface ECElementEvent extends ECEventData, CallbackDataParams {}

property event

event?: ElementEvent;

property type

type: ZRElementEventName;

interface ECharts

interface EChartsType extends ECharts {}

interface EChartsCoreOption

interface ECBasicOption extends ECUnitOption {}

[ECOption]: An object input to echarts.setOption(option). May be an 'option: ECUnitOption', or may be an object contains multi-options. For example:

let option: ECOption = {
    baseOption: {
        title: {...},
        legend: {...},
        series: [
            {data: [...]},
            {data: [...]},
            ...
        ]
    },
    timeline: {...},
    options: [
        {title: {...}, series: {data: [...]}},
        {title: {...}, series: {data: [...]}},
        ...
    ],
    media: [
        {
            query: {maxWidth: 320},
            option: {series: {x: 20}, visualMap: {show: false}}
        },
        {
            query: {minWidth: 320, maxWidth: 720},
            option: {series: {x: 500}, visualMap: {show: true}}
        },
        {
            option: {series: {x: 1200}, visualMap: {show: true}}
        }
    ]
};

property baseOption

baseOption?: ECUnitOption;

property media

media?: MediaUnit[];

property options

options?: ECUnitOption[];

property timeline

timeline?: ComponentOption | ComponentOption[];

interface EChartsOption

interface EChartsOption extends ECBasicOption {}

property angleAxis

angleAxis?: AngleAxisOption | AngleAxisOption[];

property aria

aria?: AriaOption;

property axisPointer

axisPointer?: AxisPointerOption | AxisPointerOption[];

property baseOption

baseOption?: EChartsOption;

property brush

brush?: BrushOption | BrushOption[];

property calendar

calendar?: CalendarOption | CalendarOption[];

property dataset

dataset?: DatasetOption | DatasetOption[];

property dataZoom

dataZoom?: DataZoomComponentOption | DataZoomComponentOption[];

property geo

geo?: GeoOption | GeoOption[];

property graphic

graphic?: GraphicComponentLooseOption | GraphicComponentLooseOption[];

property grid

grid?: GridOption | GridOption[];

property legend

legend?: LegendComponentOption | LegendComponentOption[];

property options

options?: EChartsOption[];

property parallel

parallel?: ParallelCoordinateSystemOption | ParallelCoordinateSystemOption[];

property parallelAxis

parallelAxis?: ParallelAxisOption | ParallelAxisOption[];

property polar

polar?: PolarOption | PolarOption[];

property radar

radar?: RadarOption | RadarOption[];

property radiusAxis

radiusAxis?: RadiusAxisOption | RadiusAxisOption[];

property series

series?: SeriesOption$1 | SeriesOption$1[];

property singleAxis

singleAxis?: SingleAxisOption | SingleAxisOption[];

property timeline

timeline?: TimelineOption | SliderTimelineOption;

property title

title?: TitleOption | TitleOption[];

property toolbox

toolbox?: ToolboxComponentOption | ToolboxComponentOption[];

property tooltip

tooltip?: TooltipOption | TooltipOption[];

property visualMap

visualMap?: VisualMapComponentOption | VisualMapComponentOption[];

property xAxis

xAxis?: XAXisOption | XAXisOption[];

property yAxis

yAxis?: YAXisOption | YAXisOption[];

interface EChartsType

interface EChartsType extends ECharts {}

interface ElementEvent

interface ElementEvent {}

property cancelBubble

cancelBubble: boolean;

property event

event: ZRRawEvent;

property gestureEvent

gestureEvent: string;

property offsetX

offsetX: number;

property offsetY

offsetY: number;

property pinchScale

pinchScale: number;

property pinchX

pinchX: number;

property pinchY

pinchY: number;

property stop

stop: (this: ElementEvent) => void;

property target

target: Element;

property topTarget

topTarget: Element;

property type

type: ElementEventName;

property wheelDelta

wheelDelta: number;

property which

which: number;

property zrByTouch

zrByTouch: boolean;

interface GeoComponentOption

interface GeoOption
    extends ComponentOption,
        BoxLayoutOptionMixin,
        AnimationOptionMixin,
        GeoCommonOptionMixin,
        StatesOptionMixin<GeoStateOption, StatesMixinBase>,
        GeoStateOption {}

property mainType

mainType?: 'geo';

property regions

regions?: RegoinOption[];

property selectedMap

selectedMap?: Dictionary<boolean>;

property selectedMode

selectedMode?: 'single' | 'multiple' | boolean;

property show

show?: boolean;

property silent

silent?: boolean;

property stateAnimation

stateAnimation?: AnimationOptionMixin;

property tooltip

tooltip?: CommonTooltipOption<GeoTooltipFormatterParams>;

interface GridComponentOption

interface GridOption
    extends ComponentOption,
        BoxLayoutOptionMixin,
        ShadowOptionMixin {}

property backgroundColor

backgroundColor?: ZRColor;

property borderColor

borderColor?: ZRColor;

property borderWidth

borderWidth?: number;

property containLabel

containLabel?: boolean;

property mainType

mainType?: 'grid';

property show

show?: boolean;

property tooltip

tooltip?: any;

interface HighlightPayload

interface HighlightPayload extends Payload {}

property notBlur

notBlur?: boolean;

property type

type: 'highlight';

interface ImagePatternObject

interface ImagePatternObject extends PatternObjectBase {}

property image

image: ImageLike | string;

property imageHeight

imageHeight?: number;

property imageWidth

imageWidth?: number;

property repeat

repeat?: ImagePatternRepeat;

interface InsideDataZoomComponentOption

interface InsideDataZoomOption extends DataZoomOption {}

property disabled

disabled?: boolean;

Whether disable this inside zoom.

property moveOnMouseMove

moveOnMouseMove?: boolean | 'shift' | 'ctrl' | 'alt';

property moveOnMouseWheel

moveOnMouseWheel?: boolean | 'shift' | 'ctrl' | 'alt';

property preventDefaultMouseMove

preventDefaultMouseMove?: boolean;

property textStyle

textStyle?: never;

Inside dataZoom don't support textStyle

property zoomLock

zoomLock?: boolean;

Whether disable zoom but only pan.

property zoomOnMouseWheel

zoomOnMouseWheel?: boolean | 'shift' | 'ctrl' | 'alt';

interface LabelFormatterCallback

interface LabelFormatterCallback<T = CallbackDataParams> {}

call signature

(params: T): string;

interface LabelLayoutOptionCallbackParams

interface LabelLayoutOptionCallbackParams {}

property align

align: ZRTextAlign;

property dataIndex

dataIndex?: number;

Index of data which the label represents. It can be null if label doesn't represent any data.

property dataType

dataType?: SeriesDataType;

Type of data which the label represents. It can be null if label doesn't represent any data.

property labelLinePoints

labelLinePoints?: number[][];

property labelRect

labelRect: RectLike;

property rect

rect: RectLike;

property seriesIndex

seriesIndex: number;

property text

text: string;

property verticalAlign

verticalAlign: ZRTextVerticalAlign;

interface LinearGradientObject

interface LinearGradientObject extends GradientObject {}

property type

type: 'linear';

property x

x: number;

property x2

x2: number;

property y

y: number;

property y2

y2: number;

interface List

interface SeriesData {}

method getLinkedData

getLinkedData: (dataType?: SeriesDataType) => SeriesData;

method getLinkedDataAll

getLinkedDataAll: () => { data: SeriesData; type?: SeriesDataType }[];

interface MarkAreaComponentOption

interface MarkAreaOption
    extends MarkerOption,
        MarkAreaStateOption,
        StatesOptionMixin<MarkAreaStateOption, StatesMixinBase> {}

property data

data?: (MarkArea1DDataItemOption | MarkArea2DDataItemOption)[];

property mainType

mainType?: 'markArea';

property precision

precision?: number;

interface MarkLineComponentOption

interface MarkLineOption
    extends MarkerOption,
        MarkLineStateOption,
        StatesOptionMixin<MarkLineStateOption, StatesMixinBase> {}

property data

data?: (MarkLine1DDataItemOption | MarkLine2DDataItemOption)[];

property mainType

mainType?: 'markLine';

property precision

precision?: number;

Precision used on statistic method

property symbol

symbol?: string[] | string;

property symbolOffset

symbolOffset?: number | string | (number | string)[];

property symbolRotate

symbolRotate?: number[] | number;

property symbolSize

symbolSize?: number[] | number;

interface MarkPointComponentOption

interface MarkPointOption
    extends MarkerOption,
        SymbolOptionMixin<CallbackDataParams>,
        StatesOptionMixin<MarkPointStateOption, StatesMixinBase>,
        MarkPointStateOption {}

property data

data?: MarkPointDataItemOption[];

property mainType

mainType?: 'markPoint';

property precision

precision?: number;

interface Model

interface Model<Opt = ModelOption>
    extends LineStyleMixin,
        ItemStyleMixin,
        TextStyleMixin,
        AreaStyleMixin {}

interface ParallelComponentOption

interface ParallelCoordinateSystemOption
    extends ComponentOption,
        BoxLayoutOptionMixin {}

property axisExpandable

axisExpandable?: boolean;

property axisExpandCenter

axisExpandCenter?: number;

property axisExpandCount

axisExpandCount?: number;

property axisExpandDebounce

axisExpandDebounce?: number;

property axisExpandRate

axisExpandRate?: number;

property axisExpandSlideTriggerArea

axisExpandSlideTriggerArea?: [number, number, number];

property axisExpandTriggerOn

axisExpandTriggerOn?: 'click' | 'mousemove';

property axisExpandWidth

axisExpandWidth?: number;

property axisExpandWindow

axisExpandWindow?: number[];

property layout

layout?: ParallelLayoutDirection;

property mainType

mainType?: 'parallel';

property parallelAxisDefault

parallelAxisDefault?: ParallelAxisOption;

interface Payload

interface Payload extends PayloadItem {}

property batch

batch?: PayloadItem[];

property escapeConnect

escapeConnect?: boolean;

property type

type: string;

interface PiecewiseVisualMapComponentOption

interface PiecewiseVisualMapOption extends VisualMapOption {}

Order Rule:
option.categories / option.pieces / option.text / option.selected: If !option.inverse, Order when vertical: ['top', ..., 'bottom']. Order when horizontal: ['left', ..., 'right']. If option.inverse, the meaning of the order should be reversed.
this._pieceList: The order is always [low, ..., high].
Mapping from location to low-high: If !option.inverse When vertical, top is high. When horizontal, right is high. If option.inverse, reverse.

property align

align?: 'auto' | 'left' | 'right';

property categories

categories?: string[];

category names, like: ['some1', 'some2', 'some3']. Attr min/max are ignored when categories set. See "Order Rule"

property hoverLink

hoverLink?: boolean;

property itemGap

itemGap?: number;

property itemHeight

itemHeight?: number;

property itemSymbol

itemSymbol?: string;

property itemWidth

itemWidth?: number;

When put the controller vertically, it is the length of horizontal side of each item. Otherwise, vertical side. When put the controller vertically, it is the length of vertical side of each item. Otherwise, horizontal side.

property maxOpen

maxOpen?: boolean;

property minOpen

minOpen?: boolean;

property pieces

pieces?: VisualPiece[];

property selected

selected?: Dictionary<boolean>;

Object. If not specified, means selected. When pieces and splitNumber: {'0': true, '5': true} When categories: {'cate1': false, 'cate3': true} When selected === false, means all unselected.

property selectedMode

selectedMode?: 'multiple' | 'single' | boolean;

property showLabel

showLabel?: boolean;

By default, when text is used, label will hide (the logic is remained for compatibility reason)

property splitNumber

splitNumber?: number;

If set to 5, auto split five pieces equally. If set to 0 and component type not set, component type will be determined as "continuous". (It is less reasonable but for ec2 compatibility, see echarts/component/visualMap/typeDefaulter)

interface PlainLegendComponentOption

interface LegendOption
    extends ComponentOption,
        LegendStyleOption,
        BoxLayoutOptionMixin,
        BorderOptionMixin {}

property align

align?: 'auto' | 'left' | 'right';

property backgroundColor

backgroundColor?: ColorString;

property borderRadius

borderRadius?: number | number[];

Border radius of background rect 0

property data

data?: (string | DataItem)[];

property emphasis

emphasis?: {
    selectorLabel?: LabelOption;
};

property itemGap

itemGap?: number;

Gap between each legend item. 10

property itemHeight

itemHeight?: number;

Height of legend symbol

property itemWidth

itemWidth?: number;

Width of legend symbol

property mainType

mainType?: 'legend';

property orient

orient?: LayoutOrient;

property padding

padding?: number | number[];

Padding between legend item and border. Support to be a single number or an array. 5

property selected

selected?: Dictionary<boolean>;

selected map of each item. Default to be selected if item is not in the map

property selectedMode

selectedMode?: boolean | 'single' | 'multiple';

property selector

selector?: (LegendSelectorButtonOption | SelectorType)[] | boolean;

Buttons for all select or inverse select.
Example 1
selector: [{type: 'all or inverse', title: xxx}] selector: true selector: ['all', 'inverse']

property selectorButtonGap

selectorButtonGap?: number;

Gap between selector buttons group and legend main items.

property selectorItemGap

selectorItemGap?: number;

Gap between each selector button

property selectorLabel

selectorLabel?: LabelOption;

property selectorPosition

selectorPosition?: 'auto' | 'start' | 'end';

Position of selector buttons.

property show

show?: boolean;

property tooltip

tooltip?: CommonTooltipOption<LegendTooltipFormatterParams>;

Tooltip option

interface PolarComponentOption

interface PolarOption extends ComponentOption, CircleLayoutOptionMixin {}

property mainType

mainType?: 'polar';

interface RadarComponentOption

interface RadarOption extends ComponentOption, CircleLayoutOptionMixin {}

property axisLabel

axisLabel?: AxisBaseOption['axisLabel'];

property axisLine

axisLine?: AxisBaseOption['axisLine'];

property axisName

axisName?: {
    show?: boolean;
    formatter?:
        | string
        | ((name?: string, indicatorOpt?: InnerIndicatorAxisOption) => string);
} & LabelOption;

property axisNameGap

axisNameGap?: number;

property axisTick

axisTick?: AxisBaseOption['axisTick'];

property boundaryGap

boundaryGap?:
    | CategoryAxisBaseOption['boundaryGap']
    | ValueAxisBaseOption['boundaryGap'];

property indicator

indicator?: RadarIndicatorOption[];

property mainType

mainType?: 'radar';

property scale

scale?: boolean;

property shape

shape?: 'polygon' | 'circle';

property splitArea

splitArea?: AxisBaseOption['splitArea'];

property splitLine

splitLine?: AxisBaseOption['splitLine'];

property splitNumber

splitNumber?: number;

property startAngle

startAngle?: number;

property triggerEvent

triggerEvent?: boolean;

interface RadialGradientObject

interface RadialGradientObject extends GradientObject {}

property r

r: number;

property type

type: 'radial';

property x

x: number;

property y

y: number;

interface RegisteredSeriesOption

interface RegisteredSeriesOption {}

A map from series 'type' to series option It's used for declaration merging in echarts extensions. For example:

import echarts from 'echarts';
declare module 'echarts/types/dist/echarts' {
  interface RegisteredSeriesOption {
    wordCloud: WordCloudSeriesOption
  }
}

property bar

bar: BarSeriesOption$1;

property boxplot

boxplot: BoxplotSeriesOption$1;

property candlestick

candlestick: CandlestickSeriesOption$1;

property custom

custom: CustomSeriesOption$1;

property effectScatter

effectScatter: EffectScatterSeriesOption$1;

property funnel

funnel: FunnelSeriesOption$1;

property gauge

gauge: GaugeSeriesOption$1;

property graph

graph: GraphSeriesOption$1;

property heatmap

heatmap: HeatmapSeriesOption$1;

property line

line: LineSeriesOption$1;

property lines

lines: LinesSeriesOption$1;

property map

map: MapSeriesOption$1;

property parallel

parallel: ParallelSeriesOption$1;

property pictorialBar

pictorialBar: PictorialBarSeriesOption$1;

property pie

pie: PieSeriesOption$1;

property radar

radar: RadarSeriesOption$1;

property sankey

sankey: SankeySeriesOption$1;

property scatter

scatter: ScatterSeriesOption$1;

property sunburst

sunburst: SunburstSeriesOption$1;

property themeRiver

themeRiver: ThemeRiverSeriesOption$1;

property tree

tree: TreeSeriesOption$1;

property treemap

treemap: TreemapSeriesOption$1;

interface ResizeOpts

interface ResizeOpts {}

property animation

animation?: AnimationOption$1;

property height

height?: number | 'auto';

property silent

silent?: boolean;

property width

width?: number | 'auto';

interface ScrollableLegendComponentOption

interface ScrollableLegendOption extends LegendOption {}

property animationDurationUpdate

animationDurationUpdate?: number;

property pageButtonGap

pageButtonGap?: number;

Gap between page buttons group and legend items.

property pageButtonItemGap

pageButtonItemGap?: number;

Gap between each page button

property pageButtonPosition

pageButtonPosition?: 'start' | 'end';

property pageFormatter

pageFormatter?: string | ((param: { current: number; total: number }) => string);

property pageIconColor

pageIconColor?: ZRColor;

property pageIconInactiveColor

pageIconInactiveColor?: ZRColor;

property pageIcons

pageIcons?: {
    horizontal?: string[];
    vertical?: string[];
};

property pageIconSize

pageIconSize?: number;

property pageTextStyle

pageTextStyle?: LabelOption;

property scrollDataIndex

scrollDataIndex?: number;

interface SelectChangedPayload

interface SelectChangedPayload extends Payload {}

property escapeConnect

escapeConnect: boolean;

property fromAction

fromAction: 'select' | 'unselect' | 'toggleSelected';

property fromActionPayload

fromActionPayload: Payload;

property isFromClick

isFromClick: boolean;

property selected

selected: {
    seriesIndex: number;
    dataType?: SeriesDataType;
    dataIndex: number[];
}[];

property type

type: 'selectchanged';

interface SeriesModel

interface SeriesModel {}

method brushSelector

brushSelector: (
    dataIndex: number,
    data: SeriesData,
    selectors: BrushCommonSelectorsForSeries,
    area: BrushSelectableArea
) => boolean;

See component/brush/selector.js Defined the brush selector for this series.

method enableAriaDecal

enableAriaDecal: () => void;

method getAxisTooltipData

getAxisTooltipData: (
    dim: DimensionName[],
    value: ScaleDataValue,
    baseAxis: Axis
) => { dataIndices: number[]; nestestValue: any };

Get data indices for show tooltip content. See tooltip. Implement it if needed.

method getLegendIcon

getLegendIcon: (opt: LegendIconParams) => ECSymbol | Group;

Get legend icon symbol according to each series type

method getMarkerPosition

getMarkerPosition: (
    value: ScaleDataValue[],
    dims?: (typeof dimPermutations)[number],
    startingAtTick?: boolean
) => number[];

Get position for marker

method getTooltipPosition

getTooltipPosition: (dataIndex: number) => number[];

See tooltip. Implement it if needed. Point of tooltip. null/undefined can be returned.

method preventIncremental

preventIncremental: () => boolean;

Convenient for override in extended class. Implement it if needed.

interface SeriesModel

interface SeriesModel<Opt extends SeriesOption = SeriesOption>
    extends DataFormatMixin,
        PaletteMixin<Opt>,
        DataHost {}

method getShadowDim

getShadowDim: () => string;

Get dimension to render shadow in dataZoom component

interface SetOptionOpts

interface SetOptionOpts {}

property lazyUpdate

lazyUpdate?: boolean;

property notMerge

notMerge?: boolean;

property replaceMerge

replaceMerge?: GlobalModelSetOptionOpts['replaceMerge'];

property silent

silent?: boolean;

property transition

transition?: SetOptionTransitionOpt;

interface SliderDataZoomComponentOption

interface SliderDataZoomOption extends DataZoomOption, BoxLayoutOptionMixin {}

property backgroundColor

backgroundColor?: ZRColor;

Background of slider zoom component

property borderColor

borderColor?: ZRColor;

border color of the box. For compatibility, if dataBackgroundColor is set, borderColor is ignored.

property borderRadius

borderRadius?: number | number[];

Border radius of the box.

property brushSelect

brushSelect?: boolean;

If eable select by brushing

property brushStyle

brushStyle?: ItemStyleOption;

property dataBackground

dataBackground?: {
    lineStyle?: LineStyleOption;
    areaStyle?: AreaStyleOption;
};

property emphasis

emphasis?: {
    handleStyle?: ItemStyleOption;
    moveHandleStyle?: ItemStyleOption;
};

property fillerColor

fillerColor?: ZRColor;

Color of selected area.

property handleIcon

handleIcon?: string;

Deprecated
Use handleStyle instead

property handleSize

handleSize?: string | number;

number: height of icon. width will be calculated according to the aspect of icon. string: percent of the slider height. width will be calculated according to the aspect of icon.

property handleStyle

handleStyle?: ItemStyleOption;

property labelFormatter

labelFormatter?: string | ((value: number, valueStr: string) => string);

property labelPrecision

labelPrecision?: number | 'auto';

property moveHandleIcon

moveHandleIcon?: string;

Icon to indicate it is a draggable panel.

property moveHandleSize

moveHandleSize?: number;

Height of handle rect. Can be a percent string relative to the slider height.

property moveHandleStyle

moveHandleStyle?: ItemStyleOption;

property selectedDataBackground

selectedDataBackground?: {
    lineStyle?: LineStyleOption;
    areaStyle?: AreaStyleOption;
};

property show

show?: boolean;

property showDataShadow

showDataShadow?: 'auto' | boolean;

property showDetail

showDetail?: boolean;

property textStyle

textStyle?: LabelOption;

property zoomLock

zoomLock?: boolean;

interface SVGPatternObject

interface SVGPatternObject extends PatternObjectBase {}

property svgElement

svgElement?: SVGVNode;

property svgHeight

svgHeight?: number;

property svgWidth

svgWidth?: number;

interface TimelineComponentOption

interface TimelineOption
    extends ComponentOption,
        BoxLayoutOptionMixin,
        SymbolOptionMixin {}

property autoPlay

autoPlay?: boolean;

property axisType

axisType?: 'category' | 'time' | 'value';

property backgroundColor

backgroundColor?: ZRColor;

property borderColor

borderColor?: ColorString;

property borderWidth

borderWidth?: number;

property checkpointStyle

checkpointStyle?: TimelineCheckpointStyle;

property controlPosition

controlPosition?: 'left' | 'right' | 'top' | 'bottom';

property controlStyle

controlStyle?: TimelineControlStyle;

property currentIndex

currentIndex?: number;

property data

data?: (OptionDataValue | TimelineDataItemOption)[];

property emphasis

emphasis?: {
    lineStyle?: TimelineLineStyleOption;
    itemStyle?: ItemStyleOption;
    checkpointStyle?: TimelineCheckpointStyle;
    controlStyle?: TimelineControlStyle;
    label?: TimelineLabelOption;
};

property inverse

inverse?: boolean;

property itemStyle

itemStyle?: ItemStyleOption;

property label

label?: TimelineLabelOption;

property lineStyle

lineStyle?: TimelineLineStyleOption;

property loop

loop?: boolean;

property mainType

mainType?: 'timeline';

property orient

orient?: LayoutOrient;

property padding

padding?: number | number[];

property playInterval

playInterval?: number;

property progress

progress?: {
    lineStyle?: TimelineLineStyleOption;
    itemStyle?: ItemStyleOption;
    label?: TimelineLabelOption;
};

property realtime

realtime?: boolean;

property replaceMerge

replaceMerge?: GlobalModelSetOptionOpts['replaceMerge'];

property rewind

rewind?: boolean;

property show

show?: boolean;

property tooltip

tooltip?: CommonTooltipOption<CallbackDataParams> & {
    trigger?: 'item';
};

interface TitleComponentOption

interface TitleOption
    extends ComponentOption,
        BoxLayoutOptionMixin,
        BorderOptionMixin {}

property backgroundColor

backgroundColor?: ZRColor;

property borderRadius

borderRadius?: number | number[];

Radius of background border.

property itemGap

itemGap?: number;

Gap between text and subtext

property link

link?: string;

Link to url

property mainType

mainType?: 'title';

property padding

padding?: number | number[];

Padding between text and border. Support to be a single number or an array.

property show

show?: boolean;

property sublink

sublink?: string;

property subtarget

subtarget?: 'self' | 'blank';

property subtext

subtext?: string;

property subtextStyle

subtextStyle?: LabelOption;

property target

target?: 'self' | 'blank';

property text

text?: string;

property textAlign

textAlign?: ZRTextAlign;

property textBaseline

textBaseline?: ZRTextVerticalAlign;

Deprecated
Use textVerticalAlign instead

property textStyle

textStyle?: LabelOption;

property textVerticalAlign

textVerticalAlign?: ZRTextVerticalAlign;

property triggerEvent

triggerEvent?: boolean;

If trigger mouse or touch event

interface ToolboxComponentOption

interface ToolboxComponentOption extends ToolboxOption {}

property feature

feature?: {
    brush?: ToolboxBrushFeatureOption;
    dataView?: ToolboxDataViewFeatureOption;
    dataZoom?: ToolboxDataZoomFeatureOption;
    magicType?: ToolboxMagicTypeFeatureOption;
    restore?: ToolboxRestoreFeatureOption;
    saveAsImage?: ToolboxSaveAsImageFeatureOption;
    [key: string]:
        | ToolboxFeatureOption
        | {
              [key: string]: any;
          }
        | undefined;
};

interface TooltipComponentFormatterCallback

interface TooltipFormatterCallback<T> {}

call signature

(params: T, asyncTicket: string): string | HTMLElement | HTMLElement[];

For sync callback params will be an array on axis trigger.

call signature

(
    params: T,
    asyncTicket: string,
    callback: (
        cbTicket: string,
        htmlOrDomNodes: string | HTMLElement | HTMLElement[]
    ) => void
): string | HTMLElement | HTMLElement[];

For async callback. Returned html string will be a placeholder when callback is not invoked.

interface TooltipComponentOption

interface TooltipOption
    extends CommonTooltipOption<TopLevelFormatterParams>,
        ComponentOption {}

property appendTo

appendTo?:
    | ((chartContainer: HTMLElement) => HTMLElement | undefined | null)
    | string
    | HTMLElement;

If append the tooltip element to another DOM element. Only available when renderMode is html

property appendToBody

appendToBody?: boolean;

Deprecated
use appendTo: 'body' instead

property axisPointer

axisPointer?: AxisPointerOption & {
    axis?: 'auto' | 'x' | 'y' | 'angle' | 'radius';
    crossStyle?: LineStyleOption & {
        textStyle?: LabelOption;
    };
};

property className

className?: string;

Specify the class name of tooltip element Only available when renderMode is html

property displayMode

displayMode?: 'single' | 'multipleByCoordSys';

property mainType

mainType?: 'tooltip';

property order

order?: TooltipOrderMode;

property renderMode

renderMode?: 'auto' | TooltipRenderMode;

'auto': use html by default, and use non-html if document is not defined 'html': use html for tooltip 'richText': use canvas, svg, and etc. for tooltip

property showContent

showContent?: boolean;

If show popup content

property trigger

trigger?: 'item' | 'axis' | 'none';

Trigger only works on coordinate system.

interface TooltipComponentPositionCallback

interface TooltipPositionCallback {}

Position relative to the hoverred element. Only available when trigger is item.

call signature

(
    point: [number, number],
    /**
     * params will be an array on axis trigger.
     */
    params: TooltipPositionCallbackParams,
    /**
     * Will be HTMLDivElement when renderMode is html
     * Otherwise it's graphic.Text
     */
    el: HTMLDivElement | ZRText | null,
    /**
     * Rect of hover elements. Will be null if not hovered
     */
    rect: RectLike | null,
    size: {
        /**
         * Size of popup content
         */
        contentSize: [number, number];
        /**
         * Size of the chart view
         */
        viewSize: [number, number];
    }
): Array<number | string> | TooltipBuiltinPosition | TooltipBoxLayoutOption;

Type Aliases

type AngleAxisComponentOption

type AngleAxisOption = AxisBaseOption & {
    mainType?: 'angleAxis';
    /**
     * Index of host polar component
     */
    polarIndex?: number;
    /**
     * Id of host polar component
     */
    polarId?: string;
    startAngle?: number;
    endAngle?: number;
    clockwise?: boolean;
    axisLabel?: AxisBaseOption['axisLabel'];
};

type AnimationDelayCallback

type AnimationDelayCallback = (
    idx: number,
    params?: AnimationDelayCallbackParam
) => number;

type AnimationDelayCallbackParams

type AnimationDelayCallbackParam = {
    count: number;
    index: number;
};

type AnimationDurationCallback

type AnimationDurationCallback = (idx: number) => number;

type BarSeriesOption

type BarSeriesOption$1 = BarSeriesOption & SeriesInjectedOption;

type BoxplotSeriesOption

type BoxplotSeriesOption$1 = BoxplotSeriesOption & SeriesInjectedOption;

type CandlestickSeriesOption

type CandlestickSeriesOption$1 = CandlestickSeriesOption & SeriesInjectedOption;

type Color

type ZRColor =
    | ColorString
    | LinearGradientObject
    | RadialGradientObject
    | PatternObject;

type ComposeOption

type ComposeOption<OptionUnion extends ComponentOption> =
    ComposeUnitOption<OptionUnion> & {
        baseOption?: ComposeUnitOption<OptionUnion>;
        options?: ComposeUnitOption<OptionUnion>[];
    };

type CustomSeriesOption

type CustomSeriesOption$1 = CustomSeriesOption & SeriesInjectedOption;

type CustomSeriesRenderItem

type CustomSeriesRenderItem = (
    params: CustomSeriesRenderItemParams,
    api: CustomSeriesRenderItemAPI
) => CustomSeriesRenderItemReturn;

type CustomSeriesRenderItemReturn

type CustomSeriesRenderItemReturn = CustomRootElementOption | undefined | null;

type DataZoomComponentOption

type DataZoomComponentOption = SliderDataZoomOption | InsideDataZoomOption;

type EChartsInitOpts

type EChartsInitOpts = {
    locale?: string | LocaleOption;
    renderer?: RendererType;
    devicePixelRatio?: number;
    useDirtyRect?: boolean;
    useCoarsePointer?: boolean;
    pointerSize?: number;
    ssr?: boolean;
    width?: number | string;
    height?: number | string;
};

type EffectScatterSeriesOption

type EffectScatterSeriesOption$1 = EffectScatterSeriesOption & SeriesInjectedOption;

type FunnelSeriesOption

type FunnelSeriesOption$1 = FunnelSeriesOption & SeriesInjectedOption;

type GaugeSeriesOption

type GaugeSeriesOption$1 = GaugeSeriesOption & SeriesInjectedOption;

type GraphicComponentOption

type GraphicComponentLooseOption = (
    | GraphicComponentOption
    | GraphicComponentElementOption
) & {
    mainType?: 'graphic';
};

type GraphSeriesOption

type GraphSeriesOption$1 = GraphSeriesOption & SeriesInjectedOption;

type HeatmapSeriesOption

type HeatmapSeriesOption$1 = HeatmapSeriesOption & SeriesInjectedOption;

type LabelLayoutOptionCallback

type LabelLayoutOptionCallback = (
    params: LabelLayoutOptionCallbackParams
) => LabelLayoutOption;

type LegendComponentOption

type LegendComponentOption = LegendOption | ScrollableLegendOption;

type LineSeriesOption

type LineSeriesOption$1 = LineSeriesOption & SeriesInjectedOption;

type LinesSeriesOption

type LinesSeriesOption$1 = LinesSeriesOption & SeriesInjectedOption;

type MapSeriesOption

type MapSeriesOption$1 = MapSeriesOption & SeriesInjectedOption;

type ParallelSeriesOption

type ParallelSeriesOption$1 = ParallelSeriesOption & SeriesInjectedOption;

type PatternObject

type PatternObject = ImagePatternObject | SVGPatternObject;

type PictorialBarSeriesOption

type PictorialBarSeriesOption$1 = PictorialBarSeriesOption & SeriesInjectedOption;

type PieSeriesOption

type PieSeriesOption$1 = PieSeriesOption & SeriesInjectedOption;

type RadarSeriesOption

type RadarSeriesOption$1 = RadarSeriesOption & SeriesInjectedOption;

type RadiusAxisComponentOption

type RadiusAxisOption = AxisBaseOption & {
    mainType?: 'radiusAxis';
    /**
     * Index of host polar component
     */
    polarIndex?: number;
    /**
     * Id of host polar component
     */
    polarId?: string;
};

type SankeySeriesOption

type SankeySeriesOption$1 = SankeySeriesOption & SeriesInjectedOption;

type ScatterSeriesOption

type ScatterSeriesOption$1 = ScatterSeriesOption & SeriesInjectedOption;

type SeriesOption

type SeriesOption$1 = Values<RegisteredSeriesOption>;

type SetOptionTransitionOpt

type SetOptionTransitionOpt = UpdateLifecycleTransitionOpt;

type SetOptionTransitionOptItem

type SetOptionTransitionOptItem = UpdateLifecycleTransitionItem;

type SingleAxisComponentOption

type SingleAxisOption = AxisBaseOption &
    BoxLayoutOptionMixin & {
        mainType?: 'singleAxis';
        position?: SingleAxisPosition;
        orient?: LayoutOrient;
    };

type SunburstSeriesOption

type SunburstSeriesOption$1 = SunburstSeriesOption & SeriesInjectedOption;

type ThemeRiverSeriesOption

type ThemeRiverSeriesOption$1 = ThemeRiverSeriesOption & SeriesInjectedOption;

type TooltipComponentFormatterCallbackParams

type TopLevelFormatterParams = CallbackDataParams | CallbackDataParams[];

type TooltipComponentPositionCallbackParams

type TooltipPositionCallbackParams = CallbackDataParams | CallbackDataParams[];

type TreemapSeriesOption

type TreemapSeriesOption$1 = TreemapSeriesOption & SeriesInjectedOption;

type TreeSeriesOption

type TreeSeriesOption$1 = TreeSeriesOption & SeriesInjectedOption;

type VisualMapComponentOption

type VisualMapComponentOption = ContinousVisualMapOption | PiecewiseVisualMapOption;

type XAXisComponentOption

type XAXisOption = CartesianAxisOption & {
    mainType?: 'xAxis';
};

type YAXisComponentOption

type YAXisOption = CartesianAxisOption & {
    mainType?: 'yAxis';
};

Namespaces

namespace color

namespace color {}

variable fastLerp

const fastLerp: (
    normalizedValue: number,
    colors: number[][],
    out?: number[]
) => number[];

variable fastMapToColor

const fastMapToColor: (
    normalizedValue: number,
    colors: number[][],
    out?: number[]
) => number[];

variable lift

const lift: (color: string, level: number) => string;

variable liftColor

const liftColor: {
    (color: GradientObject): GradientObject;
    (color: string): string;
};

variable lum

const lum: (color: string, backgroundLum: number) => number;

variable mapToColor

const mapToColor: {
    (normalizedValue: number, colors: string[], fullOutput: boolean): LerpFullOutput;
    (normalizedValue: number, colors: string[]): string;
};

variable modifyAlpha

const modifyAlpha: (color: string, alpha?: number) => string;

variable modifyHSL

const modifyHSL: (color: string, h?: number, s?: number, l?: number) => string;

variable parse

const parse: (colorStr: string, rgbaArr?: number[]) => number[];

variable random

const random: () => string;

variable stringify

const stringify: (arrColor: number[], type: string) => string;

variable toHex

const toHex: (color: string) => string;

function lerp

lerp: {
    (normalizedValue: number, colors: string[], fullOutput: boolean): LerpFullOutput;
    (normalizedValue: number, colors: string[]): string;
};

namespace format

namespace format {}

variable addCommas

const addCommas: (x: string | number) => string;

variable capitalFirst

const capitalFirst: (str: string) => string;

variable encodeHTML

const encodeHTML: (source: string) => string;

variable formatTime

const formatTime: (tpl: string, value: unknown, isUTC?: boolean) => string;

variable formatTpl

const formatTpl: (
    tpl: string,
    paramsList: TplFormatterParam | TplFormatterParam[],
    encode?: boolean
) => string;

variable getTextRect

const getTextRect: (
    text: string,
    font?: string,
    align?: TextAlign,
    verticalAlign?: TextVerticalAlign,
    padding?: number | number[],
    rich?: Dictionary<TextStylePropsPart>,
    truncate?: boolean,
    lineHeight?: number
) => BoundingRect;

variable getTooltipMarker

const getTooltipMarker: {
    (color: string, extraCssText?: string): TooltipMarker;
    (opt: GetTooltipMarkerOpt): TooltipMarker;
};

variable normalizeCssArray

const normalizeCssArray: (val: number | number[]) => number[];

variable toCamelCase

const toCamelCase: (str: string, upperCaseFirst?: boolean) => string;

variable truncateText

const truncateText: (
    text: string,
    containerWidth: number,
    font: string,
    ellipsis?: string,
    options?: InnerTruncateOption
) => string;

namespace graphic

namespace graphic {}

variable Arc

const Arc: typeof Arc;

variable BezierCurve

const BezierCurve: typeof BezierCurve;

variable BoundingRect

const BoundingRect: typeof BoundingRect;

variable Circle

const Circle: typeof Circle;

variable clipPointsByRect

const clipPointsByRect: (points: VectorArray[], rect: RectLike) => number[][];

variable clipRectByRect

const clipRectByRect: (targetRect: RectLike, rect: RectLike) => RectLike;

variable CompoundPath

const CompoundPath: typeof CompoundPath;

variable createIcon

const createIcon: (
    iconStr: string,
    opt?: Omit<DisplayableProps, 'style'>,
    rect?: RectLike
) => SVGPath | ZRImage;

variable Ellipse

const Ellipse: typeof Ellipse;

variable extendPath

const extendPath: (pathData: string, opts: SVGPathOption) => typeof SVGPath;

variable extendShape

const extendShape: (opts: {
    type?: string;
    shape?: Dictionary<any>;
    style?: PathStyleProps;
    beforeBrush?: () => void;
    afterBrush?: () => void;
    getBoundingRect?: () => BoundingRect;
    calculateTextPosition?: ElementCalculateTextPosition;
    buildPath(
        this: Path<PathProps>,
        ctx: CanvasRenderingContext2D | PathProxy,
        shape: Dictionary<any>,
        inBatch?: boolean
    ): void;
    init?(this: Path<PathProps>, opts: PathProps): void;
}) => new (opts?: PathProps & { shape: Dictionary<any> }) => Path<PathProps>;

variable getShapeClass

const getShapeClass: (name: string) => new () => Path<PathProps>;

variable getTransform

const getTransform: (target: Transformable, ancestor?: Transformable) => MatrixArray;

variable Group

const Group: typeof Group;

variable IncrementalDisplayable

const IncrementalDisplayable: typeof IncrementalDisplayable;

variable initProps

const initProps: <Props extends ElementProps>(
    el: Element<Props>,
    props: Props,
    animatableModel?: Model<AnimationOptionMixin>,
    dataIndex?: number | AnimateOrSetPropsOption | (() => void),
    cb?: (() => void) | ((percent: number) => void),
    during?: (percent: number) => void
) => void;

variable Line

const Line: typeof Line;

variable LinearGradient

const LinearGradient: typeof LinearGradient;

variable makeImage

const makeImage: (
    imageUrl: string,
    rect: RectLike,
    layout?: 'center' | 'cover'
) => ZRImage;

variable makePath

const makePath: (
    pathData: string,
    opts: SVGPathOption,
    rect: RectLike,
    layout?: 'center' | 'cover'
) => SVGPath;

variable mergePath

const mergePath: (pathEls: Path<PathProps>[], opts: PathProps) => Path<PathProps>;

variable Polygon

const Polygon: typeof Polygon;

variable Polyline

const Polyline: typeof Polyline;

variable RadialGradient

const RadialGradient: typeof RadialGradient;

variable Rect

const Rect: typeof Rect;

variable registerShape

const registerShape: (name: string, ShapeClass: new () => Path<PathProps>) => void;

variable resizePath

const resizePath: (path: SVGPath, rect: RectLike) => void;

variable Ring

const Ring: typeof Ring;

variable Sector

const Sector: typeof Sector;

variable updateProps

const updateProps: <Props extends ElementProps>(
    el: Element<Props>,
    props: Props,
    animatableModel?: Model<AnimationOptionMixin>,
    dataIndex?: number | AnimateOrSetPropsOption | (() => void),
    cb?: (() => void) | ((percent: number) => void),
    during?: (percent: number) => void
) => void;

class Image

class ZRImage extends Displayable<ImageProps> {}

property onload

onload: (image: ImageLike) => void;

property style

style: ImageStyleProps;

method createStyle

createStyle: (obj?: ImageStyleProps) => ImageStyleProps;

method getAnimationStyleProps

getAnimationStyleProps: () => MapToType<ImageProps, boolean>;

method getBoundingRect

getBoundingRect: () => BoundingRect;

method getHeight

getHeight: () => number;

method getWidth

getWidth: () => number;

class Text

class ZRText extends Displayable<TextProps> implements GroupLike {}

constructor

constructor(opts?: TextProps);

property innerTransformable

innerTransformable: Transformable;

property overlap

overlap: 'show' | 'blur' | 'hidden';

property style

style: TextStyleProps;

property type

type: string;

method addSelfToZr

addSelfToZr: (zr: ZRenderType) => void;

method childrenRef

childrenRef: () => (ZRImage | Rect | TSpan)[];

method getAnimationStyleProps

getAnimationStyleProps: () => MapToType<TextProps, boolean>;

method getBoundingRect

getBoundingRect: () => BoundingRect;

method getComputedTransform

getComputedTransform: () => MatrixArray;

method getLocalTransform

getLocalTransform: (m?: MatrixArray) => MatrixArray;

method makeFont

static makeFont: (style: TextStylePropsPart) => string;

method removeSelfFromZr

removeSelfFromZr: (zr: ZRenderType) => void;

method setDefaultTextStyle

setDefaultTextStyle: (defaultTextStyle: DefaultTextStyle) => void;

method setTextContent

setTextContent: (textContent: never) => void;

method update

update: () => void;

method updateTransform

updateTransform: () => void;

interface Text

interface ZRText {}

property stateProxy

stateProxy: (stateName: string) => TextState;

property states

states: Dictionary<TextState>;

method animate

animate: {
    (key?: '', loop?: boolean): Animator<this>;
    (key: 'style', loop?: boolean): Animator<this['style']>;
};

method ensureState

ensureState: (stateName: string) => TextState;

method getState

getState: (stateName: string) => TextState;

type Arc

type graphic_d_Arc = Arc;

type BezierCurve

type graphic_d_BezierCurve = BezierCurve;

type BoundingRect

type graphic_d_BoundingRect = BoundingRect;

type Circle

type graphic_d_Circle = Circle;

type CompoundPath

type graphic_d_CompoundPath = CompoundPath;

type Ellipse

type graphic_d_Ellipse = Ellipse;

type Group

type graphic_d_Group = Group;

type IncrementalDisplayable

type graphic_d_IncrementalDisplayable = IncrementalDisplayable;

type Line

type graphic_d_Line = Line;

type LinearGradient

type graphic_d_LinearGradient = LinearGradient;

type Polygon

type graphic_d_Polygon = Polygon;

type Polyline

type graphic_d_Polyline = Polyline;

type RadialGradient

type graphic_d_RadialGradient = RadialGradient;

type Rect

type graphic_d_Rect = Rect;

type Ring

type graphic_d_Ring = Ring;

type Sector

type graphic_d_Sector = Sector;

namespace helper

namespace helper {}

variable createDimensions

const createDimensions: (
    source:
        | OptionSourceData<OptionDataValue, OptionDataItemOriginal<OptionDataValue>>
        | Source,
    opt?: PrepareSeriesDataSchemaParams
) => SeriesDimensionDefine[];

variable createList

const createList: (
    seriesModel: SeriesModel<SeriesOption<unknown, DefaultStatesMixin>>
) => SeriesData<Model<any>, DefaultDataVisual>;

variable createScale

const createScale: (
    dataExtent: number[],
    option: object | AxisBaseModel<AxisBaseOptionCommon>
) => Scale<Dictionary<unknown>>;

variable createSymbol

const createSymbol: (
    symbolType: string,
    x: number,
    y: number,
    w: number,
    h: number,
    color?: ZRColor,
    keepAspect?: boolean
) => ECSymbol;

variable createTextStyle

const createTextStyle: (
    textStyleModel: Model<TextCommonOption>,
    opts?: { state?: DisplayState }
) => TextStyleProps;

variable dataStack

const dataStack: {
    isDimensionStacked: (
        data: SeriesData<Model<any>, DefaultDataVisual>,
        stackedDim: string
    ) => boolean;
    enableDataStack: (
        seriesModel: SeriesModel<
            SeriesOption<unknown, DefaultStatesMixin> & SeriesStackOptionMixin
        >,
        dimensionsInput:
            | EnableDataStackDimensionsInput
            | EnableDataStackDimensionsInputLegacy,
        opt?: { stackedCoordDimension?: string; byIndex?: boolean }
    ) => Pick<
        DataCalculationInfo<unknown>,
        | 'stackedDimension'
        | 'stackedByDimension'
        | 'isStackedByIndex'
        | 'stackedOverDimension'
        | 'stackResultDimension'
    >;
    getStackedDimension: (
        data: SeriesData<Model<any>, DefaultDataVisual>,
        targetDim: string
    ) => string;
};

variable enableHoverEmphasis

const enableHoverEmphasis: (
    el: Element<ElementProps>,
    focus?: InnerFocus,
    blurScope?: BlurScope
) => void;

variable getECData

const getECData: (hostObj: Element<ElementProps>) => ECData;

variable getLayoutRect

const getLayoutRect: (
    positionInfo: BoxLayoutOptionMixin & { aspect?: number },
    containerRect: { width: number; height: number },
    margin?: number | number[]
) => LayoutRect;

variable mixinAxisModelCommonMethods

const mixinAxisModelCommonMethods: (Model: Model<any>) => void;

namespace matrix

namespace matrix {}

variable identity

const identity: (out: MatrixArray) => MatrixArray;

variable invert

const invert: (out: MatrixArray, a: MatrixArray) => MatrixArray;

variable rotate

const rotate: (
    out: MatrixArray,
    a: MatrixArray,
    rad: number,
    pivot?: VectorArray
) => MatrixArray;

variable translate

const translate: (out: MatrixArray, a: MatrixArray, v: VectorArray) => MatrixArray;

function clone

clone: (a: MatrixArray) => MatrixArray;

function copy

copy: (out: MatrixArray, m: MatrixArray) => MatrixArray;

function create

create: () => MatrixArray;

function mul

mul: (out: MatrixArray, m1: MatrixArray, m2: MatrixArray) => MatrixArray;

function scale

scale: (out: MatrixArray, a: MatrixArray, v: VectorArray) => MatrixArray;

type MatrixArray

type matrix_d_MatrixArray = MatrixArray;

namespace number

namespace number {}

variable asc

const asc: <T extends number[]>(arr: T) => T;

variable getPercentWithPrecision

const getPercentWithPrecision: (
    valueList: number[],
    idx: number,
    precision: number
) => number;

variable getPixelPrecision

const getPixelPrecision: (
    dataExtent: [number, number],
    pixelExtent: [number, number]
) => number;

variable getPrecision

const getPrecision: (val: string | number) => number;

variable getPrecisionSafe

const getPrecisionSafe: (val: string | number) => number;

variable isNumeric

const isNumeric: (val: unknown) => val is number;

variable isRadianAroundZero

const isRadianAroundZero: (val: number) => boolean;

variable linearMap

const linearMap: (
    val: number,
    domain: number[],
    range: number[],
    clamp?: boolean
) => number;

variable MAX_SAFE_INTEGER

const MAX_SAFE_INTEGER: number;

variable nice

const nice: (val: number, round?: boolean) => number;

variable numericToNumber

const numericToNumber: (val: unknown) => number;

variable parseDate

const parseDate: (value: unknown) => Date;

variable quantile

const quantile: (ascArr: number[], p: number) => number;

variable quantity

const quantity: (val: number) => number;

variable quantityExponent

const quantityExponent: (val: number) => number;

variable reformIntervals

const reformIntervals: (list: IntervalItem[]) => IntervalItem[];

variable remRadian

const remRadian: (radian: number) => number;

variable round

const round: {
    (x: string | number, precision?: number): number;
    (x: string | number, precision: number, returnStr: false): number;
    (x: string | number, precision: number, returnStr: true): string;
};

namespace time

namespace time {}

variable format

const format: (
    time: unknown,
    template: string,
    isUTC: boolean,
    lang?:
        | string
        | Model<{
              time: {
                  month: string[];
                  monthAbbr: string[];
                  dayOfWeek: string[];
                  dayOfWeekAbbr: string[];
              };
              legend: { selector: { all: string; inverse: string } };
              toolbox: {
                  brush: {
                      title: {
                          rect: string;
                          polygon: string;
                          lineX: string;
                          lineY: string;
                          keep: string;
                          clear: string;
                      };
                  };
                  dataView: { title: string; lang: string[] };
                  dataZoom: { title: { zoom: string; back: string } };
                  magicType: {
                      title: {
                          line: string;
                          bar: string;
                          stack: string;
                          tiled: string;
                      };
                  };
                  restore: { title: string };
                  saveAsImage: { title: string; lang: string[] };
              };
              series: {
                  typeNames: {
                      pie: string;
                      bar: string;
                      line: string;
                      scatter: string;
                      effectScatter: string;
                      radar: string;
                      tree: string;
                      treemap: string;
                      boxplot: string;
                      candlestick: string;
                      k: string;
                      heatmap: string;
                      map: string;
                      parallel: string;
                      lines: string;
                      graph: string;
                      sankey: string;
                      funnel: string;
                      gauge: string;
                      pictorialBar: string;
                      themeRiver: string;
                      sunburst: string;
                      custom: string;
                      chart: string;
                  };
              };
              aria: {
                  general: { withTitle: string; withoutTitle: string };
                  series: {
                      single: {
                          prefix: string;
                          withName: string;
                          withoutName: string;
                      };
                      multiple: {
                          prefix: string;
                          withName: string;
                          withoutName: string;
                          separator: { middle: string; end: string };
                      };
                  };
                  data: {
                      allData: string;
                      partialData: string;
                      withName: string;
                      withoutName: string;
                      separator: { middle: string; end: string };
                  };
              };
          }>
) => string;

function parse

parse: (value: unknown) => Date;

Parameter value
valid type: number | string | Date, otherwise return new Date(NaN) These values can be accepted: + An instance of Date, represent a time in its own time zone. + Or string in a subset of ISO 8601, only including: + only year, month, date: '2012-03', '2012-03-01', '2012-03-01 05', '2012-03-01 05:06', + separated with T or space: '2012-03-01T12:22:33.123', '2012-03-01 12:22:33.123', + time zone: '2012-03-01T12:22:33Z', '2012-03-01T12:22:33+8000', '2012-03-01T12:22:33-05:00', all of which will be treated as local time if time zone is not specified (see <https://momentjs.com/>). + Or other string format, including (all of which will be treated as local time): '2012', '2012-3-1', '2012/3/1', '2012/03/01', '2009/6/12 2:00', '2009/6/12 2:05:08', '2009/6/12 2:05:08.123' + a timestamp, which represent a time in UTC. date Never be null/undefined. If invalid, return new Date(NaN).

namespace util

namespace util {}

variable bind

const bind: FunctionBind;

variable clone

const clone: <T extends unknown>(source: T) => T;

variable curry

const curry: {
    <F extends CurryFunc, T1 extends Parameters<F>[0]>(func: F, a: T1): Curry1<
        F,
        T1
    >;
    <F extends CurryFunc, T1 extends Parameters<F>[0], T2 extends Parameters<F>[1]>(
        func: F,
        a: T1,
        b: T2
    ): Curry2<F, T1, T2>;
    <
        F extends CurryFunc,
        T1 extends Parameters<F>[0],
        T2 extends Parameters<F>[1],
        T3 extends Parameters<F>[2]
    >(
        func: F,
        a: T1,
        b: T2,
        c: T3
    ): Curry3<F, T1, T2, T3>;
    <
        F extends CurryFunc,
        T1 extends Parameters<F>[0],
        T2 extends Parameters<F>[1],
        T3 extends Parameters<F>[2],
        T4 extends Parameters<F>[3]
    >(
        func: F,
        a: T1,
        b: T2,
        c: T3,
        d: T4
    ): Curry4<F, T1, T2, T3, T4>;
};

variable defaults

const defaults: <T extends Dictionary<any>, S extends Dictionary<any>>(
    target: T,
    source: S,
    overlay?: boolean
) => T & S;

variable each

const each: <
    I extends any[] | readonly any[] | ArrayLike$1<any> | Dictionary<any>,
    Context
>(
    arr: I,
    cb: (
        this: Context,
        value: I extends (infer T)[] | readonly (infer T)[] | ArrayLike$1<infer T>
            ? T
            : I extends Dictionary<any>
            ? I extends Record<infer K extends string | number | symbol, infer T>
                ? T
                : unknown
            : unknown,
        index?: I extends any[] | readonly any[] | ArrayLike$1<any>
            ? number
            : keyof I & string,
        arr?: I
    ) => void,
    context?: Context
) => void;

variable extend

const extend: <T extends Dictionary<any>, S extends Dictionary<any>>(
    target: T,
    source: S
) => T & S;

variable filter

const filter: <T, Context>(
    arr: readonly T[],
    cb: (this: Context, value: T, index: number, arr: readonly T[]) => boolean,
    context?: Context
) => T[];

variable indexOf

const indexOf: <T>(array: T[] | readonly T[] | ArrayLike$1<T>, value: T) => number;

variable inherits

const inherits: (clazz: Function, baseClazz: Function) => void;

variable isArray

const isArray: (value: any) => value is any[];

variable isFunction

const isFunction: (value: any) => value is Function;

variable isObject

const isObject: <T = unknown>(value: T) => value is object & T;

variable isString

const isString: (value: any) => value is string;

variable map

const map: <T, R, Context>(
    arr: readonly T[],
    cb: (this: Context, val: T, index?: number, arr?: readonly T[]) => R,
    context?: Context
) => R[];

variable merge

const merge: {
    <T extends Dictionary<any>, S extends Dictionary<any>>(
        target: T,
        source: S,
        overwrite?: boolean
    ): T & S;
    <T extends unknown, S extends unknown>(
        target: T,
        source: S,
        overwrite?: boolean
    ): T | S;
};

variable reduce

const reduce: <T, S, Context>(
    arr: readonly T[],
    cb: (
        this: Context,
        previousValue: S,
        currentValue: T,
        currentIndex?: number,
        arr?: readonly T[]
    ) => S,
    memo?: S,
    context?: Context
) => S;

namespace vector

namespace vector {}

variable add

const add: <T extends VectorArray>(out: T, v1: VectorArray, v2: VectorArray) => T;

variable applyTransform

const applyTransform: <T extends VectorArray>(
    out: T,
    v: VectorArray,
    m: MatrixArray
) => T;

variable copy

const copy: <T extends VectorArray>(out: T, v: VectorArray) => T;

variable create

const create: (x?: number, y?: number) => VectorArray;

variable dist

const dist: (v1: VectorArray, v2: VectorArray) => number;

variable distance

const distance: (v1: VectorArray, v2: VectorArray) => number;

variable distanceSquare

const distanceSquare: (v1: VectorArray, v2: VectorArray) => number;

variable distSquare

const distSquare: (v1: VectorArray, v2: VectorArray) => number;

variable div

const div: <T extends VectorArray>(out: T, v1: VectorArray, v2: VectorArray) => T;

variable dot

const dot: (v1: VectorArray, v2: VectorArray) => number;

variable len

const len: (v: VectorArray) => number;

variable length

const length: (v: VectorArray) => number;

variable lengthSquare

const lengthSquare: (v: VectorArray) => number;

variable lenSquare

const lenSquare: (v: VectorArray) => number;

variable lerp

const lerp: <T extends VectorArray>(
    out: T,
    v1: VectorArray,
    v2: VectorArray,
    t: number
) => T;

variable max

const max: <T extends VectorArray>(out: T, v1: VectorArray, v2: VectorArray) => T;

variable min

const min: <T extends VectorArray>(out: T, v1: VectorArray, v2: VectorArray) => T;

variable mul

const mul: <T extends VectorArray>(out: T, v1: VectorArray, v2: VectorArray) => T;

variable negate

const negate: <T extends VectorArray>(out: T, v: VectorArray) => T;

variable normalize

const normalize: <T extends VectorArray>(out: T, v: VectorArray) => T;

variable scale

const scale: <T extends VectorArray>(out: T, v: VectorArray, s: number) => T;

variable scaleAndAdd

const scaleAndAdd: <T extends VectorArray>(
    out: T,
    v1: VectorArray,
    v2: VectorArray,
    a: number
) => T;

variable set

const set: <T extends VectorArray>(out: T, a: number, b: number) => T;

variable sub

const sub: <T extends VectorArray>(out: T, v1: VectorArray, v2: VectorArray) => T;

function clone

clone: (v: VectorArray) => VectorArray;

type VectorArray

type vector_d_VectorArray = VectorArray;

namespace zrender

namespace zrender {}

variable dispose

const dispose: (zr: ZRender) => void;

variable disposeAll

const disposeAll: () => void;

variable getElementSSRData

const getElementSSRData: (el: Element<ElementProps>) => ElementSSRData;

variable getInstance

const getInstance: (id: number) => ZRender;

variable init

const init: (dom?: HTMLElement, opts?: ZRenderInitOpt) => ZRender;

variable registerPainter

const registerPainter: (name: string, Ctor: PainterBaseCtor) => void;

variable registerSSRDataGetter

const registerSSRDataGetter: <T>(getter: ElementSSRDataGetter<T>) => void;

variable version

const version: string;

type ElementSSRData

type zrender_d_ElementSSRData = ElementSSRData;

type ElementSSRDataGetter

type zrender_d_ElementSSRDataGetter<T> = ElementSSRDataGetter<T>;

type ZRenderInitOpt

type zrender_d_ZRenderInitOpt = ZRenderInitOpt;

type ZRenderType

type zrender_d_ZRenderType = ZRenderType;

namespace zrUtil

namespace zrUtil {}

variable assert

const assert: (condition: any, message?: string) => void;

variable bind

const bind: FunctionBind;

variable clone

const clone: <T extends unknown>(source: T) => T;

variable concatArray

const concatArray: <T, R>(
    a: ArrayLike$1<T>,
    b: ArrayLike$1<R>
) => ArrayLike$1<T | R>;

variable createCanvas

const createCanvas: () => HTMLCanvasElement;

variable createHashMap

const createHashMap: <T, KEY extends string | number = string | number>(
    obj?: HashMap<T, KEY> | { [key in KEY]?: T } | KEY[]
) => HashMap<T, KEY>;

variable createObject

const createObject: <T>(proto?: object, properties?: T) => T;

variable curry

const curry: {
    <F extends CurryFunc, T1 extends Parameters<F>[0]>(func: F, a: T1): Curry1<
        F,
        T1
    >;
    <F extends CurryFunc, T1 extends Parameters<F>[0], T2 extends Parameters<F>[1]>(
        func: F,
        a: T1,
        b: T2
    ): Curry2<F, T1, T2>;
    <
        F extends CurryFunc,
        T1 extends Parameters<F>[0],
        T2 extends Parameters<F>[1],
        T3 extends Parameters<F>[2]
    >(
        func: F,
        a: T1,
        b: T2,
        c: T3
    ): Curry3<F, T1, T2, T3>;
    <
        F extends CurryFunc,
        T1 extends Parameters<F>[0],
        T2 extends Parameters<F>[1],
        T3 extends Parameters<F>[2],
        T4 extends Parameters<F>[3]
    >(
        func: F,
        a: T1,
        b: T2,
        c: T3,
        d: T4
    ): Curry4<F, T1, T2, T3, T4>;
};

variable defaults

const defaults: <T extends Dictionary<any>, S extends Dictionary<any>>(
    target: T,
    source: S,
    overlay?: boolean
) => T & S;

variable disableUserSelect

const disableUserSelect: (dom: HTMLElement) => void;

variable each

const each: <
    I extends any[] | readonly any[] | ArrayLike$1<any> | Dictionary<any>,
    Context
>(
    arr: I,
    cb: (
        this: Context,
        value: I extends (infer T)[] | readonly (infer T)[] | ArrayLike$1<infer T>
            ? T
            : I extends Dictionary<any>
            ? I extends Record<infer K extends string | number | symbol, infer T>
                ? T
                : unknown
            : unknown,
        index?: I extends any[] | readonly any[] | ArrayLike$1<any>
            ? number
            : keyof I & string,
        arr?: I
    ) => void,
    context?: Context
) => void;

variable eqNaN

const eqNaN: (value: any) => boolean;

variable extend

const extend: <T extends Dictionary<any>, S extends Dictionary<any>>(
    target: T,
    source: S
) => T & S;

variable filter

const filter: <T, Context>(
    arr: readonly T[],
    cb: (this: Context, value: T, index: number, arr: readonly T[]) => boolean,
    context?: Context
) => T[];

variable find

const find: <T, Context>(
    arr: readonly T[],
    cb: (this: Context, value: T, index?: number, arr?: readonly T[]) => boolean,
    context?: Context
) => T;

variable guid

const guid: () => number;

variable HashMap

const HashMap: typeof HashMap;

variable hasOwn

const hasOwn: (own: object, prop: string) => boolean;

variable indexOf

const indexOf: <T>(array: T[] | readonly T[] | ArrayLike$1<T>, value: T) => number;

variable inherits

const inherits: (clazz: Function, baseClazz: Function) => void;

variable isArray

const isArray: (value: any) => value is any[];

variable isArrayLike

const isArrayLike: (data: any) => data is ArrayLike$1<any>;

variable isBuiltInObject

const isBuiltInObject: (value: any) => boolean;

variable isDom

const isDom: (value: any) => value is HTMLElement;

variable isFunction

const isFunction: (value: any) => value is Function;

variable isGradientObject

const isGradientObject: (value: any) => value is GradientObject;

variable isImagePatternObject

const isImagePatternObject: (value: any) => value is ImagePatternObject;

variable isNumber

const isNumber: (value: any) => value is number;

variable isObject

const isObject: <T = unknown>(value: T) => value is object & T;

variable isPrimitive

const isPrimitive: (obj: any) => boolean;

variable isRegExp

const isRegExp: (value: unknown) => value is RegExp;

variable isString

const isString: (value: any) => value is string;

variable isStringSafe

const isStringSafe: (value: any) => value is string;

variable isTypedArray

const isTypedArray: (value: any) => boolean;

variable keys

const keys: <T extends object>(obj: T) => (KeyOfDistributive<T> & string)[];

variable logError

const logError: (...args: any[]) => void;

variable map

const map: <T, R, Context>(
    arr: readonly T[],
    cb: (this: Context, val: T, index?: number, arr?: readonly T[]) => R,
    context?: Context
) => R[];

variable merge

const merge: {
    <T extends Dictionary<any>, S extends Dictionary<any>>(
        target: T,
        source: S,
        overwrite?: boolean
    ): T & S;
    <T extends unknown, S extends unknown>(
        target: T,
        source: S,
        overwrite?: boolean
    ): T | S;
};

variable mergeAll

const mergeAll: (targetAndSources: any[], overwrite?: boolean) => any;

variable mixin

const mixin: <T, S>(
    target: Function | T,
    source: Function | S,
    override?: boolean
) => void;

variable noop

const noop: () => void;

variable normalizeCssArray

const normalizeCssArray: (val: number | number[]) => number[];

variable RADIAN_TO_DEGREE

const RADIAN_TO_DEGREE: number;

variable reduce

const reduce: <T, S, Context>(
    arr: readonly T[],
    cb: (
        this: Context,
        previousValue: S,
        currentValue: T,
        currentIndex?: number,
        arr?: readonly T[]
    ) => S,
    memo?: S,
    context?: Context
) => S;

variable retrieve

const retrieve: <T>(...args: T[]) => T;

variable retrieve2

const retrieve2: <T, R>(value0: T, value1: R) => T | R;

variable retrieve3

const retrieve3: <T, R, W>(value0: T, value1: R, value2: W) => T | R | W;

variable setAsPrimitive

const setAsPrimitive: (obj: any) => void;

variable slice

const slice: <T>(arr: ArrayLike$1<T>, start?: number, end?: number) => T[];

variable trim

const trim: (str: string) => string;

type Bind1

type util_d_Bind1<F, Ctx> = Bind1<F, Ctx>;

type Bind2

type util_d_Bind2<F, Ctx, T1> = Bind2<F, Ctx, T1>;

type Bind3

type util_d_Bind3<F, Ctx, T1, T2> = Bind3<F, Ctx, T1, T2>;

type Bind4

type util_d_Bind4<F, Ctx, T1, T2, T3> = Bind4<F, Ctx, T1, T2, T3>;

type Bind5

type util_d_Bind5<F, Ctx, T1, T2, T3, T4> = Bind5<F, Ctx, T1, T2, T3, T4>;

type Curry1

type util_d_Curry1<F, T1> = Curry1<F, T1>;

type Curry2

type util_d_Curry2<F, T1, T2> = Curry2<F, T1, T2>;

type Curry3

type util_d_Curry3<F, T1, T2, T3> = Curry3<F, T1, T2, T3>;

type Curry4

type util_d_Curry4<F, T1, T2, T3, T4> = Curry4<F, T1, T2, T3, T4>;

type HashMap

type util_d_HashMap<T, KEY extends string | number = string | number> = HashMap<
    T,
    KEY
>;

Package Files (2)

Dependencies (2)

Peer Dependencies (0)

No peer dependencies.

Badge

To add a badge like this oneto your package's README, use the codes available below.

You may also use Shields.io to create a custom badge linking to https://www.jsdocs.io/package/echarts.

Markdown

[![jsDocs.io](https://img.shields.io/badge/jsDocs.io-reference-blue)](https://www.jsdocs.io/package/echarts)

HTML

<a href="https://www.jsdocs.io/package/echarts"><img src="https://img.shields.io/badge/jsDocs.io-reference-blue" alt="jsDocs.io"></a>

Updated 1 month ago.
Package analyzed in 18298 ms.
Missing or incorrect documentation? Open an issue for this package.

echarts

Install

Overview

Index

Variables

Functions

Classes

Interfaces

Type Aliases

Namespaces

Variables

variable dataTool

variable dependencies

variable disConnect

Deprecated

variable env

variable PRIORITY

variable registerTransform

variable version

Functions

function connect

function disconnect

function dispose

function extendChartView

function extendComponentModel

function extendComponentView

function extendSeriesModel

function getCoordinateSystemDimensions

Parameter type

function getInstanceByDom

function getInstanceById

function getMap

function init

Parameter

Parameter

Parameter

Parameter

Parameter

Parameter

function innerDrawElementOnCanvas

function parseGeoJson

function parseGeoJSON

function registerAction

Parameter actionInfo

Parameter

Parameter

Parameter

Parameter eventName

Parameter action

function registerCoordinateSystem

function registerLayout

function registerLoading

function registerLocale

function registerMap

function registerPostInit

Parameter postInitFunc

function registerPostUpdate

Parameter postUpdateFunc

function registerPreprocessor

function registerProcessor

function registerTheme

function registerUpdateLifecycle

function registerVisual

function setCanvasCreator

Example 1

Deprecated

function setPlatformAPI

function throttle

Parameter fn

Parameter delay

Parameter debounce

Modifiers

function use

Classes

class Axis

constructor

property dim

property getRotate

property inverse

property model