zrender

zrender

Version 5.6.0
Published 5 months ago
4.09 MB
1 dependency
BSD-3-Clause license

Install

npm i zrender

yarn add zrender

pnpm add zrender

Overview

A lightweight graphic library providing 2d draw for Apache ECharts

Index

Variables

variable version

const version: string;

Functions

function dispose

dispose: (zr: ZRender) => void;

function disposeAll

disposeAll: () => void;

function getElementSSRData

getElementSSRData: (el: Element) => ElementSSRData;

function getInstance

getInstance: (id: number) => ZRender;

function init

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

function parseSVG

parseSVG: (
    xml: string | Document | SVGElement,
    opt: SVGParserOption
) => SVGParserResult;

function registerPainter

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

function registerSSRDataGetter

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

function setPlatformAPI

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

function showDebugDirtyRect

showDebugDirtyRect: (zr: ZRenderType, opts?: Opts) => void;

Classes

class Arc

class Arc extends Path<ArcProps> {}

constructor

constructor(opts?: ArcProps);

property shape

shape: ArcShape;

method buildPath

buildPath: (ctx: CanvasRenderingContext2D, shape: ArcShape) => void;

method getDefaultShape

getDefaultShape: () => ArcShape;

method getDefaultStyle

getDefaultStyle: () => { stroke: string; fill: string };

class ArcShape

class ArcShape {}

property clockwise

clockwise?: boolean;

property cx

cx: number;

property cy

cy: number;

property endAngle

endAngle: number;

property r

r: number;

property startAngle

startAngle: number;

class BezierCurve

class BezierCurve extends Path<BezierCurveProps> {}

constructor

constructor(opts?: BezierCurveProps);

property shape

shape: BezierCurveShape;

method buildPath

buildPath: (ctx: CanvasRenderingContext2D, shape: BezierCurveShape) => void;

method getDefaultShape

getDefaultShape: () => BezierCurveShape;

method getDefaultStyle

getDefaultStyle: () => { stroke: string; fill: string };

method pointAt

pointAt: (t: number) => number[];

method tangentAt

tangentAt: (t: number) => number[];

class BezierCurveShape

class BezierCurveShape {}

property cpx1

cpx1: number;

property cpx2

cpx2?: number;

property cpy1

cpy1: number;

property cpy2

cpy2?: number;

property percent

percent: number;

property x1

x1: number;

property x2

x2: number;

property y1

y1: number;

property y2

y2: number;

class BoundingRect

class BoundingRect {}

constructor

constructor(x: number, y: number, width: number, height: number);

property height

height: number;

property width

width: number;

property x

x: number;

property y

y: number;

method applyTransform

static applyTransform: (
    target: RectLike,
    source: RectLike,
    m: matrix.MatrixArray
) => void;

method calculateTransform

calculateTransform: (b: RectLike) => matrix.MatrixArray;

method clone

clone: () => BoundingRect;

method contain

contain: (x: number, y: number) => boolean;

method copy

static copy: (target: RectLike, source: RectLike) => void;

method create

static create: (rect: RectLike) => BoundingRect;

method intersect

intersect: (b: RectLike, mtv?: PointLike) => boolean;

method isFinite

isFinite: () => boolean;

method isZero

isZero: () => boolean;

method plain

plain: () => RectLike;

method union

union: (other: BoundingRect) => void;

class Circle

class Circle extends Path<CircleProps> {}

constructor

constructor(opts?: CircleProps);

property shape

shape: CircleShape;

method buildPath

buildPath: (ctx: CanvasRenderingContext2D, shape: CircleShape) => void;

method getDefaultShape

getDefaultShape: () => CircleShape;

class CircleShape

class CircleShape {}

property cx

cx: number;

property cy

cy: number;

property r

r: number;

class CompoundPath

class CompoundPath extends Path {}

property shape

shape: CompoundPathShape;

property type

type: string;

method afterBrush

afterBrush: () => void;

method beforeBrush

beforeBrush: () => void;

method buildPath

buildPath: (
    ctx: PathProxy | CanvasRenderingContext2D,
    shape: CompoundPathShape
) => void;

method getBoundingRect

getBoundingRect: () => import('../core/BoundingRect').default;

class Displayable

class Displayable<
    Props extends DisplayableProps = DisplayableProps
> extends Element<Props> {}

constructor

constructor(props?: DisplayableProps);

property culling

culling: boolean;

property cursor

cursor: string;

property dirtyRectTolerance

dirtyRectTolerance: number;

property ignoreCoarsePointer

ignoreCoarsePointer?: boolean;

property incremental

incremental: boolean;

property initDefaultProps

protected static initDefaultProps: void;

property invisible

invisible: boolean;

property rectHover

rectHover: boolean;

property style

style: Dictionary<any>;

property useHoverLayer

useHoverLayer?: boolean;

property z

z: number;

property z2

z2: number;

property zlevel

zlevel: number;

method afterBrush

afterBrush: () => void;

method animateStyle

animateStyle: (loop: boolean) => Animator<this['style']>;

method attrKV

attrKV: (key: DisplayableKey, value: DisplayablePropertyType) => void;

method beforeBrush

beforeBrush: () => void;

method contain

contain: (x: number, y: number) => boolean;

method createStyle

createStyle: (obj?: Props['style']) => Props['style'];

method dirty

dirty: () => void;

method dirtyStyle

dirtyStyle: (notRedraw?: boolean) => void;

method getAnimationStyleProps

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

method getPaintRect

getPaintRect: () => BoundingRect;

method getPrevPaintRect

getPrevPaintRect: () => BoundingRect;

method innerAfterBrush

innerAfterBrush: () => void;

method innerBeforeBrush

innerBeforeBrush: () => void;

method isStyleObject

isStyleObject: (obj: Props['style']) => any;

method rectContain

rectContain: (x: number, y: number) => boolean;

method setPrevPaintRect

setPrevPaintRect: (paintRect: BoundingRect) => void;

method setStyle

setStyle: {
    (obj: Props['style']): this;
    <T extends keyof Props['style']>(obj: T, value: Props['style'][T]): this;
};

method shouldBePainted

shouldBePainted: (
    viewWidth: number,
    viewHeight: number,
    considerClipPath: boolean,
    considerAncestors: boolean
) => boolean;

method styleChanged

styleChanged: () => boolean;

method styleUpdated

styleUpdated: () => void;

method traverse

traverse: <Context>(
    cb: (this: Context, el: this) => void,
    context?: Context
) => void;

method updateDuringAnimation

updateDuringAnimation: (targetKey: string) => void;

method useStyle

useStyle: (obj: Props['style']) => void;

class Droplet

class Droplet extends Path<DropletProps> {}

constructor

constructor(opts?: DropletProps);

property shape

shape: DropletShape;

method buildPath

buildPath: (ctx: CanvasRenderingContext2D, shape: DropletShape) => void;

method getDefaultShape

getDefaultShape: () => DropletShape;

class DropletShape

class DropletShape {}

property cx

cx: number;

property cy

cy: number;

property height

height: number;

property width

width: number;

class Element

class Element<Props extends ElementProps = ElementProps> {}

constructor

constructor(props?: ElementProps);

property anid

anid: string;

property animators

animators: Animator<any>[];

property calculateTextPosition

calculateTextPosition: ElementCalculateTextPosition;

property currentStates

currentStates?: string[];

property draggable

draggable: boolean | 'horizontal' | 'vertical';

property dragging

dragging: boolean;

property extra

extra: Dictionary<unknown>;

property id

id: number;

property ignore

ignore: boolean;

property ignoreClip

ignoreClip: boolean;

property initDefaultProps

protected static initDefaultProps: void;

property isGroup

isGroup: boolean;

property name

name: string;

property parent

parent: Group;

property prevStates

prevStates?: string[];

property silent

silent: boolean;

property stateProxy

stateProxy?: (stateName: string, targetStates?: string[]) => ElementState;

property states

states: Dictionary<ElementState>;

property stateTransition

stateTransition: ElementAnimateConfig;

property textConfig

textConfig?: ElementTextConfig;

property textGuideLineConfig

textGuideLineConfig?: ElementTextGuideLineConfig;

property type

type: string;

method addAnimator

addAnimator: (animator: Animator<any>, key: string) => void;

method addSelfToZr

addSelfToZr: (zr: ZRenderType) => void;

method afterUpdate

afterUpdate: () => void;

method animate

animate: (
    key?: string,
    loop?: boolean,
    allowDiscreteAnimation?: boolean
) => Animator<any>;

method animateFrom

animateFrom: (
    target: Props,
    cfg: ElementAnimateConfig,
    animationProps?: MapToType<Props, boolean>
) => void;

method animateTo

animateTo: (
    target: Props,
    cfg?: ElementAnimateConfig,
    animationProps?: MapToType<Props, boolean>
) => void;

method attr

attr: {
    (keyOrObj: Props): this;
    <T extends keyof Props>(keyOrObj: T, value: Props[T]): this;
};

method attrKV

protected attrKV: (key: string, value: unknown) => void;

method beforeUpdate

beforeUpdate: () => void;

method canBeInsideText

protected canBeInsideText: () => boolean;

method clearStates

clearStates: (noAnimation?: boolean) => void;

method dirty

dirty: () => void;

method drift

drift: (dx: number, dy: number, e?: ElementEvent) => void;

method ensureState

ensureState: (name: string) => ElementState;

method getBoundingRect

getBoundingRect: () => BoundingRect;

method getClipPath

getClipPath: () => Path<import('./graphic/Path').PathProps>;

method getInsideTextFill

protected getInsideTextFill: () => string | undefined;

method getInsideTextStroke

protected getInsideTextStroke: (textFill: string) => string | undefined;

method getOutsideFill

protected getOutsideFill: () => string | undefined;

method getOutsideStroke

protected getOutsideStroke: (textFill: string) => string;

method getPaintRect

getPaintRect: () => BoundingRect;

method getState

getState: (name: string) => ElementState;

method getTextContent

getTextContent: () => ZRText;

method getTextGuideLine

getTextGuideLine: () => Polyline;

method hasState

hasState: () => boolean;

method hide

hide: () => void;

method isSilent

isSilent: () => boolean;

method markRedraw

markRedraw: () => void;

method removeClipPath

removeClipPath: () => void;

method removeSelfFromZr

removeSelfFromZr: (zr: ZRenderType) => void;

method removeState

removeState: (state: string) => void;

method removeTextConfig

removeTextConfig: () => void;

method removeTextContent

removeTextContent: () => void;

method removeTextGuideLine

removeTextGuideLine: () => void;

method replaceState

replaceState: (oldState: string, newState: string, forceAdd: boolean) => void;

method saveCurrentToNormalState

saveCurrentToNormalState: (toState: ElementState) => void;

method setClipPath

setClipPath: (clipPath: Path) => void;

method setTextConfig

setTextConfig: (cfg: ElementTextConfig) => void;

method setTextContent

setTextContent: (textEl: ZRText) => void;

method setTextGuideLine

setTextGuideLine: (guideLine: Polyline) => void;

method show

show: () => void;

method stopAnimation

stopAnimation: (scope?: string, forwardToLast?: boolean) => this;

method toggleState

toggleState: (state: string, enable: boolean) => void;

method traverse

traverse: <Context>(
    cb: (this: Context, el: Element<Props>) => void,
    context?: Context
) => void;

method update

update: () => void;

method updateDuringAnimation

updateDuringAnimation: (key: string) => void;

method updateInnerText

updateInnerText: (forceUpdate?: boolean) => void;

method useState

useState: (
    stateName: string,
    keepCurrentStates?: boolean,
    noAnimation?: boolean,
    forceUseHoverLayer?: boolean
) => ElementState;

method useStates

useStates: (
    states: string[],
    noAnimation?: boolean,
    forceUseHoverLayer?: boolean
) => void;

class Ellipse

class Ellipse extends Path<EllipseProps> {}

constructor

constructor(opts?: EllipseProps);

property shape

shape: EllipseShape;

method buildPath

buildPath: (ctx: CanvasRenderingContext2D, shape: EllipseShape) => void;

method getDefaultShape

getDefaultShape: () => EllipseShape;

class EllipseShape

class EllipseShape {}

property cx

cx: number;

property cy

cy: number;

property rx

rx: number;

property ry

ry: number;

class Group

class Group extends Element<GroupProps> {}

constructor

constructor(opts?: GroupProps);

property isGroup

readonly isGroup: boolean;

method add

add: (child: Element) => Group;

method addBefore

addBefore: (child: Element, nextSibling: Element) => this;

method addSelfToZr

addSelfToZr: (zr: ZRenderType) => void;

method childAt

childAt: (idx: number) => Element;

method childCount

childCount: () => number;

method childOfName

childOfName: (name: string) => Element;

method children

children: () => Element<ElementProps>[];

method childrenRef

childrenRef: () => Element<ElementProps>[];

method eachChild

eachChild: <Context>(
    cb: (this: Context, el: Element, index?: number) => void,
    context?: Context
) => this;

method getBoundingRect

getBoundingRect: (includeChildren?: Element[]) => BoundingRect;

method remove

remove: (child: Element) => this;

method removeAll

removeAll: () => this;

method removeSelfFromZr

removeSelfFromZr: (zr: ZRenderType) => void;

method replace

replace: (oldChild: Element, newChild: Element) => this;

method replaceAt

replaceAt: (child: Element, index: number) => this;

method traverse

traverse: <T>(cb: (this: T, el: Element) => boolean | void, context?: T) => this;

class Heart

class Heart extends Path<HeartProps> {}

constructor

constructor(opts?: HeartProps);

property shape

shape: HeartShape;

method buildPath

buildPath: (ctx: CanvasRenderingContext2D, shape: HeartShape) => void;

method getDefaultShape

getDefaultShape: () => HeartShape;

class HeartShape

class HeartShape {}

property cx

cx: number;

property cy

cy: number;

property height

height: number;

property width

width: number;

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 IncrementalDisplayable

class IncrementalDisplayable extends Displayble {}

property incremental

incremental: boolean;

property notClear

notClear: boolean;

method addDisplayable

addDisplayable: (displayable: Displayble, notPersistent?: boolean) => void;

method addDisplayables

addDisplayables: (displayables: Displayble[], notPersistent?: boolean) => void;

method clearDisplaybles

clearDisplaybles: () => void;

method clearTemporalDisplayables

clearTemporalDisplayables: () => void;

method contain

contain: (x: number, y: number) => boolean;

method eachPendingDisplayable

eachPendingDisplayable: (cb: (displayable: Displayble) => void) => void;

method getBoundingRect

getBoundingRect: () => BoundingRect;

method getCursor

getCursor: () => number;

method getDisplayables

getDisplayables: () => Displayble[];

method getTemporalDisplayables

getTemporalDisplayables: () => Displayble[];

method innerAfterBrush

innerAfterBrush: () => void;

method traverse

traverse: <T>(cb: (this: T, el: this) => void, context: T) => void;

method update

update: () => void;

method useStyle

useStyle: () => void;

class Isogon

class Isogon extends Path<IsogonProps> {}

constructor

constructor(opts?: IsogonProps);

property shape

shape: IsogonShape;

method buildPath

buildPath: (ctx: CanvasRenderingContext2D, shape: IsogonShape) => void;

method getDefaultShape

getDefaultShape: () => IsogonShape;

class IsogonShape

class IsogonShape {}

property n

n: number;

property r

r: number;

property x

x: number;

property y

y: number;

class Line

class Line extends Path<LineProps> {}

constructor

constructor(opts?: LineProps);

property shape

shape: LineShape;

method buildPath

buildPath: (ctx: CanvasRenderingContext2D, shape: LineShape) => void;

method getDefaultShape

getDefaultShape: () => LineShape;

method getDefaultStyle

getDefaultStyle: () => { stroke: string; fill: string };

method pointAt

pointAt: (p: number) => VectorArray;

class LinearGradient

class LinearGradient extends Gradient {}

constructor

constructor(
    x: number,
    y: number,
    x2: number,
    y2: number,
    colorStops?: GradientColorStop[],
    globalCoord?: boolean
);

property type

type: string;

property x

x: number;

property x2

x2: number;

property y

y: number;

property y2

y2: number;

class LineShape

class LineShape {}

property percent

percent: number;

property x1

x1: number;

property x2

x2: number;

property y1

y1: number;

property y2

y2: number;

class OrientedBoundingRect

class OrientedBoundingRect {}

constructor

constructor(rect?: BoundingRect, transform?: MatrixArray);

method fromBoundingRect

fromBoundingRect: (rect: BoundingRect, transform?: MatrixArray) => void;

method intersect

intersect: (other: OrientedBoundingRect, mtv?: PointLike) => boolean;

class Path

class Path<Props extends PathProps = PathProps> extends Displayable<Props> {}

constructor

constructor(opts?: PathProps);

property autoBatch

autoBatch: boolean;

property initDefaultProps

protected static initDefaultProps: void;

property path

path: PathProxy;

property segmentIgnoreThreshold

segmentIgnoreThreshold: number;

property shape

shape: Dictionary<any>;

property strokeContainThreshold

strokeContainThreshold: number;

property style

style: PathStyleProps;

property subPixelOptimize

subPixelOptimize: boolean;

method animateShape

animateShape: (loop: boolean) => Animator<this['shape']>;

method attrKV

attrKV: (key: PathKey, value: PathPropertyType) => void;

method buildPath

buildPath: (
    ctx: PathProxy | CanvasRenderingContext2D,
    shapeCfg: Dictionary<any>,
    inBatch?: boolean
) => void;

method canBeInsideText

protected canBeInsideText: () => boolean;

method contain

contain: (x: number, y: number) => boolean;

method createPathProxy

createPathProxy: () => void;

method createStyle

createStyle: (obj?: Props['style']) => Props['style'];

method dirty

dirty: () => void;

method dirtyShape

dirtyShape: () => void;

method extend

static extend: <Shape extends Dictionary<any>>(defaultProps: {
    type?: string;
    shape?: Shape;
    style?: PathStyleProps;
    beforeBrush?: Displayable['beforeBrush'];
    afterBrush?: Displayable['afterBrush'];
    getBoundingRect?: Displayable['getBoundingRect'];
    calculateTextPosition?: Element['calculateTextPosition'];
    buildPath(
        this: Path,
        ctx: CanvasRenderingContext2D | PathProxy,
        shape: Shape,
        inBatch?: boolean
    ): void;
    init?(this: Path, opts: PathProps): void;
}) => new (opts?: PathProps & { shape: Shape }) => Path;

method getAnimationStyleProps

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

method getBoundingRect

getBoundingRect: () => BoundingRect;

method getDecalElement

getDecalElement: () => Path<PathProps>;

method getDefaultShape

protected getDefaultShape: () => {};

method getDefaultStyle

protected getDefaultStyle: () => Props['style'];

method getInsideTextFill

protected getInsideTextFill: () => '#333' | '#ccc' | '#eee';

method getInsideTextStroke

protected getInsideTextStroke: (textFill?: string) => string;

method getUpdatedPathProxy

getUpdatedPathProxy: (inBatch?: boolean) => PathProxy;

method hasFill

hasFill: () => boolean;

method hasStroke

hasStroke: () => boolean;

method isZeroArea

isZeroArea: () => boolean;

method pathUpdated

pathUpdated: () => void;

method setShape

setShape: {
    (obj: Props['shape']): this;
    <T extends keyof Props['shape']>(obj: T, value: Props['shape'][T]): this;
};

method shapeChanged

shapeChanged: () => boolean;

method update

update: () => void;

method updateDuringAnimation

updateDuringAnimation: (targetKey: string) => void;

class Pattern

class Pattern {}

constructor

constructor(image: string | ImageLike, repeat: ImagePatternRepeat);

property image

image: string | ImageLike;

property repeat

repeat: ImagePatternRepeat;

property rotation

rotation: number;

property scaleX

scaleX: number;

property scaleY

scaleY: number;

property svgElement

svgElement: string | SVGElement;

property type

type: string;

property x

x: number;

property y

y: number;

class Point

class Point {}

constructor

constructor(x?: number, y?: number);

property x

x: number;

property y

y: number;

method add

static add: (out: PointLike, p0: PointLike, p1: PointLike) => void;

method clone

clone: () => Point;

method copy

static copy: (p: PointLike, p2: PointLike) => void;

method distance

distance: (other: PointLike) => number;

method distanceSquare

distanceSquare: (other: Point) => number;

method dot

static dot: (p0: PointLike, p1: PointLike) => number;

method equal

equal: (other: PointLike) => boolean;

method fromArray

fromArray: (input: number[]) => void;

method len

static len: (p: PointLike) => number;

method lenSquare

static lenSquare: (p: PointLike) => number;

method lerp

static lerp: (out: PointLike, p0: PointLike, p1: PointLike, t: number) => void;

method negate

negate: () => this;

method normalize

normalize: () => this;

method scale

static scale: (out: PointLike, p0: PointLike, scalar: number) => void;

method scaleAndAdd

static scaleAndAdd: (
    out: PointLike,
    p0: PointLike,
    p1: PointLike,
    scalar: number
) => void;

method set

static set: (p: PointLike, x: number, y: number) => void;

method sub

static sub: (out: PointLike, p0: PointLike, p1: PointLike) => void;

method toArray

toArray: (out: number[]) => number[];

method transform

transform: (m: MatrixArray) => this;

class Polygon

class Polygon extends Path<PolygonProps> {}

constructor

constructor(opts?: PolygonProps);

property shape

shape: PolygonShape;

method buildPath

buildPath: (ctx: CanvasRenderingContext2D, shape: PolygonShape) => void;

method getDefaultShape

getDefaultShape: () => PolygonShape;

class PolygonShape

class PolygonShape {}

property points

points: VectorArray[];

property smooth

smooth?: number;

property smoothConstraint

smoothConstraint?: VectorArray[];

class Polyline

class Polyline extends Path<PolylineProps> {}

constructor

constructor(opts?: PolylineProps);

property shape

shape: PolylineShape;

method buildPath

buildPath: (ctx: CanvasRenderingContext2D, shape: PolylineShape) => void;

method getDefaultShape

getDefaultShape: () => PolylineShape;

method getDefaultStyle

getDefaultStyle: () => { stroke: string; fill: string };

class PolylineShape

class PolylineShape {}

property percent

percent?: number;

property points

points: VectorArray[];

property smooth

smooth?: number;

property smoothConstraint

smoothConstraint?: VectorArray[];

class RadialGradient

class RadialGradient extends Gradient {}

constructor

constructor(
    x: number,
    y: number,
    r: number,
    colorStops?: GradientColorStop[],
    globalCoord?: boolean
);

property r

r: number;

property type

type: string;

property x

x: number;

property y

y: number;

class Rect

class Rect extends Path<RectProps> {}

constructor

constructor(opts?: RectProps);

property shape

shape: RectShape;

method buildPath

buildPath: (ctx: CanvasRenderingContext2D, shape: RectShape) => void;

method getDefaultShape

getDefaultShape: () => RectShape;

method isZeroArea

isZeroArea: () => boolean;

class RectShape

class RectShape {}

property height

height: number;

property r

r?: number | number[];

property width

width: number;

property x

x: number;

property y

y: number;

class Ring

class Ring extends Path<RingProps> {}

constructor

constructor(opts?: RingProps);

property shape

shape: RingShape;

method buildPath

buildPath: (ctx: CanvasRenderingContext2D, shape: RingShape) => void;

method getDefaultShape

getDefaultShape: () => RingShape;

class RingShape

class RingShape {}

property cx

cx: number;

property cy

cy: number;

property r

r: number;

property r0

r0: number;

class Rose

class Rose extends Path<RoseProps> {}

constructor

constructor(opts?: RoseProps);

property shape

shape: RoseShape;

method buildPath

buildPath: (ctx: CanvasRenderingContext2D, shape: RoseShape) => void;

method getDefaultShape

getDefaultShape: () => RoseShape;

method getDefaultStyle

getDefaultStyle: () => { stroke: string; fill: string };

class RoseShape

class RoseShape {}

property cx

cx: number;

property cy

cy: number;

property k

k: number;

property n

n: number;

property r

r: number[];

class Sector

class Sector extends Path<SectorProps> {}

constructor

constructor(opts?: SectorProps);

property shape

shape: SectorShape;

method buildPath

buildPath: (ctx: CanvasRenderingContext2D, shape: SectorShape) => void;

method getDefaultShape

getDefaultShape: () => SectorShape;

method isZeroArea

isZeroArea: () => boolean;

class SectorShape

class SectorShape {}

property clockwise

clockwise: boolean;

property cornerRadius

cornerRadius: number | number[];

property cx

cx: number;

property cy

cy: number;

property endAngle

endAngle: number;

property r

r: number;

property r0

r0: number;

property startAngle

startAngle: number;

class Star

class Star extends Path<StarProps> {}

constructor

constructor(opts?: StarProps);

property shape

shape: StarShape;

method buildPath

buildPath: (ctx: CanvasRenderingContext2D, shape: StarShape) => void;

method getDefaultShape

getDefaultShape: () => StarShape;

class StarShape

class StarShape {}

property cx

cx: number;

property cy

cy: number;

property n

n: number;

property r

r: number;

property r0

r0: number;

class Text

class ZRText extends Displayable<TextProps> implements GroupLike {}

constructor

constructor(opts?: TextProps);

property innerTransformable

innerTransformable: Transformable;

property overlap

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

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;

class Trochoid

class Trochoid extends Path<TrochoidProps> {}

constructor

constructor(opts?: TrochoidProps);

property shape

shape: TrochoidShape;

method buildPath

buildPath: (ctx: CanvasRenderingContext2D, shape: TrochoidShape) => void;

method getDefaultShape

getDefaultShape: () => TrochoidShape;

method getDefaultStyle

getDefaultStyle: () => { stroke: string; fill: string };

class TrochoidShape

class TrochoidShape {}

property cx

cx: number;

property cy

cy: number;

property d

d: number;

property location

location: string;

property r

r: number;

property r0

r0: number;

class TSpan

class TSpan extends Displayable<TSpanProps> {}

property initDefaultProps

protected static initDefaultProps: void;

property style

style: TSpanStyleProps;

method createStyle

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

method getBoundingRect

getBoundingRect: () => BoundingRect;

method hasFill

hasFill: () => boolean;

method hasStroke

hasStroke: () => boolean;

method setBoundingRect

setBoundingRect: (rect: BoundingRect) => void;

Interfaces

interface ArcProps

interface ArcProps extends PathProps {}

property shape

shape?: Partial<ArcShape>;

interface BezierCurveProps

interface BezierCurveProps extends PathProps {}

property shape

shape?: Partial<BezierCurveShape>;

interface CircleProps

interface CircleProps extends PathProps {}

property shape

shape?: Partial<CircleShape>;

interface CompoundPathShape

interface CompoundPathShape {}

property paths

paths: Path[];

interface Displayable

interface Displayable<Props extends DisplayableProps = DisplayableProps> {}

property stateProxy

stateProxy: (stateName: string) => DisplayableState;

property states

states: Dictionary<DisplayableState>;

method animate

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

method ensureState

ensureState: (stateName: string) => DisplayableState;

method getState

getState: (stateName: string) => DisplayableState;

interface DisplayableProps

interface DisplayableProps extends ElementProps {}

property batch

batch?: boolean;

property culling

culling?: boolean;

property cursor

cursor?: string;

property ignoreCoarsePointer

ignoreCoarsePointer?: boolean;

property incremental

incremental?: boolean;

property invisible

invisible?: boolean;

property progressive

progressive?: boolean;

property rectHover

rectHover?: boolean;

property style

style?: Dictionary<any>;

property z

z?: number;

property z2

z2?: number;

property zlevel

zlevel?: number;

interface DropletProps

interface DropletProps extends PathProps {}

property shape

shape?: Partial<DropletShape>;

interface Element

interface Element<Props extends ElementProps = ElementProps>
    extends Transformable,
        Eventful<
            {
                [key in ElementEventName]: (e: ElementEvent) => void | boolean;
            } & {
                [key in string]: (...args: any) => void | boolean;
            }
        >,
        ElementEventHandlerProps {}

interface ElementAnimateConfig

interface ElementAnimateConfig {}

property aborted

aborted?: Function;

property additive

additive?: boolean;

property delay

delay?: number;

property done

done?: Function;

property duration

duration?: number;

property during

during?: (percent: number) => void;

property easing

easing?: AnimationEasing;

property force

force?: boolean;

property scope

scope?: string;

property setToFinal

setToFinal?: boolean;

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 ElementProps

interface ElementProps
    extends Partial<ElementEventHandlerProps>,
        Partial<Pick<Transformable, TransformProp>> {}

property anid

anid?: string;

property clipPath

clipPath?: Path;

property draggable

draggable?: boolean | 'horizontal' | 'vertical';

property drift

drift?: Element['drift'];

property extra

extra?: Dictionary<unknown>;

property globalScaleRatio

globalScaleRatio?: number;

property ignore

ignore?: boolean;

property ignoreClip

ignoreClip?: boolean;

property isGroup

isGroup?: boolean;

property name

name?: string;

property silent

silent?: boolean;

property textConfig

textConfig?: ElementTextConfig;

property textContent

textContent?: ZRText;

interface ElementTextConfig

interface ElementTextConfig {}

property distance

distance?: number;

property inside

inside?: boolean;

property insideFill

insideFill?: string;

property insideStroke

insideStroke?: string;

property layoutRect

layoutRect?: RectLike;

property local

local?: boolean;

property offset

offset?: number[];

property origin

origin?: (number | string)[] | 'center';

property outsideFill

outsideFill?: string;

property outsideStroke

outsideStroke?: string;

property position

position?: BuiltinTextPosition | (number | string)[];

property rotation

rotation?: number;

interface ElementTextGuideLineConfig

interface ElementTextGuideLineConfig {}

property anchor

anchor?: Point;

property candidates

candidates?: ('left' | 'top' | 'right' | 'bottom')[];

property showAbove

showAbove?: boolean;

interface EllipseProps

interface EllipseProps extends PathProps {}

property shape

shape?: Partial<EllipseShape>;

interface GroupProps

interface GroupProps extends ElementProps {}

interface HeartProps

interface HeartProps extends PathProps {}

property shape

shape?: Partial<HeartShape>;

interface ImagePatternObject

interface ImagePatternObject extends PatternObjectBase {}

property image

image: ImageLike | string;

property imageHeight

imageHeight?: number;

property imageWidth

imageWidth?: number;

property repeat

repeat?: ImagePatternRepeat;

interface ImageProps

interface ImageProps extends DisplayableProps {}

property onload

onload?: (image: ImageLike) => void;

property style

style?: ImageStyleProps;

interface ImageStyleProps

interface ImageStyleProps extends CommonStyleProps {}

property height

height?: number;

property image

image?: string | ImageLike;

property sHeight

sHeight?: number;

property sWidth

sWidth?: number;

property sx

sx?: number;

property sy

sy?: number;

property width

width?: number;

property x

x?: number;

property y

y?: number;

interface IsogonProps

interface IsogonProps extends PathProps {}

property shape

shape?: Partial<IsogonShape>;

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 LineProps

interface LineProps extends PathProps {}

property shape

shape?: Partial<LineShape>;

interface Path

interface Path<Props extends PathProps = PathProps> {}

property stateProxy

stateProxy: (stateName: string) => PathState;

property states

states: Dictionary<PathState>;

method animate

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

method ensureState

ensureState: (stateName: string) => PathState;

method getState

getState: (stateName: string) => PathState;

interface PathProps

interface PathProps extends DisplayableProps {}

property autoBatch

autoBatch?: boolean;

property buildPath

buildPath?: (
    ctx: PathProxy | CanvasRenderingContext2D,
    shapeCfg: Dictionary<any>,
    inBatch?: boolean
) => void;

zrender

Install

Overview

Index

Variables

Functions

Classes

Interfaces

Type Aliases

Namespaces

Variables

variable version

Functions

function dispose

function disposeAll

function getElementSSRData

function getInstance

function init

function parseSVG

function registerPainter

function registerSSRDataGetter

function setPlatformAPI

function showDebugDirtyRect

Classes

class Arc

constructor

property shape

method buildPath

method getDefaultShape

method getDefaultStyle

class ArcShape

property clockwise

property cx

property cy

property endAngle

property r

property startAngle

class BezierCurve

constructor

property shape

method buildPath

method getDefaultShape

method getDefaultStyle

method pointAt

method tangentAt

class BezierCurveShape

property cpx1

property cpx2

property cpy1

property cpy2

property percent

property x1

property x2

property y1

property y2

class BoundingRect

constructor

property height

property width

property x

property y

method applyTransform

method calculateTransform

method clone

method contain

method copy

method create

method intersect

method isFinite

method isZero

method plain

method union

class Circle

constructor

property shape

method buildPath

method getDefaultShape

class CircleShape

property cx

property cy