Merge remote-tracking branch 'upstream/main'

This commit is contained in:
2026-08-26 09:31:34 +08:00
parent 9b8c4bfab6
commit 394eb0285d
34137 changed files with 3589424 additions and 0 deletions
+205
View File
@@ -0,0 +1,205 @@
import Transformable, { TransformProp } from './core/Transformable';
import { AnimationEasing } from './animation/easing';
import Animator from './animation/Animator';
import { ZRenderType } from './zrender';
import { Dictionary, ElementEventName, ZRRawEvent, BuiltinTextPosition, MapToType } from './core/types';
import Path from './graphic/Path';
import BoundingRect, { RectLike } from './core/BoundingRect';
import Eventful from './core/Eventful';
import ZRText from './graphic/Text';
import { TextPositionCalculationResult } from './contain/text';
import Polyline from './graphic/shape/Polyline';
import Group from './graphic/Group';
import Point from './core/Point';
export interface ElementAnimateConfig {
duration?: number;
delay?: number;
easing?: AnimationEasing;
during?: (percent: number) => void;
done?: Function;
aborted?: Function;
scope?: string;
force?: boolean;
additive?: boolean;
setToFinal?: boolean;
}
export interface ElementTextConfig {
position?: BuiltinTextPosition | (number | string)[];
rotation?: number;
layoutRect?: RectLike;
offset?: number[];
origin?: (number | string)[] | 'center';
distance?: number;
local?: boolean;
insideFill?: string;
insideStroke?: string;
outsideFill?: string;
outsideStroke?: string;
inside?: boolean;
}
export interface ElementTextGuideLineConfig {
anchor?: Point;
showAbove?: boolean;
candidates?: ('left' | 'top' | 'right' | 'bottom')[];
}
export interface ElementEvent {
type: ElementEventName;
event: ZRRawEvent;
target: Element;
topTarget: Element;
cancelBubble: boolean;
offsetX: number;
offsetY: number;
gestureEvent: string;
pinchX: number;
pinchY: number;
pinchScale: number;
wheelDelta: number;
zrByTouch: boolean;
which: number;
stop: (this: ElementEvent) => void;
}
export declare type ElementEventCallback<Ctx, Impl> = (this: CbThis<Ctx, Impl>, e: ElementEvent) => boolean | void;
declare type CbThis<Ctx, Impl> = unknown extends Ctx ? Impl : Ctx;
interface ElementEventHandlerProps {
onclick: ElementEventCallback<unknown, unknown>;
ondblclick: ElementEventCallback<unknown, unknown>;
onmouseover: ElementEventCallback<unknown, unknown>;
onmouseout: ElementEventCallback<unknown, unknown>;
onmousemove: ElementEventCallback<unknown, unknown>;
onmousewheel: ElementEventCallback<unknown, unknown>;
onmousedown: ElementEventCallback<unknown, unknown>;
onmouseup: ElementEventCallback<unknown, unknown>;
oncontextmenu: ElementEventCallback<unknown, unknown>;
ondrag: ElementEventCallback<unknown, unknown>;
ondragstart: ElementEventCallback<unknown, unknown>;
ondragend: ElementEventCallback<unknown, unknown>;
ondragenter: ElementEventCallback<unknown, unknown>;
ondragleave: ElementEventCallback<unknown, unknown>;
ondragover: ElementEventCallback<unknown, unknown>;
ondrop: ElementEventCallback<unknown, unknown>;
}
export interface ElementProps extends Partial<ElementEventHandlerProps>, Partial<Pick<Transformable, TransformProp>> {
name?: string;
ignore?: boolean;
isGroup?: boolean;
draggable?: boolean | 'horizontal' | 'vertical';
silent?: boolean;
ignoreClip?: boolean;
globalScaleRatio?: number;
textConfig?: ElementTextConfig;
textContent?: ZRText;
clipPath?: Path;
drift?: Element['drift'];
extra?: Dictionary<unknown>;
anid?: string;
}
export declare const PRESERVED_NORMAL_STATE = "__zr_normal__";
declare const PRIMARY_STATES_KEYS: ["x" | "y" | "originX" | "originY" | "anchorX" | "anchorY" | "rotation" | "scaleX" | "scaleY" | "skewX" | "skewY", "ignore"];
export declare type ElementStatePropNames = (typeof PRIMARY_STATES_KEYS)[number] | 'textConfig';
export declare type ElementState = Pick<ElementProps, ElementStatePropNames> & ElementCommonState;
export declare type ElementCommonState = {
hoverLayer?: boolean;
};
export declare type ElementCalculateTextPosition = (out: TextPositionCalculationResult, style: ElementTextConfig, rect: RectLike) => TextPositionCalculationResult;
interface Element<Props extends ElementProps = ElementProps> extends Transformable, Eventful<{
[key in ElementEventName]: (e: ElementEvent) => void | boolean;
} & {
[key in string]: (...args: any) => void | boolean;
}>, ElementEventHandlerProps {
}
declare class Element<Props extends ElementProps = ElementProps> {
id: number;
type: string;
name: string;
ignore: boolean;
silent: boolean;
isGroup: boolean;
draggable: boolean | 'horizontal' | 'vertical';
dragging: boolean;
parent: Group;
animators: Animator<any>[];
ignoreClip: boolean;
__hostTarget: Element;
__zr: ZRenderType;
__dirty: number;
__isRendered: boolean;
__inHover: boolean;
private _clipPath?;
private _textContent?;
private _textGuide?;
textConfig?: ElementTextConfig;
textGuideLineConfig?: ElementTextGuideLineConfig;
anid: string;
extra: Dictionary<unknown>;
currentStates?: string[];
prevStates?: string[];
states: Dictionary<ElementState>;
stateTransition: ElementAnimateConfig;
stateProxy?: (stateName: string, targetStates?: string[]) => ElementState;
protected _normalState: ElementState;
private _innerTextDefaultStyle;
constructor(props?: Props);
protected _init(props?: Props): void;
drift(dx: number, dy: number, e?: ElementEvent): void;
beforeUpdate(): void;
afterUpdate(): void;
update(): void;
updateInnerText(forceUpdate?: boolean): void;
protected canBeInsideText(): boolean;
protected getInsideTextFill(): string | undefined;
protected getInsideTextStroke(textFill: string): string | undefined;
protected getOutsideFill(): string | undefined;
protected getOutsideStroke(textFill: string): string;
traverse<Context>(cb: (this: Context, el: Element<Props>) => void, context?: Context): void;
protected attrKV(key: string, value: unknown): void;
hide(): void;
show(): void;
attr(keyOrObj: Props): this;
attr<T extends keyof Props>(keyOrObj: T, value: Props[T]): this;
saveCurrentToNormalState(toState: ElementState): void;
protected _innerSaveToNormal(toState: ElementState): void;
protected _savePrimaryToNormal(toState: Dictionary<any>, normalState: Dictionary<any>, primaryKeys: readonly string[]): void;
hasState(): boolean;
getState(name: string): ElementState;
ensureState(name: string): ElementState;
clearStates(noAnimation?: boolean): void;
useState(stateName: string, keepCurrentStates?: boolean, noAnimation?: boolean, forceUseHoverLayer?: boolean): ElementState;
useStates(states: string[], noAnimation?: boolean, forceUseHoverLayer?: boolean): void;
private _updateAnimationTargets;
removeState(state: string): void;
replaceState(oldState: string, newState: string, forceAdd: boolean): void;
toggleState(state: string, enable: boolean): void;
protected _mergeStates(states: ElementState[]): ElementState;
protected _applyStateObj(stateName: string, state: ElementState, normalState: ElementState, keepCurrentStates: boolean, transition: boolean, animationCfg: ElementAnimateConfig): void;
private _attachComponent;
private _detachComponent;
getClipPath(): Path<import("./graphic/Path").PathProps>;
setClipPath(clipPath: Path): void;
removeClipPath(): void;
getTextContent(): ZRText;
setTextContent(textEl: ZRText): void;
setTextConfig(cfg: ElementTextConfig): void;
removeTextConfig(): void;
removeTextContent(): void;
getTextGuideLine(): Polyline;
setTextGuideLine(guideLine: Polyline): void;
removeTextGuideLine(): void;
markRedraw(): void;
dirty(): void;
private _toggleHoverLayerFlag;
addSelfToZr(zr: ZRenderType): void;
removeSelfFromZr(zr: ZRenderType): void;
animate(key?: string, loop?: boolean, allowDiscreteAnimation?: boolean): Animator<any>;
addAnimator(animator: Animator<any>, key: string): void;
updateDuringAnimation(key: string): void;
stopAnimation(scope?: string, forwardToLast?: boolean): this;
animateTo(target: Props, cfg?: ElementAnimateConfig, animationProps?: MapToType<Props, boolean>): void;
animateFrom(target: Props, cfg: ElementAnimateConfig, animationProps?: MapToType<Props, boolean>): void;
protected _transitionState(stateName: string, target: Props, cfg?: ElementAnimateConfig, animationProps?: MapToType<Props, boolean>): void;
getBoundingRect(): BoundingRect;
getPaintRect(): BoundingRect;
calculateTextPosition: ElementCalculateTextPosition;
protected static initDefaultProps: void;
}
export default Element;
+1038
View File
File diff suppressed because it is too large Load Diff
File diff suppressed because one or more lines are too long
+49
View File
@@ -0,0 +1,49 @@
import Eventful from './core/Eventful';
import Displayable from './graphic/Displayable';
import { PainterBase } from './PainterBase';
import { HandlerProxyInterface } from './dom/HandlerProxy';
import { ZRRawEvent, ElementEventName } from './core/types';
import Storage from './Storage';
import Element from './Element';
declare class HoveredResult {
x: number;
y: number;
target: Displayable;
topTarget: Displayable;
constructor(x?: number, y?: number);
}
declare type HandlerName = 'click' | 'dblclick' | 'mousewheel' | 'mouseout' | 'mouseup' | 'mousedown' | 'mousemove' | 'contextmenu';
declare class Handler extends Eventful {
storage: Storage;
painter: PainterBase;
painterRoot: HTMLElement;
proxy: HandlerProxyInterface;
private _hovered;
private _gestureMgr;
private _draggingMgr;
private _pointerSize;
_downEl: Element;
_upEl: Element;
_downPoint: [number, number];
constructor(storage: Storage, painter: PainterBase, proxy: HandlerProxyInterface, painterRoot: HTMLElement, pointerSize: number);
setHandlerProxy(proxy: HandlerProxyInterface): void;
mousemove(event: ZRRawEvent): void;
mouseout(event: ZRRawEvent): void;
resize(): void;
dispatch(eventName: HandlerName, eventArgs?: any): void;
dispose(): void;
setCursorStyle(cursorStyle: string): void;
dispatchToElement(targetInfo: {
target?: Element;
topTarget?: Element;
}, eventName: ElementEventName, event: ZRRawEvent): void;
findHover(x: number, y: number, exclude?: Displayable): HoveredResult;
processGesture(event: ZRRawEvent, stage?: 'start' | 'end' | 'change'): void;
click: (event: ZRRawEvent) => void;
mousedown: (event: ZRRawEvent) => void;
mouseup: (event: ZRRawEvent) => void;
mousewheel: (event: ZRRawEvent) => void;
dblclick: (event: ZRRawEvent) => void;
contextmenu: (event: ZRRawEvent) => void;
}
export default Handler;
+295
View File
@@ -0,0 +1,295 @@
import { __extends } from "tslib";
import * as util from './core/util.js';
import * as vec2 from './core/vector.js';
import Draggable from './mixin/Draggable.js';
import Eventful from './core/Eventful.js';
import * as eventTool from './core/event.js';
import { GestureMgr } from './core/GestureMgr.js';
import BoundingRect from './core/BoundingRect.js';
var SILENT = 'silent';
function makeEventPacket(eveType, targetInfo, event) {
return {
type: eveType,
event: event,
target: targetInfo.target,
topTarget: targetInfo.topTarget,
cancelBubble: false,
offsetX: event.zrX,
offsetY: event.zrY,
gestureEvent: event.gestureEvent,
pinchX: event.pinchX,
pinchY: event.pinchY,
pinchScale: event.pinchScale,
wheelDelta: event.zrDelta,
zrByTouch: event.zrByTouch,
which: event.which,
stop: stopEvent
};
}
function stopEvent() {
eventTool.stop(this.event);
}
var EmptyProxy = (function (_super) {
__extends(EmptyProxy, _super);
function EmptyProxy() {
var _this = _super !== null && _super.apply(this, arguments) || this;
_this.handler = null;
return _this;
}
EmptyProxy.prototype.dispose = function () { };
EmptyProxy.prototype.setCursor = function () { };
return EmptyProxy;
}(Eventful));
var HoveredResult = (function () {
function HoveredResult(x, y) {
this.x = x;
this.y = y;
}
return HoveredResult;
}());
var handlerNames = [
'click', 'dblclick', 'mousewheel', 'mouseout',
'mouseup', 'mousedown', 'mousemove', 'contextmenu'
];
var tmpRect = new BoundingRect(0, 0, 0, 0);
var Handler = (function (_super) {
__extends(Handler, _super);
function Handler(storage, painter, proxy, painterRoot, pointerSize) {
var _this = _super.call(this) || this;
_this._hovered = new HoveredResult(0, 0);
_this.storage = storage;
_this.painter = painter;
_this.painterRoot = painterRoot;
_this._pointerSize = pointerSize;
proxy = proxy || new EmptyProxy();
_this.proxy = null;
_this.setHandlerProxy(proxy);
_this._draggingMgr = new Draggable(_this);
return _this;
}
Handler.prototype.setHandlerProxy = function (proxy) {
if (this.proxy) {
this.proxy.dispose();
}
if (proxy) {
util.each(handlerNames, function (name) {
proxy.on && proxy.on(name, this[name], this);
}, this);
proxy.handler = this;
}
this.proxy = proxy;
};
Handler.prototype.mousemove = function (event) {
var x = event.zrX;
var y = event.zrY;
var isOutside = isOutsideBoundary(this, x, y);
var lastHovered = this._hovered;
var lastHoveredTarget = lastHovered.target;
if (lastHoveredTarget && !lastHoveredTarget.__zr) {
lastHovered = this.findHover(lastHovered.x, lastHovered.y);
lastHoveredTarget = lastHovered.target;
}
var hovered = this._hovered = isOutside ? new HoveredResult(x, y) : this.findHover(x, y);
var hoveredTarget = hovered.target;
var proxy = this.proxy;
proxy.setCursor && proxy.setCursor(hoveredTarget ? hoveredTarget.cursor : 'default');
if (lastHoveredTarget && hoveredTarget !== lastHoveredTarget) {
this.dispatchToElement(lastHovered, 'mouseout', event);
}
this.dispatchToElement(hovered, 'mousemove', event);
if (hoveredTarget && hoveredTarget !== lastHoveredTarget) {
this.dispatchToElement(hovered, 'mouseover', event);
}
};
Handler.prototype.mouseout = function (event) {
var eventControl = event.zrEventControl;
if (eventControl !== 'only_globalout') {
this.dispatchToElement(this._hovered, 'mouseout', event);
}
if (eventControl !== 'no_globalout') {
this.trigger('globalout', { type: 'globalout', event: event });
}
};
Handler.prototype.resize = function () {
this._hovered = new HoveredResult(0, 0);
};
Handler.prototype.dispatch = function (eventName, eventArgs) {
var handler = this[eventName];
handler && handler.call(this, eventArgs);
};
Handler.prototype.dispose = function () {
this.proxy.dispose();
this.storage = null;
this.proxy = null;
this.painter = null;
};
Handler.prototype.setCursorStyle = function (cursorStyle) {
var proxy = this.proxy;
proxy.setCursor && proxy.setCursor(cursorStyle);
};
Handler.prototype.dispatchToElement = function (targetInfo, eventName, event) {
targetInfo = targetInfo || {};
var el = targetInfo.target;
if (el && el.silent) {
return;
}
var eventKey = ('on' + eventName);
var eventPacket = makeEventPacket(eventName, targetInfo, event);
while (el) {
el[eventKey]
&& (eventPacket.cancelBubble = !!el[eventKey].call(el, eventPacket));
el.trigger(eventName, eventPacket);
el = el.__hostTarget ? el.__hostTarget : el.parent;
if (eventPacket.cancelBubble) {
break;
}
}
if (!eventPacket.cancelBubble) {
this.trigger(eventName, eventPacket);
if (this.painter && this.painter.eachOtherLayer) {
this.painter.eachOtherLayer(function (layer) {
if (typeof (layer[eventKey]) === 'function') {
layer[eventKey].call(layer, eventPacket);
}
if (layer.trigger) {
layer.trigger(eventName, eventPacket);
}
});
}
}
};
Handler.prototype.findHover = function (x, y, exclude) {
var list = this.storage.getDisplayList();
var out = new HoveredResult(x, y);
setHoverTarget(list, out, x, y, exclude);
if (this._pointerSize && !out.target) {
var candidates = [];
var pointerSize = this._pointerSize;
var targetSizeHalf = pointerSize / 2;
var pointerRect = new BoundingRect(x - targetSizeHalf, y - targetSizeHalf, pointerSize, pointerSize);
for (var i = list.length - 1; i >= 0; i--) {
var el = list[i];
if (el !== exclude
&& !el.ignore
&& !el.ignoreCoarsePointer
&& (!el.parent || !el.parent.ignoreCoarsePointer)) {
tmpRect.copy(el.getBoundingRect());
if (el.transform) {
tmpRect.applyTransform(el.transform);
}
if (tmpRect.intersect(pointerRect)) {
candidates.push(el);
}
}
}
if (candidates.length) {
var rStep = 4;
var thetaStep = Math.PI / 12;
var PI2 = Math.PI * 2;
for (var r = 0; r < targetSizeHalf; r += rStep) {
for (var theta = 0; theta < PI2; theta += thetaStep) {
var x1 = x + r * Math.cos(theta);
var y1 = y + r * Math.sin(theta);
setHoverTarget(candidates, out, x1, y1, exclude);
if (out.target) {
return out;
}
}
}
}
}
return out;
};
Handler.prototype.processGesture = function (event, stage) {
if (!this._gestureMgr) {
this._gestureMgr = new GestureMgr();
}
var gestureMgr = this._gestureMgr;
stage === 'start' && gestureMgr.clear();
var gestureInfo = gestureMgr.recognize(event, this.findHover(event.zrX, event.zrY, null).target, this.proxy.dom);
stage === 'end' && gestureMgr.clear();
if (gestureInfo) {
var type = gestureInfo.type;
event.gestureEvent = type;
var res = new HoveredResult();
res.target = gestureInfo.target;
this.dispatchToElement(res, type, gestureInfo.event);
}
};
return Handler;
}(Eventful));
util.each(['click', 'mousedown', 'mouseup', 'mousewheel', 'dblclick', 'contextmenu'], function (name) {
Handler.prototype[name] = function (event) {
var x = event.zrX;
var y = event.zrY;
var isOutside = isOutsideBoundary(this, x, y);
var hovered;
var hoveredTarget;
if (name !== 'mouseup' || !isOutside) {
hovered = this.findHover(x, y);
hoveredTarget = hovered.target;
}
if (name === 'mousedown') {
this._downEl = hoveredTarget;
this._downPoint = [event.zrX, event.zrY];
this._upEl = hoveredTarget;
}
else if (name === 'mouseup') {
this._upEl = hoveredTarget;
}
else if (name === 'click') {
if (this._downEl !== this._upEl
|| !this._downPoint
|| vec2.dist(this._downPoint, [event.zrX, event.zrY]) > 4) {
return;
}
this._downPoint = null;
}
this.dispatchToElement(hovered, name, event);
};
});
function isHover(displayable, x, y) {
if (displayable[displayable.rectHover ? 'rectContain' : 'contain'](x, y)) {
var el = displayable;
var isSilent = void 0;
var ignoreClip = false;
while (el) {
if (el.ignoreClip) {
ignoreClip = true;
}
if (!ignoreClip) {
var clipPath = el.getClipPath();
if (clipPath && !clipPath.contain(x, y)) {
return false;
}
if (el.silent) {
isSilent = true;
}
}
var hostEl = el.__hostTarget;
el = hostEl ? hostEl : el.parent;
}
return isSilent ? SILENT : true;
}
return false;
}
function setHoverTarget(list, out, x, y, exclude) {
for (var i = list.length - 1; i >= 0; i--) {
var el = list[i];
var hoverCheckResult = void 0;
if (el !== exclude
&& !el.ignore
&& (hoverCheckResult = isHover(el, x, y))) {
!out.topTarget && (out.topTarget = el);
if (hoverCheckResult !== SILENT) {
out.target = el;
break;
}
}
}
}
function isOutsideBoundary(handlerInstance, x, y) {
var painter = handlerInstance.painter;
return x < 0 || x > painter.getWidth() || y < 0 || y > painter.getHeight();
}
export default Handler;
File diff suppressed because one or more lines are too long
+235
View File
@@ -0,0 +1,235 @@
var util = require("./core/util");
var _config = require("./config");
var devicePixelRatio = _config.devicePixelRatio;
var Style = require("./graphic/Style");
var Pattern = require("./graphic/Pattern");
/**
* @module zrender/Layer
* @author pissang(https://www.github.com/pissang)
*/
function returnFalse() {
return false;
}
/**
* 创建dom
*
* @inner
* @param {string} id dom id 待用
* @param {Painter} painter painter instance
* @param {number} number
*/
function createDom(id, painter, dpr) {
var newDom = util.createCanvas();
var width = painter.getWidth();
var height = painter.getHeight();
var newDomStyle = newDom.style;
if (newDomStyle) {
// In node or some other non-browser environment
newDomStyle.position = 'absolute';
newDomStyle.left = 0;
newDomStyle.top = 0;
newDomStyle.width = width + 'px';
newDomStyle.height = height + 'px';
newDom.setAttribute('data-zr-dom-id', id);
}
newDom.width = width * dpr;
newDom.height = height * dpr;
return newDom;
}
/**
* @alias module:zrender/Layer
* @constructor
* @extends module:zrender/mixin/Transformable
* @param {string} id
* @param {module:zrender/Painter} painter
* @param {number} [dpr]
*/
var Layer = function (id, painter, dpr) {
var dom;
dpr = dpr || devicePixelRatio;
if (typeof id === 'string') {
dom = createDom(id, painter, dpr);
} // Not using isDom because in node it will return false
else if (util.isObject(id)) {
dom = id;
id = dom.id;
}
this.id = id;
this.dom = dom;
var domStyle = dom.style;
if (domStyle) {
// Not in node
dom.onselectstart = returnFalse; // 避免页面选中的尴尬
domStyle['-webkit-user-select'] = 'none';
domStyle['user-select'] = 'none';
domStyle['-webkit-touch-callout'] = 'none';
domStyle['-webkit-tap-highlight-color'] = 'rgba(0,0,0,0)';
domStyle['padding'] = 0; // eslint-disable-line dot-notation
domStyle['margin'] = 0; // eslint-disable-line dot-notation
domStyle['border-width'] = 0;
}
this.domBack = null;
this.ctxBack = null;
this.painter = painter;
this.config = null; // Configs
/**
* 每次清空画布的颜色
* @type {string}
* @default 0
*/
this.clearColor = 0;
/**
* 是否开启动态模糊
* @type {boolean}
* @default false
*/
this.motionBlur = false;
/**
* 在开启动态模糊的时候使用,与上一帧混合的alpha值,值越大尾迹越明显
* @type {number}
* @default 0.7
*/
this.lastFrameAlpha = 0.7;
/**
* Layer dpr
* @type {number}
*/
this.dpr = dpr;
};
Layer.prototype = {
constructor: Layer,
__dirty: true,
__used: false,
__drawIndex: 0,
__startIndex: 0,
__endIndex: 0,
incremental: false,
getElementCount: function () {
return this.__endIndex - this.__startIndex;
},
initContext: function () {
this.ctx = this.dom.getContext('2d');
this.ctx.dpr = this.dpr;
},
createBackBuffer: function () {
var dpr = this.dpr;
this.domBack = createDom('back-' + this.id, this.painter, dpr);
this.ctxBack = this.domBack.getContext('2d');
if (dpr !== 1) {
this.ctxBack.scale(dpr, dpr);
}
},
/**
* @param {number} width
* @param {number} height
*/
resize: function (width, height) {
var dpr = this.dpr;
var dom = this.dom;
var domStyle = dom.style;
var domBack = this.domBack;
if (domStyle) {
domStyle.width = width + 'px';
domStyle.height = height + 'px';
}
dom.width = width * dpr;
dom.height = height * dpr;
if (domBack) {
domBack.width = width * dpr;
domBack.height = height * dpr;
if (dpr !== 1) {
this.ctxBack.scale(dpr, dpr);
}
}
},
/**
* 清空该层画布
* @param {boolean} [clearAll]=false Clear all with out motion blur
* @param {Color} [clearColor]
*/
clear: function (clearAll, clearColor) {
var dom = this.dom;
var ctx = this.ctx;
var width = dom.width;
var height = dom.height;
var clearColor = clearColor || this.clearColor;
var haveMotionBLur = this.motionBlur && !clearAll;
var lastFrameAlpha = this.lastFrameAlpha;
var dpr = this.dpr;
if (haveMotionBLur) {
if (!this.domBack) {
this.createBackBuffer();
}
this.ctxBack.globalCompositeOperation = 'copy';
this.ctxBack.drawImage(dom, 0, 0, width / dpr, height / dpr);
}
ctx.clearRect(0, 0, width, height);
if (clearColor && clearColor !== 'transparent') {
var clearColorGradientOrPattern; // Gradient
if (clearColor.colorStops) {
// Cache canvas gradient
clearColorGradientOrPattern = clearColor.__canvasGradient || Style.getGradient(ctx, clearColor, {
x: 0,
y: 0,
width: width,
height: height
});
clearColor.__canvasGradient = clearColorGradientOrPattern;
} // Pattern
else if (clearColor.image) {
clearColorGradientOrPattern = Pattern.prototype.getCanvasPattern.call(clearColor, ctx);
}
ctx.save();
ctx.fillStyle = clearColorGradientOrPattern || clearColor;
ctx.fillRect(0, 0, width, height);
ctx.restore();
}
if (haveMotionBLur) {
var domBack = this.domBack;
ctx.save();
ctx.globalAlpha = lastFrameAlpha;
ctx.drawImage(domBack, 0, 0, width, height);
ctx.restore();
}
}
};
var _default = Layer;
module.exports = _default;
+1019
View File
File diff suppressed because it is too large Load Diff
+24
View File
@@ -0,0 +1,24 @@
import { GradientObject } from './graphic/Gradient';
import { PatternObject } from './graphic/Pattern';
import { Dictionary } from './core/types';
export interface PainterBase {
type: string;
root?: HTMLElement;
ssrOnly?: boolean;
resize(width?: number | string, height?: number | string): void;
refresh(): void;
clear(): void;
renderToString?(): string;
getType: () => string;
getWidth(): number;
getHeight(): number;
dispose(): void;
getViewportRoot: () => HTMLElement;
getViewportRootOffset: () => {
offsetLeft: number;
offsetTop: number;
};
refreshHover(): void;
configLayer(zlevel: number, config: Dictionary<any>): void;
setBackgroundColor(backgroundColor: string | GradientObject | PatternObject): void;
}
+1
View File
@@ -0,0 +1 @@
export {};
+1
View File
@@ -0,0 +1 @@
{"version":3,"file":"PainterBase.js","sourceRoot":"","sources":["../src/PainterBase.ts"],"names":[],"mappings":""}
+19
View File
@@ -0,0 +1,19 @@
import Element from './Element';
import Displayable from './graphic/Displayable';
declare function shapeCompareFunc(a: Displayable, b: Displayable): number;
export default class Storage {
private _roots;
private _displayList;
private _displayListLen;
traverse<T>(cb: (this: T, el: Element) => void, context?: T): void;
getDisplayList(update?: boolean, includeIgnore?: boolean): Displayable[];
updateDisplayList(includeIgnore?: boolean): void;
private _updateAndAddDisplayable;
addRoot(el: Element): void;
delRoot(el: Element | Element[]): void;
delAllRoots(): void;
getRoots(): Element<import("./Element").ElementProps>[];
dispose(): void;
displayableSortFunc: typeof shapeCompareFunc;
}
export {};
+158
View File
@@ -0,0 +1,158 @@
import * as util from './core/util.js';
import timsort from './core/timsort.js';
import { REDRAW_BIT } from './graphic/constants.js';
var invalidZErrorLogged = false;
function logInvalidZError() {
if (invalidZErrorLogged) {
return;
}
invalidZErrorLogged = true;
console.warn('z / z2 / zlevel of displayable is invalid, which may cause unexpected errors');
}
function shapeCompareFunc(a, b) {
if (a.zlevel === b.zlevel) {
if (a.z === b.z) {
return a.z2 - b.z2;
}
return a.z - b.z;
}
return a.zlevel - b.zlevel;
}
var Storage = (function () {
function Storage() {
this._roots = [];
this._displayList = [];
this._displayListLen = 0;
this.displayableSortFunc = shapeCompareFunc;
}
Storage.prototype.traverse = function (cb, context) {
for (var i = 0; i < this._roots.length; i++) {
this._roots[i].traverse(cb, context);
}
};
Storage.prototype.getDisplayList = function (update, includeIgnore) {
includeIgnore = includeIgnore || false;
var displayList = this._displayList;
if (update || !displayList.length) {
this.updateDisplayList(includeIgnore);
}
return displayList;
};
Storage.prototype.updateDisplayList = function (includeIgnore) {
this._displayListLen = 0;
var roots = this._roots;
var displayList = this._displayList;
for (var i = 0, len = roots.length; i < len; i++) {
this._updateAndAddDisplayable(roots[i], null, includeIgnore);
}
displayList.length = this._displayListLen;
timsort(displayList, shapeCompareFunc);
};
Storage.prototype._updateAndAddDisplayable = function (el, clipPaths, includeIgnore) {
if (el.ignore && !includeIgnore) {
return;
}
el.beforeUpdate();
el.update();
el.afterUpdate();
var userSetClipPath = el.getClipPath();
if (el.ignoreClip) {
clipPaths = null;
}
else if (userSetClipPath) {
if (clipPaths) {
clipPaths = clipPaths.slice();
}
else {
clipPaths = [];
}
var currentClipPath = userSetClipPath;
var parentClipPath = el;
while (currentClipPath) {
currentClipPath.parent = parentClipPath;
currentClipPath.updateTransform();
clipPaths.push(currentClipPath);
parentClipPath = currentClipPath;
currentClipPath = currentClipPath.getClipPath();
}
}
if (el.childrenRef) {
var children = el.childrenRef();
for (var i = 0; i < children.length; i++) {
var child = children[i];
if (el.__dirty) {
child.__dirty |= REDRAW_BIT;
}
this._updateAndAddDisplayable(child, clipPaths, includeIgnore);
}
el.__dirty = 0;
}
else {
var disp = el;
if (clipPaths && clipPaths.length) {
disp.__clipPaths = clipPaths;
}
else if (disp.__clipPaths && disp.__clipPaths.length > 0) {
disp.__clipPaths = [];
}
if (isNaN(disp.z)) {
logInvalidZError();
disp.z = 0;
}
if (isNaN(disp.z2)) {
logInvalidZError();
disp.z2 = 0;
}
if (isNaN(disp.zlevel)) {
logInvalidZError();
disp.zlevel = 0;
}
this._displayList[this._displayListLen++] = disp;
}
var decalEl = el.getDecalElement && el.getDecalElement();
if (decalEl) {
this._updateAndAddDisplayable(decalEl, clipPaths, includeIgnore);
}
var textGuide = el.getTextGuideLine();
if (textGuide) {
this._updateAndAddDisplayable(textGuide, clipPaths, includeIgnore);
}
var textEl = el.getTextContent();
if (textEl) {
this._updateAndAddDisplayable(textEl, clipPaths, includeIgnore);
}
};
Storage.prototype.addRoot = function (el) {
if (el.__zr && el.__zr.storage === this) {
return;
}
this._roots.push(el);
};
Storage.prototype.delRoot = function (el) {
if (el instanceof Array) {
for (var i = 0, l = el.length; i < l; i++) {
this.delRoot(el[i]);
}
return;
}
var idx = util.indexOf(this._roots, el);
if (idx >= 0) {
this._roots.splice(idx, 1);
}
};
Storage.prototype.delAllRoots = function () {
this._roots = [];
this._displayList = [];
this._displayListLen = 0;
return;
};
Storage.prototype.getRoots = function () {
return this._roots;
};
Storage.prototype.dispose = function () {
this._displayList = null;
this._roots = null;
};
return Storage;
}());
export default Storage;
+1
View File
@@ -0,0 +1 @@
{"version":3,"file":"Storage.js","sourceRoot":"","sources":["../src/Storage.ts"],"names":[],"mappings":"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"}
+2
View File
@@ -0,0 +1,2 @@
export * from './zrender';
export * from './export';
+7
View File
@@ -0,0 +1,7 @@
export * from './zrender.js';
export * from './export.js';
import { registerPainter } from './zrender.js';
import CanvasPainter from './canvas/Painter.js';
import SVGPainter from './svg/Painter.js';
registerPainter('canvas', CanvasPainter);
registerPainter('svg', SVGPainter);
+37
View File
@@ -0,0 +1,37 @@
import Eventful from '../core/Eventful';
import Animator from './Animator';
import Clip from './Clip';
export declare function getTime(): number;
interface Stage {
update?: () => void;
}
interface AnimationOption {
stage?: Stage;
}
export default class Animation extends Eventful {
stage: Stage;
private _head;
private _tail;
private _running;
private _time;
private _pausedTime;
private _pauseStart;
private _paused;
constructor(opts?: AnimationOption);
addClip(clip: Clip): void;
addAnimator(animator: Animator<any>): void;
removeClip(clip: Clip): void;
removeAnimator(animator: Animator<any>): void;
update(notTriggerFrameAndStageUpdate?: boolean): void;
_startLoop(): void;
start(): void;
stop(): void;
pause(): void;
resume(): void;
clear(): void;
isFinished(): boolean;
animate<T>(target: T, options: {
loop?: boolean;
}): Animator<T>;
}
export {};
+147
View File
@@ -0,0 +1,147 @@
import { __extends } from "tslib";
import Eventful from '../core/Eventful.js';
import requestAnimationFrame from './requestAnimationFrame.js';
import Animator from './Animator.js';
export function getTime() {
return new Date().getTime();
}
var Animation = (function (_super) {
__extends(Animation, _super);
function Animation(opts) {
var _this = _super.call(this) || this;
_this._running = false;
_this._time = 0;
_this._pausedTime = 0;
_this._pauseStart = 0;
_this._paused = false;
opts = opts || {};
_this.stage = opts.stage || {};
return _this;
}
Animation.prototype.addClip = function (clip) {
if (clip.animation) {
this.removeClip(clip);
}
if (!this._head) {
this._head = this._tail = clip;
}
else {
this._tail.next = clip;
clip.prev = this._tail;
clip.next = null;
this._tail = clip;
}
clip.animation = this;
};
Animation.prototype.addAnimator = function (animator) {
animator.animation = this;
var clip = animator.getClip();
if (clip) {
this.addClip(clip);
}
};
Animation.prototype.removeClip = function (clip) {
if (!clip.animation) {
return;
}
var prev = clip.prev;
var next = clip.next;
if (prev) {
prev.next = next;
}
else {
this._head = next;
}
if (next) {
next.prev = prev;
}
else {
this._tail = prev;
}
clip.next = clip.prev = clip.animation = null;
};
Animation.prototype.removeAnimator = function (animator) {
var clip = animator.getClip();
if (clip) {
this.removeClip(clip);
}
animator.animation = null;
};
Animation.prototype.update = function (notTriggerFrameAndStageUpdate) {
var time = getTime() - this._pausedTime;
var delta = time - this._time;
var clip = this._head;
while (clip) {
var nextClip = clip.next;
var finished = clip.step(time, delta);
if (finished) {
clip.ondestroy();
this.removeClip(clip);
clip = nextClip;
}
else {
clip = nextClip;
}
}
this._time = time;
if (!notTriggerFrameAndStageUpdate) {
this.trigger('frame', delta);
this.stage.update && this.stage.update();
}
};
Animation.prototype._startLoop = function () {
var self = this;
this._running = true;
function step() {
if (self._running) {
requestAnimationFrame(step);
!self._paused && self.update();
}
}
requestAnimationFrame(step);
};
Animation.prototype.start = function () {
if (this._running) {
return;
}
this._time = getTime();
this._pausedTime = 0;
this._startLoop();
};
Animation.prototype.stop = function () {
this._running = false;
};
Animation.prototype.pause = function () {
if (!this._paused) {
this._pauseStart = getTime();
this._paused = true;
}
};
Animation.prototype.resume = function () {
if (this._paused) {
this._pausedTime += getTime() - this._pauseStart;
this._paused = false;
}
};
Animation.prototype.clear = function () {
var clip = this._head;
while (clip) {
var nextClip = clip.next;
clip.prev = clip.next = clip.animation = null;
clip = nextClip;
}
this._head = this._tail = null;
};
Animation.prototype.isFinished = function () {
return this._head == null;
};
Animation.prototype.animate = function (target, options) {
options = options || {};
this.start();
var animator = new Animator(target, options.loop);
this.addAnimator(animator);
return animator;
};
return Animation;
}(Eventful));
export default Animation;
+1
View File
@@ -0,0 +1 @@
{"version":3,"file":"Animation.js","sourceRoot":"","sources":["../../src/animation/Animation.ts"],"names":[],"mappings":"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"}
+95
View File
@@ -0,0 +1,95 @@
import Clip from './Clip';
import { ArrayLike, Dictionary } from '../core/types';
import { AnimationEasing } from './easing';
import Animation from './Animation';
declare type NumberArray = ArrayLike<number>;
declare type InterpolatableType = string | number | NumberArray | NumberArray[];
export declare function cloneValue(value: InterpolatableType): number | any[];
declare type ValueType = 0 | 1 | 2 | 3 | 4 | 5 | 6;
declare type Keyframe = {
time: number;
value: unknown;
percent: number;
rawValue: unknown;
easing?: AnimationEasing;
easingFunc?: (percent: number) => number;
additiveValue?: unknown;
};
declare class Track {
keyframes: Keyframe[];
propName: string;
valType: ValueType;
discrete: boolean;
_invalid: boolean;
private _finished;
private _needsSort;
private _additiveTrack;
private _additiveValue;
private _lastFr;
private _lastFrP;
constructor(propName: string);
isFinished(): boolean;
setFinished(): void;
needsAnimate(): boolean;
getAdditiveTrack(): Track;
addKeyframe(time: number, rawValue: unknown, easing?: AnimationEasing): Keyframe;
prepare(maxTime: number, additiveTrack?: Track): void;
step(target: any, percent: number): void;
private _addToTarget;
}
declare type DoneCallback = () => void;
declare type AbortCallback = () => void;
export declare type OnframeCallback<T> = (target: T, percent: number) => void;
export declare type AnimationPropGetter<T> = (target: T, key: string) => InterpolatableType;
export declare type AnimationPropSetter<T> = (target: T, key: string, value: InterpolatableType) => void;
export default class Animator<T> {
animation?: Animation;
targetName?: string;
scope?: string;
__fromStateTransition?: string;
private _tracks;
private _trackKeys;
private _target;
private _loop;
private _delay;
private _maxTime;
private _force;
private _paused;
private _started;
private _allowDiscrete;
private _additiveAnimators;
private _doneCbs;
private _onframeCbs;
private _abortedCbs;
private _clip;
constructor(target: T, loop: boolean, allowDiscreteAnimation?: boolean, additiveTo?: Animator<any>[]);
getMaxTime(): number;
getDelay(): number;
getLoop(): boolean;
getTarget(): T;
changeTarget(target: T): void;
when(time: number, props: Dictionary<any>, easing?: AnimationEasing): this;
whenWithKeys(time: number, props: Dictionary<any>, propNames: string[], easing?: AnimationEasing): this;
pause(): void;
resume(): void;
isPaused(): boolean;
duration(duration: number): this;
private _doneCallback;
private _abortedCallback;
private _setTracksFinished;
private _getAdditiveTrack;
start(easing?: AnimationEasing): this;
stop(forwardToLast?: boolean): void;
delay(time: number): this;
during(cb: OnframeCallback<T>): this;
done(cb: DoneCallback): this;
aborted(cb: AbortCallback): this;
getClip(): Clip;
getTrack(propName: string): Track;
getTracks(): Track[];
stopTracks(propNames: string[], forwardToLast?: boolean): boolean;
saveTo(target: T, trackKeys?: readonly string[], firstOrLast?: boolean): void;
__changeFinalValue(finalProps: Dictionary<any>, trackKeys?: readonly string[]): void;
}
export declare type AnimatorTrack = Track;
export {};
+737
View File
@@ -0,0 +1,737 @@
import Clip from './Clip.js';
import * as color from '../tool/color.js';
import { eqNaN, extend, isArrayLike, isFunction, isGradientObject, isNumber, isString, keys, logError, map } from '../core/util.js';
import easingFuncs from './easing.js';
import { createCubicEasingFunc } from './cubicEasing.js';
import { isLinearGradient, isRadialGradient } from '../svg/helper.js';
;
var arraySlice = Array.prototype.slice;
function interpolateNumber(p0, p1, percent) {
return (p1 - p0) * percent + p0;
}
function interpolate1DArray(out, p0, p1, percent) {
var len = p0.length;
for (var i = 0; i < len; i++) {
out[i] = interpolateNumber(p0[i], p1[i], percent);
}
return out;
}
function interpolate2DArray(out, p0, p1, percent) {
var len = p0.length;
var len2 = len && p0[0].length;
for (var i = 0; i < len; i++) {
if (!out[i]) {
out[i] = [];
}
for (var j = 0; j < len2; j++) {
out[i][j] = interpolateNumber(p0[i][j], p1[i][j], percent);
}
}
return out;
}
function add1DArray(out, p0, p1, sign) {
var len = p0.length;
for (var i = 0; i < len; i++) {
out[i] = p0[i] + p1[i] * sign;
}
return out;
}
function add2DArray(out, p0, p1, sign) {
var len = p0.length;
var len2 = len && p0[0].length;
for (var i = 0; i < len; i++) {
if (!out[i]) {
out[i] = [];
}
for (var j = 0; j < len2; j++) {
out[i][j] = p0[i][j] + p1[i][j] * sign;
}
}
return out;
}
function fillColorStops(val0, val1) {
var len0 = val0.length;
var len1 = val1.length;
var shorterArr = len0 > len1 ? val1 : val0;
var shorterLen = Math.min(len0, len1);
var last = shorterArr[shorterLen - 1] || { color: [0, 0, 0, 0], offset: 0 };
for (var i = shorterLen; i < Math.max(len0, len1); i++) {
shorterArr.push({
offset: last.offset,
color: last.color.slice()
});
}
}
function fillArray(val0, val1, arrDim) {
var arr0 = val0;
var arr1 = val1;
if (!arr0.push || !arr1.push) {
return;
}
var arr0Len = arr0.length;
var arr1Len = arr1.length;
if (arr0Len !== arr1Len) {
var isPreviousLarger = arr0Len > arr1Len;
if (isPreviousLarger) {
arr0.length = arr1Len;
}
else {
for (var i = arr0Len; i < arr1Len; i++) {
arr0.push(arrDim === 1 ? arr1[i] : arraySlice.call(arr1[i]));
}
}
}
var len2 = arr0[0] && arr0[0].length;
for (var i = 0; i < arr0.length; i++) {
if (arrDim === 1) {
if (isNaN(arr0[i])) {
arr0[i] = arr1[i];
}
}
else {
for (var j = 0; j < len2; j++) {
if (isNaN(arr0[i][j])) {
arr0[i][j] = arr1[i][j];
}
}
}
}
}
export function cloneValue(value) {
if (isArrayLike(value)) {
var len = value.length;
if (isArrayLike(value[0])) {
var ret = [];
for (var i = 0; i < len; i++) {
ret.push(arraySlice.call(value[i]));
}
return ret;
}
return arraySlice.call(value);
}
return value;
}
function rgba2String(rgba) {
rgba[0] = Math.floor(rgba[0]) || 0;
rgba[1] = Math.floor(rgba[1]) || 0;
rgba[2] = Math.floor(rgba[2]) || 0;
rgba[3] = rgba[3] == null ? 1 : rgba[3];
return 'rgba(' + rgba.join(',') + ')';
}
function guessArrayDim(value) {
return isArrayLike(value && value[0]) ? 2 : 1;
}
var VALUE_TYPE_NUMBER = 0;
var VALUE_TYPE_1D_ARRAY = 1;
var VALUE_TYPE_2D_ARRAY = 2;
var VALUE_TYPE_COLOR = 3;
var VALUE_TYPE_LINEAR_GRADIENT = 4;
var VALUE_TYPE_RADIAL_GRADIENT = 5;
var VALUE_TYPE_UNKOWN = 6;
function isGradientValueType(valType) {
return valType === VALUE_TYPE_LINEAR_GRADIENT || valType === VALUE_TYPE_RADIAL_GRADIENT;
}
function isArrayValueType(valType) {
return valType === VALUE_TYPE_1D_ARRAY || valType === VALUE_TYPE_2D_ARRAY;
}
var tmpRgba = [0, 0, 0, 0];
var Track = (function () {
function Track(propName) {
this.keyframes = [];
this.discrete = false;
this._invalid = false;
this._needsSort = false;
this._lastFr = 0;
this._lastFrP = 0;
this.propName = propName;
}
Track.prototype.isFinished = function () {
return this._finished;
};
Track.prototype.setFinished = function () {
this._finished = true;
if (this._additiveTrack) {
this._additiveTrack.setFinished();
}
};
Track.prototype.needsAnimate = function () {
return this.keyframes.length >= 1;
};
Track.prototype.getAdditiveTrack = function () {
return this._additiveTrack;
};
Track.prototype.addKeyframe = function (time, rawValue, easing) {
this._needsSort = true;
var keyframes = this.keyframes;
var len = keyframes.length;
var discrete = false;
var valType = VALUE_TYPE_UNKOWN;
var value = rawValue;
if (isArrayLike(rawValue)) {
var arrayDim = guessArrayDim(rawValue);
valType = arrayDim;
if (arrayDim === 1 && !isNumber(rawValue[0])
|| arrayDim === 2 && !isNumber(rawValue[0][0])) {
discrete = true;
}
}
else {
if (isNumber(rawValue) && !eqNaN(rawValue)) {
valType = VALUE_TYPE_NUMBER;
}
else if (isString(rawValue)) {
if (!isNaN(+rawValue)) {
valType = VALUE_TYPE_NUMBER;
}
else {
var colorArray = color.parse(rawValue);
if (colorArray) {
value = colorArray;
valType = VALUE_TYPE_COLOR;
}
}
}
else if (isGradientObject(rawValue)) {
var parsedGradient = extend({}, value);
parsedGradient.colorStops = map(rawValue.colorStops, function (colorStop) { return ({
offset: colorStop.offset,
color: color.parse(colorStop.color)
}); });
if (isLinearGradient(rawValue)) {
valType = VALUE_TYPE_LINEAR_GRADIENT;
}
else if (isRadialGradient(rawValue)) {
valType = VALUE_TYPE_RADIAL_GRADIENT;
}
value = parsedGradient;
}
}
if (len === 0) {
this.valType = valType;
}
else if (valType !== this.valType || valType === VALUE_TYPE_UNKOWN) {
discrete = true;
}
this.discrete = this.discrete || discrete;
var kf = {
time: time,
value: value,
rawValue: rawValue,
percent: 0
};
if (easing) {
kf.easing = easing;
kf.easingFunc = isFunction(easing)
? easing
: easingFuncs[easing] || createCubicEasingFunc(easing);
}
keyframes.push(kf);
return kf;
};
Track.prototype.prepare = function (maxTime, additiveTrack) {
var kfs = this.keyframes;
if (this._needsSort) {
kfs.sort(function (a, b) {
return a.time - b.time;
});
}
var valType = this.valType;
var kfsLen = kfs.length;
var lastKf = kfs[kfsLen - 1];
var isDiscrete = this.discrete;
var isArr = isArrayValueType(valType);
var isGradient = isGradientValueType(valType);
for (var i = 0; i < kfsLen; i++) {
var kf = kfs[i];
var value = kf.value;
var lastValue = lastKf.value;
kf.percent = kf.time / maxTime;
if (!isDiscrete) {
if (isArr && i !== kfsLen - 1) {
fillArray(value, lastValue, valType);
}
else if (isGradient) {
fillColorStops(value.colorStops, lastValue.colorStops);
}
}
}
if (!isDiscrete
&& valType !== VALUE_TYPE_RADIAL_GRADIENT
&& additiveTrack
&& this.needsAnimate()
&& additiveTrack.needsAnimate()
&& valType === additiveTrack.valType
&& !additiveTrack._finished) {
this._additiveTrack = additiveTrack;
var startValue = kfs[0].value;
for (var i = 0; i < kfsLen; i++) {
if (valType === VALUE_TYPE_NUMBER) {
kfs[i].additiveValue = kfs[i].value - startValue;
}
else if (valType === VALUE_TYPE_COLOR) {
kfs[i].additiveValue =
add1DArray([], kfs[i].value, startValue, -1);
}
else if (isArrayValueType(valType)) {
kfs[i].additiveValue = valType === VALUE_TYPE_1D_ARRAY
? add1DArray([], kfs[i].value, startValue, -1)
: add2DArray([], kfs[i].value, startValue, -1);
}
}
}
};
Track.prototype.step = function (target, percent) {
if (this._finished) {
return;
}
if (this._additiveTrack && this._additiveTrack._finished) {
this._additiveTrack = null;
}
var isAdditive = this._additiveTrack != null;
var valueKey = isAdditive ? 'additiveValue' : 'value';
var valType = this.valType;
var keyframes = this.keyframes;
var kfsNum = keyframes.length;
var propName = this.propName;
var isValueColor = valType === VALUE_TYPE_COLOR;
var frameIdx;
var lastFrame = this._lastFr;
var mathMin = Math.min;
var frame;
var nextFrame;
if (kfsNum === 1) {
frame = nextFrame = keyframes[0];
}
else {
if (percent < 0) {
frameIdx = 0;
}
else if (percent < this._lastFrP) {
var start = mathMin(lastFrame + 1, kfsNum - 1);
for (frameIdx = start; frameIdx >= 0; frameIdx--) {
if (keyframes[frameIdx].percent <= percent) {
break;
}
}
frameIdx = mathMin(frameIdx, kfsNum - 2);
}
else {
for (frameIdx = lastFrame; frameIdx < kfsNum; frameIdx++) {
if (keyframes[frameIdx].percent > percent) {
break;
}
}
frameIdx = mathMin(frameIdx - 1, kfsNum - 2);
}
nextFrame = keyframes[frameIdx + 1];
frame = keyframes[frameIdx];
}
if (!(frame && nextFrame)) {
return;
}
this._lastFr = frameIdx;
this._lastFrP = percent;
var interval = (nextFrame.percent - frame.percent);
var w = interval === 0 ? 1 : mathMin((percent - frame.percent) / interval, 1);
if (nextFrame.easingFunc) {
w = nextFrame.easingFunc(w);
}
var targetArr = isAdditive ? this._additiveValue
: (isValueColor ? tmpRgba : target[propName]);
if ((isArrayValueType(valType) || isValueColor) && !targetArr) {
targetArr = this._additiveValue = [];
}
if (this.discrete) {
target[propName] = w < 1 ? frame.rawValue : nextFrame.rawValue;
}
else if (isArrayValueType(valType)) {
valType === VALUE_TYPE_1D_ARRAY
? interpolate1DArray(targetArr, frame[valueKey], nextFrame[valueKey], w)
: interpolate2DArray(targetArr, frame[valueKey], nextFrame[valueKey], w);
}
else if (isGradientValueType(valType)) {
var val = frame[valueKey];
var nextVal_1 = nextFrame[valueKey];
var isLinearGradient_1 = valType === VALUE_TYPE_LINEAR_GRADIENT;
target[propName] = {
type: isLinearGradient_1 ? 'linear' : 'radial',
x: interpolateNumber(val.x, nextVal_1.x, w),
y: interpolateNumber(val.y, nextVal_1.y, w),
colorStops: map(val.colorStops, function (colorStop, idx) {
var nextColorStop = nextVal_1.colorStops[idx];
return {
offset: interpolateNumber(colorStop.offset, nextColorStop.offset, w),
color: rgba2String(interpolate1DArray([], colorStop.color, nextColorStop.color, w))
};
}),
global: nextVal_1.global
};
if (isLinearGradient_1) {
target[propName].x2 = interpolateNumber(val.x2, nextVal_1.x2, w);
target[propName].y2 = interpolateNumber(val.y2, nextVal_1.y2, w);
}
else {
target[propName].r = interpolateNumber(val.r, nextVal_1.r, w);
}
}
else if (isValueColor) {
interpolate1DArray(targetArr, frame[valueKey], nextFrame[valueKey], w);
if (!isAdditive) {
target[propName] = rgba2String(targetArr);
}
}
else {
var value = interpolateNumber(frame[valueKey], nextFrame[valueKey], w);
if (isAdditive) {
this._additiveValue = value;
}
else {
target[propName] = value;
}
}
if (isAdditive) {
this._addToTarget(target);
}
};
Track.prototype._addToTarget = function (target) {
var valType = this.valType;
var propName = this.propName;
var additiveValue = this._additiveValue;
if (valType === VALUE_TYPE_NUMBER) {
target[propName] = target[propName] + additiveValue;
}
else if (valType === VALUE_TYPE_COLOR) {
color.parse(target[propName], tmpRgba);
add1DArray(tmpRgba, tmpRgba, additiveValue, 1);
target[propName] = rgba2String(tmpRgba);
}
else if (valType === VALUE_TYPE_1D_ARRAY) {
add1DArray(target[propName], target[propName], additiveValue, 1);
}
else if (valType === VALUE_TYPE_2D_ARRAY) {
add2DArray(target[propName], target[propName], additiveValue, 1);
}
};
return Track;
}());
var Animator = (function () {
function Animator(target, loop, allowDiscreteAnimation, additiveTo) {
this._tracks = {};
this._trackKeys = [];
this._maxTime = 0;
this._started = 0;
this._clip = null;
this._target = target;
this._loop = loop;
if (loop && additiveTo) {
logError('Can\' use additive animation on looped animation.');
return;
}
this._additiveAnimators = additiveTo;
this._allowDiscrete = allowDiscreteAnimation;
}
Animator.prototype.getMaxTime = function () {
return this._maxTime;
};
Animator.prototype.getDelay = function () {
return this._delay;
};
Animator.prototype.getLoop = function () {
return this._loop;
};
Animator.prototype.getTarget = function () {
return this._target;
};
Animator.prototype.changeTarget = function (target) {
this._target = target;
};
Animator.prototype.when = function (time, props, easing) {
return this.whenWithKeys(time, props, keys(props), easing);
};
Animator.prototype.whenWithKeys = function (time, props, propNames, easing) {
var tracks = this._tracks;
for (var i = 0; i < propNames.length; i++) {
var propName = propNames[i];
var track = tracks[propName];
if (!track) {
track = tracks[propName] = new Track(propName);
var initialValue = void 0;
var additiveTrack = this._getAdditiveTrack(propName);
if (additiveTrack) {
var addtiveTrackKfs = additiveTrack.keyframes;
var lastFinalKf = addtiveTrackKfs[addtiveTrackKfs.length - 1];
initialValue = lastFinalKf && lastFinalKf.value;
if (additiveTrack.valType === VALUE_TYPE_COLOR && initialValue) {
initialValue = rgba2String(initialValue);
}
}
else {
initialValue = this._target[propName];
}
if (initialValue == null) {
continue;
}
if (time > 0) {
track.addKeyframe(0, cloneValue(initialValue), easing);
}
this._trackKeys.push(propName);
}
track.addKeyframe(time, cloneValue(props[propName]), easing);
}
this._maxTime = Math.max(this._maxTime, time);
return this;
};
Animator.prototype.pause = function () {
this._clip.pause();
this._paused = true;
};
Animator.prototype.resume = function () {
this._clip.resume();
this._paused = false;
};
Animator.prototype.isPaused = function () {
return !!this._paused;
};
Animator.prototype.duration = function (duration) {
this._maxTime = duration;
this._force = true;
return this;
};
Animator.prototype._doneCallback = function () {
this._setTracksFinished();
this._clip = null;
var doneList = this._doneCbs;
if (doneList) {
var len = doneList.length;
for (var i = 0; i < len; i++) {
doneList[i].call(this);
}
}
};
Animator.prototype._abortedCallback = function () {
this._setTracksFinished();
var animation = this.animation;
var abortedList = this._abortedCbs;
if (animation) {
animation.removeClip(this._clip);
}
this._clip = null;
if (abortedList) {
for (var i = 0; i < abortedList.length; i++) {
abortedList[i].call(this);
}
}
};
Animator.prototype._setTracksFinished = function () {
var tracks = this._tracks;
var tracksKeys = this._trackKeys;
for (var i = 0; i < tracksKeys.length; i++) {
tracks[tracksKeys[i]].setFinished();
}
};
Animator.prototype._getAdditiveTrack = function (trackName) {
var additiveTrack;
var additiveAnimators = this._additiveAnimators;
if (additiveAnimators) {
for (var i = 0; i < additiveAnimators.length; i++) {
var track = additiveAnimators[i].getTrack(trackName);
if (track) {
additiveTrack = track;
}
}
}
return additiveTrack;
};
Animator.prototype.start = function (easing) {
if (this._started > 0) {
return;
}
this._started = 1;
var self = this;
var tracks = [];
var maxTime = this._maxTime || 0;
for (var i = 0; i < this._trackKeys.length; i++) {
var propName = this._trackKeys[i];
var track = this._tracks[propName];
var additiveTrack = this._getAdditiveTrack(propName);
var kfs = track.keyframes;
var kfsNum = kfs.length;
track.prepare(maxTime, additiveTrack);
if (track.needsAnimate()) {
if (!this._allowDiscrete && track.discrete) {
var lastKf = kfs[kfsNum - 1];
if (lastKf) {
self._target[track.propName] = lastKf.rawValue;
}
track.setFinished();
}
else {
tracks.push(track);
}
}
}
if (tracks.length || this._force) {
var clip = new Clip({
life: maxTime,
loop: this._loop,
delay: this._delay || 0,
onframe: function (percent) {
self._started = 2;
var additiveAnimators = self._additiveAnimators;
if (additiveAnimators) {
var stillHasAdditiveAnimator = false;
for (var i = 0; i < additiveAnimators.length; i++) {
if (additiveAnimators[i]._clip) {
stillHasAdditiveAnimator = true;
break;
}
}
if (!stillHasAdditiveAnimator) {
self._additiveAnimators = null;
}
}
for (var i = 0; i < tracks.length; i++) {
tracks[i].step(self._target, percent);
}
var onframeList = self._onframeCbs;
if (onframeList) {
for (var i = 0; i < onframeList.length; i++) {
onframeList[i](self._target, percent);
}
}
},
ondestroy: function () {
self._doneCallback();
}
});
this._clip = clip;
if (this.animation) {
this.animation.addClip(clip);
}
if (easing) {
clip.setEasing(easing);
}
}
else {
this._doneCallback();
}
return this;
};
Animator.prototype.stop = function (forwardToLast) {
if (!this._clip) {
return;
}
var clip = this._clip;
if (forwardToLast) {
clip.onframe(1);
}
this._abortedCallback();
};
Animator.prototype.delay = function (time) {
this._delay = time;
return this;
};
Animator.prototype.during = function (cb) {
if (cb) {
if (!this._onframeCbs) {
this._onframeCbs = [];
}
this._onframeCbs.push(cb);
}
return this;
};
Animator.prototype.done = function (cb) {
if (cb) {
if (!this._doneCbs) {
this._doneCbs = [];
}
this._doneCbs.push(cb);
}
return this;
};
Animator.prototype.aborted = function (cb) {
if (cb) {
if (!this._abortedCbs) {
this._abortedCbs = [];
}
this._abortedCbs.push(cb);
}
return this;
};
Animator.prototype.getClip = function () {
return this._clip;
};
Animator.prototype.getTrack = function (propName) {
return this._tracks[propName];
};
Animator.prototype.getTracks = function () {
var _this = this;
return map(this._trackKeys, function (key) { return _this._tracks[key]; });
};
Animator.prototype.stopTracks = function (propNames, forwardToLast) {
if (!propNames.length || !this._clip) {
return true;
}
var tracks = this._tracks;
var tracksKeys = this._trackKeys;
for (var i = 0; i < propNames.length; i++) {
var track = tracks[propNames[i]];
if (track && !track.isFinished()) {
if (forwardToLast) {
track.step(this._target, 1);
}
else if (this._started === 1) {
track.step(this._target, 0);
}
track.setFinished();
}
}
var allAborted = true;
for (var i = 0; i < tracksKeys.length; i++) {
if (!tracks[tracksKeys[i]].isFinished()) {
allAborted = false;
break;
}
}
if (allAborted) {
this._abortedCallback();
}
return allAborted;
};
Animator.prototype.saveTo = function (target, trackKeys, firstOrLast) {
if (!target) {
return;
}
trackKeys = trackKeys || this._trackKeys;
for (var i = 0; i < trackKeys.length; i++) {
var propName = trackKeys[i];
var track = this._tracks[propName];
if (!track || track.isFinished()) {
continue;
}
var kfs = track.keyframes;
var kf = kfs[firstOrLast ? 0 : kfs.length - 1];
if (kf) {
target[propName] = cloneValue(kf.rawValue);
}
}
};
Animator.prototype.__changeFinalValue = function (finalProps, trackKeys) {
trackKeys = trackKeys || keys(finalProps);
for (var i = 0; i < trackKeys.length; i++) {
var propName = trackKeys[i];
var track = this._tracks[propName];
if (!track) {
continue;
}
var kfs = track.keyframes;
if (kfs.length > 1) {
var lastKf = kfs.pop();
track.addKeyframe(lastKf.time, finalProps[propName]);
track.prepare(this._maxTime, track.getAdditiveTrack());
}
}
};
return Animator;
}());
export default Animator;
File diff suppressed because one or more lines are too long
+38
View File
@@ -0,0 +1,38 @@
import { AnimationEasing } from './easing';
import type Animation from './Animation';
declare type OnframeCallback = (percent: number) => void;
declare type ondestroyCallback = () => void;
declare type onrestartCallback = () => void;
export declare type DeferredEventTypes = 'destroy' | 'restart';
export interface ClipProps {
life?: number;
delay?: number;
loop?: boolean;
easing?: AnimationEasing;
onframe?: OnframeCallback;
ondestroy?: ondestroyCallback;
onrestart?: onrestartCallback;
}
export default class Clip {
private _life;
private _delay;
private _inited;
private _startTime;
private _pausedTime;
private _paused;
animation: Animation;
loop: boolean;
easing: AnimationEasing;
easingFunc: (p: number) => number;
next: Clip;
prev: Clip;
onframe: OnframeCallback;
ondestroy: ondestroyCallback;
onrestart: onrestartCallback;
constructor(opts: ClipProps);
step(globalTime: number, deltaTime: number): boolean;
pause(): void;
resume(): void;
setEasing(easing: AnimationEasing): void;
}
export {};
+64
View File
@@ -0,0 +1,64 @@
import easingFuncs from './easing.js';
import { isFunction, noop } from '../core/util.js';
import { createCubicEasingFunc } from './cubicEasing.js';
var Clip = (function () {
function Clip(opts) {
this._inited = false;
this._startTime = 0;
this._pausedTime = 0;
this._paused = false;
this._life = opts.life || 1000;
this._delay = opts.delay || 0;
this.loop = opts.loop || false;
this.onframe = opts.onframe || noop;
this.ondestroy = opts.ondestroy || noop;
this.onrestart = opts.onrestart || noop;
opts.easing && this.setEasing(opts.easing);
}
Clip.prototype.step = function (globalTime, deltaTime) {
if (!this._inited) {
this._startTime = globalTime + this._delay;
this._inited = true;
}
if (this._paused) {
this._pausedTime += deltaTime;
return;
}
var life = this._life;
var elapsedTime = globalTime - this._startTime - this._pausedTime;
var percent = elapsedTime / life;
if (percent < 0) {
percent = 0;
}
percent = Math.min(percent, 1);
var easingFunc = this.easingFunc;
var schedule = easingFunc ? easingFunc(percent) : percent;
this.onframe(schedule);
if (percent === 1) {
if (this.loop) {
var remainder = elapsedTime % life;
this._startTime = globalTime - remainder;
this._pausedTime = 0;
this.onrestart();
}
else {
return true;
}
}
return false;
};
Clip.prototype.pause = function () {
this._paused = true;
};
Clip.prototype.resume = function () {
this._paused = false;
};
Clip.prototype.setEasing = function (easing) {
this.easing = easing;
this.easingFunc = isFunction(easing)
? easing
: easingFuncs[easing] || createCubicEasingFunc(easing);
};
return Clip;
}());
export default Clip;
+1
View File
@@ -0,0 +1 @@
{"version":3,"file":"Clip.js","sourceRoot":"","sources":["../../src/animation/Clip.ts"],"names":[],"mappings":"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"}
+1
View File
@@ -0,0 +1 @@
export declare function createCubicEasingFunc(cubicEasingStr: string): (p: number) => number;
+23
View File
@@ -0,0 +1,23 @@
import { cubicAt, cubicRootAt } from '../core/curve.js';
import { trim } from '../core/util.js';
var regexp = /cubic-bezier\(([0-9,\.e ]+)\)/;
export function createCubicEasingFunc(cubicEasingStr) {
var cubic = cubicEasingStr && regexp.exec(cubicEasingStr);
if (cubic) {
var points = cubic[1].split(',');
var a_1 = +trim(points[0]);
var b_1 = +trim(points[1]);
var c_1 = +trim(points[2]);
var d_1 = +trim(points[3]);
if (isNaN(a_1 + b_1 + c_1 + d_1)) {
return;
}
var roots_1 = [];
return function (p) {
return p <= 0
? 0 : p >= 1
? 1
: cubicRootAt(0, a_1, c_1, 1, p, roots_1) && cubicAt(0, b_1, d_1, 1, roots_1[0]);
};
}
}
+36
View File
@@ -0,0 +1,36 @@
declare type easingFunc = (percent: number) => number;
export declare type AnimationEasing = keyof typeof easingFuncs | easingFunc;
declare const easingFuncs: {
linear(k: number): number;
quadraticIn(k: number): number;
quadraticOut(k: number): number;
quadraticInOut(k: number): number;
cubicIn(k: number): number;
cubicOut(k: number): number;
cubicInOut(k: number): number;
quarticIn(k: number): number;
quarticOut(k: number): number;
quarticInOut(k: number): number;
quinticIn(k: number): number;
quinticOut(k: number): number;
quinticInOut(k: number): number;
sinusoidalIn(k: number): number;
sinusoidalOut(k: number): number;
sinusoidalInOut(k: number): number;
exponentialIn(k: number): number;
exponentialOut(k: number): number;
exponentialInOut(k: number): number;
circularIn(k: number): number;
circularOut(k: number): number;
circularInOut(k: number): number;
elasticIn(k: number): number;
elasticOut(k: number): number;
elasticInOut(k: number): number;
backIn(k: number): number;
backOut(k: number): number;
backInOut(k: number): number;
bounceIn(k: number): number;
bounceOut(k: number): number;
bounceInOut(k: number): number;
};
export default easingFuncs;
+195
View File
@@ -0,0 +1,195 @@
var easingFuncs = {
linear: function (k) {
return k;
},
quadraticIn: function (k) {
return k * k;
},
quadraticOut: function (k) {
return k * (2 - k);
},
quadraticInOut: function (k) {
if ((k *= 2) < 1) {
return 0.5 * k * k;
}
return -0.5 * (--k * (k - 2) - 1);
},
cubicIn: function (k) {
return k * k * k;
},
cubicOut: function (k) {
return --k * k * k + 1;
},
cubicInOut: function (k) {
if ((k *= 2) < 1) {
return 0.5 * k * k * k;
}
return 0.5 * ((k -= 2) * k * k + 2);
},
quarticIn: function (k) {
return k * k * k * k;
},
quarticOut: function (k) {
return 1 - (--k * k * k * k);
},
quarticInOut: function (k) {
if ((k *= 2) < 1) {
return 0.5 * k * k * k * k;
}
return -0.5 * ((k -= 2) * k * k * k - 2);
},
quinticIn: function (k) {
return k * k * k * k * k;
},
quinticOut: function (k) {
return --k * k * k * k * k + 1;
},
quinticInOut: function (k) {
if ((k *= 2) < 1) {
return 0.5 * k * k * k * k * k;
}
return 0.5 * ((k -= 2) * k * k * k * k + 2);
},
sinusoidalIn: function (k) {
return 1 - Math.cos(k * Math.PI / 2);
},
sinusoidalOut: function (k) {
return Math.sin(k * Math.PI / 2);
},
sinusoidalInOut: function (k) {
return 0.5 * (1 - Math.cos(Math.PI * k));
},
exponentialIn: function (k) {
return k === 0 ? 0 : Math.pow(1024, k - 1);
},
exponentialOut: function (k) {
return k === 1 ? 1 : 1 - Math.pow(2, -10 * k);
},
exponentialInOut: function (k) {
if (k === 0) {
return 0;
}
if (k === 1) {
return 1;
}
if ((k *= 2) < 1) {
return 0.5 * Math.pow(1024, k - 1);
}
return 0.5 * (-Math.pow(2, -10 * (k - 1)) + 2);
},
circularIn: function (k) {
return 1 - Math.sqrt(1 - k * k);
},
circularOut: function (k) {
return Math.sqrt(1 - (--k * k));
},
circularInOut: function (k) {
if ((k *= 2) < 1) {
return -0.5 * (Math.sqrt(1 - k * k) - 1);
}
return 0.5 * (Math.sqrt(1 - (k -= 2) * k) + 1);
},
elasticIn: function (k) {
var s;
var a = 0.1;
var p = 0.4;
if (k === 0) {
return 0;
}
if (k === 1) {
return 1;
}
if (!a || a < 1) {
a = 1;
s = p / 4;
}
else {
s = p * Math.asin(1 / a) / (2 * Math.PI);
}
return -(a * Math.pow(2, 10 * (k -= 1))
* Math.sin((k - s) * (2 * Math.PI) / p));
},
elasticOut: function (k) {
var s;
var a = 0.1;
var p = 0.4;
if (k === 0) {
return 0;
}
if (k === 1) {
return 1;
}
if (!a || a < 1) {
a = 1;
s = p / 4;
}
else {
s = p * Math.asin(1 / a) / (2 * Math.PI);
}
return (a * Math.pow(2, -10 * k)
* Math.sin((k - s) * (2 * Math.PI) / p) + 1);
},
elasticInOut: function (k) {
var s;
var a = 0.1;
var p = 0.4;
if (k === 0) {
return 0;
}
if (k === 1) {
return 1;
}
if (!a || a < 1) {
a = 1;
s = p / 4;
}
else {
s = p * Math.asin(1 / a) / (2 * Math.PI);
}
if ((k *= 2) < 1) {
return -0.5 * (a * Math.pow(2, 10 * (k -= 1))
* Math.sin((k - s) * (2 * Math.PI) / p));
}
return a * Math.pow(2, -10 * (k -= 1))
* Math.sin((k - s) * (2 * Math.PI) / p) * 0.5 + 1;
},
backIn: function (k) {
var s = 1.70158;
return k * k * ((s + 1) * k - s);
},
backOut: function (k) {
var s = 1.70158;
return --k * k * ((s + 1) * k + s) + 1;
},
backInOut: function (k) {
var s = 1.70158 * 1.525;
if ((k *= 2) < 1) {
return 0.5 * (k * k * ((s + 1) * k - s));
}
return 0.5 * ((k -= 2) * k * ((s + 1) * k + s) + 2);
},
bounceIn: function (k) {
return 1 - easingFuncs.bounceOut(1 - k);
},
bounceOut: function (k) {
if (k < (1 / 2.75)) {
return 7.5625 * k * k;
}
else if (k < (2 / 2.75)) {
return 7.5625 * (k -= (1.5 / 2.75)) * k + 0.75;
}
else if (k < (2.5 / 2.75)) {
return 7.5625 * (k -= (2.25 / 2.75)) * k + 0.9375;
}
else {
return 7.5625 * (k -= (2.625 / 2.75)) * k + 0.984375;
}
},
bounceInOut: function (k) {
if (k < 0.5) {
return easingFuncs.bounceIn(k * 2) * 0.5;
}
return easingFuncs.bounceOut(k * 2 - 1) * 0.5 + 0.5;
}
};
export default easingFuncs;
File diff suppressed because one or more lines are too long
@@ -0,0 +1,3 @@
declare type RequestAnimationFrameType = typeof window.requestAnimationFrame;
declare let requestAnimationFrame: RequestAnimationFrameType;
export default requestAnimationFrame;
+10
View File
@@ -0,0 +1,10 @@
import env from '../core/env.js';
var requestAnimationFrame;
requestAnimationFrame = (env.hasGlobalWindow
&& ((window.requestAnimationFrame && window.requestAnimationFrame.bind(window))
|| (window.msRequestAnimationFrame && window.msRequestAnimationFrame.bind(window))
|| window.mozRequestAnimationFrame
|| window.webkitRequestAnimationFrame)) || function (func) {
return setTimeout(func, 16);
};
export default requestAnimationFrame;
@@ -0,0 +1 @@
{"version":3,"file":"requestAnimationFrame.js","sourceRoot":"","sources":["../../src/animation/requestAnimationFrame.ts"],"names":[],"mappings":";;AAEA,IAAI,qBAAgD,CAAC;AAErD,IAAI,OAAO,MAAM,KAAK,WAAW,EAAE;IAC/B,qBAAqB,GAAG,CAAC,MAAM,CAAC,qBAAqB,IAAI,MAAM,CAAC,qBAAqB,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;WAE5F,CAAE,MAAc,CAAC,uBAAuB,IAAK,MAAc,CAAC,uBAAuB,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;WAChG,MAAc,CAAC,wBAAwB;WACxC,MAAM,CAAC,2BAA2B,CAAC;CAC7C;KACI;IACD,qBAAqB,GAAG,UAAU,IAA8C;QAC5E,OAAO,UAAU,CAAC,IAAI,EAAE,EAAE,CAAQ,CAAC;IACvC,CAAC,CAAC;CACL;AAED,qBAAe,qBAAqB,CAAC"}
+436
View File
@@ -0,0 +1,436 @@
var Clip = require("./Clip");
var _util = require("../core/util");
var isArrayLike = _util.isArrayLike;
var color = require("../tool/color");
var arraySlice = Array.prototype.slice;
/**
* @param {Object} target
* @param {string} propName
* @param {Array.<Object>} keyframes
* [{
* time: number,
* value: number | color string | Array.<number> | Array.<Array.<number>>
* }, ...]
* [Caveat]:
* (1) The order should ensured by time.
* (2) If `value` is `Array`, it must not be shared outside (espaciall el.shape, el.style),
* in case that it be modified outside and cause incorrect interpolate result.
* @param {string} easing
* @param {boolean} [delay=false]
* @param {boolean} [loop=false]
* @param {boolean} [forceAnimate=false]
* @param {Function} [getter=defaultGetter]
* @param {Function} [setter=defaultSetter]
* @return {module:zrender/animation/Clip} clip
*/
function createTrackClip(target, propName, keyframes, easing, delay, loop, forceAnimate, getter, setter) {
var useSpline = easing === 'spline';
getter = getter || defaultGetter;
setter = setter || defaultSetter;
var trackLen = keyframes.length;
if (!trackLen) {
return;
} // Guess data type
var firstVal = keyframes[0].value;
var isValueArray = isArrayLike(firstVal);
var isValueColor = false;
var isValueString = false; // For vertices morphing
var arrDim = isValueArray ? getArrayDim(keyframes) : 0;
var trackMaxTime;
trackMaxTime = keyframes[trackLen - 1].time; // Percents of each keyframe
var kfPercents = []; // Value of each keyframe
var kfValues = [];
var prevValue = keyframes[0].value;
var isAllValueEqual = true;
for (var i = 0; i < trackLen; i++) {
kfPercents.push(keyframes[i].time / trackMaxTime); // Assume value is a color when it is a string
var value = keyframes[i].value; // Check if value is equal, deep check if value is array
if (!(isValueArray && isArraySame(value, prevValue, arrDim) || !isValueArray && value === prevValue)) {
isAllValueEqual = false;
}
prevValue = value; // Try converting a string to a color array
if (typeof value === 'string') {
var colorArray = color.parse(value);
if (colorArray) {
value = colorArray;
isValueColor = true;
} else {
isValueString = true;
}
}
kfValues.push(value);
}
if (!forceAnimate && isAllValueEqual) {
return;
}
var lastValue = kfValues[trackLen - 1]; // Polyfill array and NaN value
for (var i = 0; i < trackLen - 1; i++) {
if (isValueArray) {
fillArr(kfValues[i], lastValue, arrDim);
} else {
if (isNaN(kfValues[i]) && !isNaN(lastValue) && !isValueString && !isValueColor) {
kfValues[i] = lastValue;
}
}
}
isValueArray && fillArr(getter(target, propName), lastValue, arrDim); // Cache the key of last frame to speed up when
// animation playback is sequency
var lastFrame = 0;
var lastFramePercent = 0;
var start;
var w;
var p0;
var p1;
var p2;
var p3;
if (isValueColor) {
var rgba = [0, 0, 0, 0];
}
function hanleFrame(target, percent) {
// Find the range keyframes
// kf1-----kf2---------current--------kf3
// find kf2 and kf3 and do interpolation
var frame; // In the easing function like elasticOut, percent may less than 0
if (percent < 0) {
frame = 0;
} else if (percent < lastFramePercent) {
// Start from next key
// PENDING start from lastFrame ?
start = Math.min(lastFrame + 1, trackLen - 1);
for (frame = start; frame >= 0; frame--) {
if (kfPercents[frame] <= percent) {
break;
}
} // PENDING really need to do this ?
frame = Math.min(frame, trackLen - 2);
} else {
for (frame = lastFrame; frame < trackLen; frame++) {
if (kfPercents[frame] > percent) {
break;
}
}
frame = Math.min(frame - 1, trackLen - 2);
}
lastFrame = frame;
lastFramePercent = percent;
var range = kfPercents[frame + 1] - kfPercents[frame];
if (range === 0) {
return;
} else {
w = (percent - kfPercents[frame]) / range;
}
if (useSpline) {
p1 = kfValues[frame];
p0 = kfValues[frame === 0 ? frame : frame - 1];
p2 = kfValues[frame > trackLen - 2 ? trackLen - 1 : frame + 1];
p3 = kfValues[frame > trackLen - 3 ? trackLen - 1 : frame + 2];
if (isValueArray) {
catmullRomInterpolateArray(p0, p1, p2, p3, w, w * w, w * w * w, getter(target, propName), arrDim);
} else {
var value;
if (isValueColor) {
value = catmullRomInterpolateArray(p0, p1, p2, p3, w, w * w, w * w * w, rgba, 1);
value = rgba2String(rgba);
} else if (isValueString) {
// String is step(0.5)
return interpolateString(p1, p2, w);
} else {
value = catmullRomInterpolate(p0, p1, p2, p3, w, w * w, w * w * w);
}
setter(target, propName, value);
}
} else {
if (isValueArray) {
interpolateArray(kfValues[frame], kfValues[frame + 1], w, getter(target, propName), arrDim);
} else {
var value;
if (isValueColor) {
interpolateArray(kfValues[frame], kfValues[frame + 1], w, rgba, 1);
value = rgba2String(rgba);
} else if (isValueString) {
// String is step(0.5)
return interpolateString(kfValues[frame], kfValues[frame + 1], w);
} else {
value = interpolateNumber(kfValues[frame], kfValues[frame + 1], w);
}
if (target.aaaa != null) {
console.log(target.uuid, value, propName);
}
setter(target, propName, value);
}
}
}
var clip = new Clip({
target: target,
life: trackMaxTime,
loop: loop,
delay: delay,
onframe: hanleFrame
});
if (easing && easing !== 'spline') {
clip.easing = easing;
}
return clip;
}
function getArrayDim(keyframes) {
var lastValue = keyframes[keyframes.length - 1].value;
return isArrayLike(lastValue && lastValue[0]) ? 2 : 1;
}
/**
* @param {Array} arr0
* @param {Array} arr1
* @param {number} arrDim
* @return {boolean}
*/
function isArraySame(arr0, arr1, arrDim) {
if (arr0 === arr1) {
return true;
}
var len = arr0.length;
if (len !== arr1.length) {
return false;
}
if (arrDim === 1) {
for (var i = 0; i < len; i++) {
if (arr0[i] !== arr1[i]) {
return false;
}
}
} else {
var len2 = arr0[0].length;
for (var i = 0; i < len; i++) {
for (var j = 0; j < len2; j++) {
if (arr0[i][j] !== arr1[i][j]) {
return false;
}
}
}
}
return true;
} // arr0 is source array, arr1 is target array.
// Do some preprocess to avoid error happened when interpolating from arr0 to arr1
function fillArr(arr0, arr1, arrDim) {
var arr0Len = arr0.length;
var arr1Len = arr1.length;
if (arr0Len !== arr1Len) {
// FIXME Not work for TypedArray
var isPreviousLarger = arr0Len > arr1Len;
if (isPreviousLarger) {
// Cut the previous
arr0.length = arr1Len;
} else {
// Fill the previous
for (var i = arr0Len; i < arr1Len; i++) {
arr0.push(arrDim === 1 ? arr1[i] : arraySlice.call(arr1[i]));
}
}
} // Handling NaN value
var len2 = arr0[0] && arr0[0].length;
for (var i = 0; i < arr0.length; i++) {
if (arrDim === 1) {
if (isNaN(arr0[i])) {
arr0[i] = arr1[i];
}
} else {
for (var j = 0; j < len2; j++) {
if (isNaN(arr0[i][j])) {
arr0[i][j] = arr1[i][j];
}
}
}
}
}
/**
* Catmull Rom interpolate array
* @param {Array} p0
* @param {Array} p1
* @param {Array} p2
* @param {Array} p3
* @param {number} t
* @param {number} t2
* @param {number} t3
* @param {Array} out
* @param {number} arrDim
*/
function catmullRomInterpolateArray(p0, p1, p2, p3, t, t2, t3, out, arrDim) {
var len = p0.length;
if (arrDim === 1) {
for (var i = 0; i < len; i++) {
out[i] = catmullRomInterpolate(p0[i], p1[i], p2[i], p3[i], t, t2, t3);
}
} else {
var len2 = p0[0].length;
for (var i = 0; i < len; i++) {
for (var j = 0; j < len2; j++) {
out[i][j] = catmullRomInterpolate(p0[i][j], p1[i][j], p2[i][j], p3[i][j], t, t2, t3);
}
}
}
}
/**
* Catmull Rom interpolate number
* @param {number} p0
* @param {number} p1
* @param {number} p2
* @param {number} p3
* @param {number} t
* @param {number} t2
* @param {number} t3
* @return {number}
*/
function catmullRomInterpolate(p0, p1, p2, p3, t, t2, t3) {
var v0 = (p2 - p0) * 0.5;
var v1 = (p3 - p1) * 0.5;
return (2 * (p1 - p2) + v0 + v1) * t3 + (-3 * (p1 - p2) - 2 * v0 - v1) * t2 + v0 * t + p1;
}
/**
* @param {number} p0
* @param {number} p1
* @param {number} percent
* @return {number}
*/
function interpolateNumber(p0, p1, percent) {
return (p1 - p0) * percent + p0;
}
/**
* @param {string} p0
* @param {string} p1
* @param {number} percent
* @return {string}
*/
function interpolateString(p0, p1, percent) {
return percent > 0.5 ? p1 : p0;
}
/**
* @param {Array} p0
* @param {Array} p1
* @param {number} percent
* @param {Array} out
* @param {number} arrDim
*/
function interpolateArray(p0, p1, percent, out, arrDim) {
var len = p0.length;
if (arrDim === 1) {
for (var i = 0; i < len; i++) {
out[i] = interpolateNumber(p0[i], p1[i], percent);
}
} else {
var len2 = len && p0[0].length;
for (var i = 0; i < len; i++) {
for (var j = 0; j < len2; j++) {
out[i][j] = interpolateNumber(p0[i][j], p1[i][j], percent);
}
}
}
}
function rgba2String(rgba) {
rgba[0] = Math.floor(rgba[0]);
rgba[1] = Math.floor(rgba[1]);
rgba[2] = Math.floor(rgba[2]);
return 'rgba(' + rgba.join(',') + ')';
}
function cloneFrameValue(value) {
if (isArrayLike(value)) {
var len = value.length;
if (isArrayLike(value[0])) {
var ret = [];
for (var i = 0; i < len; i++) {
ret.push(arraySlice.call(value[i]));
}
return ret;
}
return arraySlice.call(value);
}
return value;
}
function defaultGetter(target, key) {
return target[key];
}
function defaultSetter(target, key, value) {
target[key] = value;
}
exports.createTrackClip = createTrackClip;
exports.cloneFrameValue = cloneFrameValue;
exports.defaultGetter = defaultGetter;
exports.defaultSetter = defaultSetter;
+68
View File
@@ -0,0 +1,68 @@
import { ImagePatternObject } from '../graphic/Pattern';
import CanvasPainter from './Painter';
import { GradientObject } from '../graphic/Gradient';
import Eventful from '../core/Eventful';
import { ElementEventCallback } from '../Element';
import Displayable from '../graphic/Displayable';
import BoundingRect from '../core/BoundingRect';
export interface LayerConfig {
clearColor?: string | GradientObject | ImagePatternObject;
motionBlur?: boolean;
lastFrameAlpha?: number;
}
export default class Layer extends Eventful {
id: string;
dom: HTMLCanvasElement;
domBack: HTMLCanvasElement;
ctx: CanvasRenderingContext2D;
ctxBack: CanvasRenderingContext2D;
painter: CanvasPainter;
clearColor: string | GradientObject | ImagePatternObject;
motionBlur: boolean;
lastFrameAlpha: number;
dpr: number;
virtual: boolean;
config: {};
incremental: boolean;
zlevel: number;
maxRepaintRectCount: number;
private _paintRects;
__painter: CanvasPainter;
__dirty: boolean;
__firstTimePaint: boolean;
__used: boolean;
__drawIndex: number;
__startIndex: number;
__endIndex: number;
__prevStartIndex: number;
__prevEndIndex: number;
__builtin__: boolean;
constructor(id: string | HTMLCanvasElement, painter: CanvasPainter, dpr?: number);
getElementCount(): number;
afterBrush(): void;
initContext(): void;
setUnpainted(): void;
createBackBuffer(): void;
createRepaintRects(displayList: Displayable[], prevList: Displayable[], viewWidth: number, viewHeight: number): BoundingRect[];
debugGetPaintRects(): BoundingRect[];
resize(width: number, height: number): void;
clear(clearAll?: boolean, clearColor?: string | GradientObject | ImagePatternObject, repaintRects?: BoundingRect[]): void;
refresh: (clearColor?: string | GradientObject | ImagePatternObject) => void;
renderToCanvas: (ctx: CanvasRenderingContext2D) => void;
onclick: ElementEventCallback<unknown, this>;
ondblclick: ElementEventCallback<unknown, this>;
onmouseover: ElementEventCallback<unknown, this>;
onmouseout: ElementEventCallback<unknown, this>;
onmousemove: ElementEventCallback<unknown, this>;
onmousewheel: ElementEventCallback<unknown, this>;
onmousedown: ElementEventCallback<unknown, this>;
onmouseup: ElementEventCallback<unknown, this>;
oncontextmenu: ElementEventCallback<unknown, this>;
ondrag: ElementEventCallback<unknown, this>;
ondragstart: ElementEventCallback<unknown, this>;
ondragend: ElementEventCallback<unknown, this>;
ondragenter: ElementEventCallback<unknown, this>;
ondragleave: ElementEventCallback<unknown, this>;
ondragover: ElementEventCallback<unknown, this>;
ondrop: ElementEventCallback<unknown, this>;
}
+292
View File
@@ -0,0 +1,292 @@
import { __extends } from "tslib";
import * as util from '../core/util.js';
import { devicePixelRatio } from '../config.js';
import Eventful from '../core/Eventful.js';
import { getCanvasGradient } from './helper.js';
import { createCanvasPattern } from './graphic.js';
import BoundingRect from '../core/BoundingRect.js';
import { REDRAW_BIT } from '../graphic/constants.js';
import { platformApi } from '../core/platform.js';
function createDom(id, painter, dpr) {
var newDom = platformApi.createCanvas();
var width = painter.getWidth();
var height = painter.getHeight();
var newDomStyle = newDom.style;
if (newDomStyle) {
newDomStyle.position = 'absolute';
newDomStyle.left = '0';
newDomStyle.top = '0';
newDomStyle.width = width + 'px';
newDomStyle.height = height + 'px';
newDom.setAttribute('data-zr-dom-id', id);
}
newDom.width = width * dpr;
newDom.height = height * dpr;
return newDom;
}
;
var Layer = (function (_super) {
__extends(Layer, _super);
function Layer(id, painter, dpr) {
var _this = _super.call(this) || this;
_this.motionBlur = false;
_this.lastFrameAlpha = 0.7;
_this.dpr = 1;
_this.virtual = false;
_this.config = {};
_this.incremental = false;
_this.zlevel = 0;
_this.maxRepaintRectCount = 5;
_this.__dirty = true;
_this.__firstTimePaint = true;
_this.__used = false;
_this.__drawIndex = 0;
_this.__startIndex = 0;
_this.__endIndex = 0;
_this.__prevStartIndex = null;
_this.__prevEndIndex = null;
var dom;
dpr = dpr || devicePixelRatio;
if (typeof id === 'string') {
dom = createDom(id, painter, dpr);
}
else if (util.isObject(id)) {
dom = id;
id = dom.id;
}
_this.id = id;
_this.dom = dom;
var domStyle = dom.style;
if (domStyle) {
util.disableUserSelect(dom);
dom.onselectstart = function () { return false; };
domStyle.padding = '0';
domStyle.margin = '0';
domStyle.borderWidth = '0';
}
_this.painter = painter;
_this.dpr = dpr;
return _this;
}
Layer.prototype.getElementCount = function () {
return this.__endIndex - this.__startIndex;
};
Layer.prototype.afterBrush = function () {
this.__prevStartIndex = this.__startIndex;
this.__prevEndIndex = this.__endIndex;
};
Layer.prototype.initContext = function () {
this.ctx = this.dom.getContext('2d');
this.ctx.dpr = this.dpr;
};
Layer.prototype.setUnpainted = function () {
this.__firstTimePaint = true;
};
Layer.prototype.createBackBuffer = function () {
var dpr = this.dpr;
this.domBack = createDom('back-' + this.id, this.painter, dpr);
this.ctxBack = this.domBack.getContext('2d');
if (dpr !== 1) {
this.ctxBack.scale(dpr, dpr);
}
};
Layer.prototype.createRepaintRects = function (displayList, prevList, viewWidth, viewHeight) {
if (this.__firstTimePaint) {
this.__firstTimePaint = false;
return null;
}
var mergedRepaintRects = [];
var maxRepaintRectCount = this.maxRepaintRectCount;
var full = false;
var pendingRect = new BoundingRect(0, 0, 0, 0);
function addRectToMergePool(rect) {
if (!rect.isFinite() || rect.isZero()) {
return;
}
if (mergedRepaintRects.length === 0) {
var boundingRect = new BoundingRect(0, 0, 0, 0);
boundingRect.copy(rect);
mergedRepaintRects.push(boundingRect);
}
else {
var isMerged = false;
var minDeltaArea = Infinity;
var bestRectToMergeIdx = 0;
for (var i = 0; i < mergedRepaintRects.length; ++i) {
var mergedRect = mergedRepaintRects[i];
if (mergedRect.intersect(rect)) {
var pendingRect_1 = new BoundingRect(0, 0, 0, 0);
pendingRect_1.copy(mergedRect);
pendingRect_1.union(rect);
mergedRepaintRects[i] = pendingRect_1;
isMerged = true;
break;
}
else if (full) {
pendingRect.copy(rect);
pendingRect.union(mergedRect);
var aArea = rect.width * rect.height;
var bArea = mergedRect.width * mergedRect.height;
var pendingArea = pendingRect.width * pendingRect.height;
var deltaArea = pendingArea - aArea - bArea;
if (deltaArea < minDeltaArea) {
minDeltaArea = deltaArea;
bestRectToMergeIdx = i;
}
}
}
if (full) {
mergedRepaintRects[bestRectToMergeIdx].union(rect);
isMerged = true;
}
if (!isMerged) {
var boundingRect = new BoundingRect(0, 0, 0, 0);
boundingRect.copy(rect);
mergedRepaintRects.push(boundingRect);
}
if (!full) {
full = mergedRepaintRects.length >= maxRepaintRectCount;
}
}
}
for (var i = this.__startIndex; i < this.__endIndex; ++i) {
var el = displayList[i];
if (el) {
var shouldPaint = el.shouldBePainted(viewWidth, viewHeight, true, true);
var prevRect = el.__isRendered && ((el.__dirty & REDRAW_BIT) || !shouldPaint)
? el.getPrevPaintRect()
: null;
if (prevRect) {
addRectToMergePool(prevRect);
}
var curRect = shouldPaint && ((el.__dirty & REDRAW_BIT) || !el.__isRendered)
? el.getPaintRect()
: null;
if (curRect) {
addRectToMergePool(curRect);
}
}
}
for (var i = this.__prevStartIndex; i < this.__prevEndIndex; ++i) {
var el = prevList[i];
var shouldPaint = el.shouldBePainted(viewWidth, viewHeight, true, true);
if (el && (!shouldPaint || !el.__zr) && el.__isRendered) {
var prevRect = el.getPrevPaintRect();
if (prevRect) {
addRectToMergePool(prevRect);
}
}
}
var hasIntersections;
do {
hasIntersections = false;
for (var i = 0; i < mergedRepaintRects.length;) {
if (mergedRepaintRects[i].isZero()) {
mergedRepaintRects.splice(i, 1);
continue;
}
for (var j = i + 1; j < mergedRepaintRects.length;) {
if (mergedRepaintRects[i].intersect(mergedRepaintRects[j])) {
hasIntersections = true;
mergedRepaintRects[i].union(mergedRepaintRects[j]);
mergedRepaintRects.splice(j, 1);
}
else {
j++;
}
}
i++;
}
} while (hasIntersections);
this._paintRects = mergedRepaintRects;
return mergedRepaintRects;
};
Layer.prototype.debugGetPaintRects = function () {
return (this._paintRects || []).slice();
};
Layer.prototype.resize = function (width, height) {
var dpr = this.dpr;
var dom = this.dom;
var domStyle = dom.style;
var domBack = this.domBack;
if (domStyle) {
domStyle.width = width + 'px';
domStyle.height = height + 'px';
}
dom.width = width * dpr;
dom.height = height * dpr;
if (domBack) {
domBack.width = width * dpr;
domBack.height = height * dpr;
if (dpr !== 1) {
this.ctxBack.scale(dpr, dpr);
}
}
};
Layer.prototype.clear = function (clearAll, clearColor, repaintRects) {
var dom = this.dom;
var ctx = this.ctx;
var width = dom.width;
var height = dom.height;
clearColor = clearColor || this.clearColor;
var haveMotionBLur = this.motionBlur && !clearAll;
var lastFrameAlpha = this.lastFrameAlpha;
var dpr = this.dpr;
var self = this;
if (haveMotionBLur) {
if (!this.domBack) {
this.createBackBuffer();
}
this.ctxBack.globalCompositeOperation = 'copy';
this.ctxBack.drawImage(dom, 0, 0, width / dpr, height / dpr);
}
var domBack = this.domBack;
function doClear(x, y, width, height) {
ctx.clearRect(x, y, width, height);
if (clearColor && clearColor !== 'transparent') {
var clearColorGradientOrPattern = void 0;
if (util.isGradientObject(clearColor)) {
clearColorGradientOrPattern = clearColor.__canvasGradient
|| getCanvasGradient(ctx, clearColor, {
x: 0,
y: 0,
width: width,
height: height
});
clearColor.__canvasGradient = clearColorGradientOrPattern;
}
else if (util.isImagePatternObject(clearColor)) {
clearColor.scaleX = clearColor.scaleX || dpr;
clearColor.scaleY = clearColor.scaleY || dpr;
clearColorGradientOrPattern = createCanvasPattern(ctx, clearColor, {
dirty: function () {
self.setUnpainted();
self.__painter.refresh();
}
});
}
ctx.save();
ctx.fillStyle = clearColorGradientOrPattern || clearColor;
ctx.fillRect(x, y, width, height);
ctx.restore();
}
if (haveMotionBLur) {
ctx.save();
ctx.globalAlpha = lastFrameAlpha;
ctx.drawImage(domBack, x, y, width, height);
ctx.restore();
}
}
;
if (!repaintRects || haveMotionBLur) {
doClear(0, 0, width, height);
}
else if (repaintRects.length) {
util.each(repaintRects, function (rect) {
doClear(rect.x * dpr, rect.y * dpr, rect.width * dpr, rect.height * dpr);
});
}
};
return Layer;
}(Eventful));
export default Layer;
File diff suppressed because one or more lines are too long
+72
View File
@@ -0,0 +1,72 @@
import Layer, { LayerConfig } from './Layer';
import Displayable from '../graphic/Displayable';
import { GradientObject } from '../graphic/Gradient';
import { ImagePatternObject } from '../graphic/Pattern';
import Storage from '../Storage';
import { PainterBase } from '../PainterBase';
interface CanvasPainterOption {
devicePixelRatio?: number;
width?: number | string;
height?: number | string;
useDirtyRect?: boolean;
}
export default class CanvasPainter implements PainterBase {
type: string;
root: HTMLElement;
dpr: number;
storage: Storage;
private _singleCanvas;
private _opts;
private _zlevelList;
private _prevDisplayList;
private _layers;
private _layerConfig;
private _needsManuallyCompositing;
private _width;
private _height;
private _domRoot;
private _hoverlayer;
private _redrawId;
private _backgroundColor;
constructor(root: HTMLElement, storage: Storage, opts: CanvasPainterOption, id: number);
getType(): string;
isSingleCanvas(): boolean;
getViewportRoot(): HTMLElement;
getViewportRootOffset(): {
offsetLeft: number;
offsetTop: number;
};
refresh(paintAll?: boolean): this;
refreshHover(): void;
private _paintHoverList;
getHoverLayer(): Layer;
paintOne(ctx: CanvasRenderingContext2D, el: Displayable): void;
private _paintList;
private _compositeManually;
private _doPaintList;
private _doPaintEl;
getLayer(zlevel: number, virtual?: boolean): Layer;
insertLayer(zlevel: number, layer: Layer): void;
eachLayer<T>(cb: (this: T, layer: Layer, z: number) => void, context?: T): void;
eachBuiltinLayer<T>(cb: (this: T, layer: Layer, z: number) => void, context?: T): void;
eachOtherLayer<T>(cb: (this: T, layer: Layer, z: number) => void, context?: T): void;
getLayers(): {
[key: number]: Layer;
};
_updateLayerStatus(list: Displayable[]): void;
clear(): this;
_clearLayer(layer: Layer): void;
setBackgroundColor(backgroundColor: string | GradientObject | ImagePatternObject): void;
configLayer(zlevel: number, config: LayerConfig): void;
delLayer(zlevel: number): void;
resize(width?: number | string, height?: number | string): this;
clearLayer(zlevel: number): void;
dispose(): void;
getRenderedCanvas(opts?: {
backgroundColor?: string | GradientObject | ImagePatternObject;
pixelRatio?: number;
}): HTMLCanvasElement;
getWidth(): number;
getHeight(): number;
}
export {};
+641
View File
@@ -0,0 +1,641 @@
import { devicePixelRatio } from '../config.js';
import * as util from '../core/util.js';
import Layer from './Layer.js';
import requestAnimationFrame from '../animation/requestAnimationFrame.js';
import env from '../core/env.js';
import { brush, brushSingle } from './graphic.js';
import { REDRAW_BIT } from '../graphic/constants.js';
import { getSize } from './helper.js';
var HOVER_LAYER_ZLEVEL = 1e5;
var CANVAS_ZLEVEL = 314159;
var EL_AFTER_INCREMENTAL_INC = 0.01;
var INCREMENTAL_INC = 0.001;
function isLayerValid(layer) {
if (!layer) {
return false;
}
if (layer.__builtin__) {
return true;
}
if (typeof (layer.resize) !== 'function'
|| typeof (layer.refresh) !== 'function') {
return false;
}
return true;
}
function createRoot(width, height) {
var domRoot = document.createElement('div');
domRoot.style.cssText = [
'position:relative',
'width:' + width + 'px',
'height:' + height + 'px',
'padding:0',
'margin:0',
'border-width:0'
].join(';') + ';';
return domRoot;
}
var CanvasPainter = (function () {
function CanvasPainter(root, storage, opts, id) {
this.type = 'canvas';
this._zlevelList = [];
this._prevDisplayList = [];
this._layers = {};
this._layerConfig = {};
this._needsManuallyCompositing = false;
this.type = 'canvas';
var singleCanvas = !root.nodeName
|| root.nodeName.toUpperCase() === 'CANVAS';
this._opts = opts = util.extend({}, opts || {});
this.dpr = opts.devicePixelRatio || devicePixelRatio;
this._singleCanvas = singleCanvas;
this.root = root;
var rootStyle = root.style;
if (rootStyle) {
util.disableUserSelect(root);
root.innerHTML = '';
}
this.storage = storage;
var zlevelList = this._zlevelList;
this._prevDisplayList = [];
var layers = this._layers;
if (!singleCanvas) {
this._width = getSize(root, 0, opts);
this._height = getSize(root, 1, opts);
var domRoot = this._domRoot = createRoot(this._width, this._height);
root.appendChild(domRoot);
}
else {
var rootCanvas = root;
var width = rootCanvas.width;
var height = rootCanvas.height;
if (opts.width != null) {
width = opts.width;
}
if (opts.height != null) {
height = opts.height;
}
this.dpr = opts.devicePixelRatio || 1;
rootCanvas.width = width * this.dpr;
rootCanvas.height = height * this.dpr;
this._width = width;
this._height = height;
var mainLayer = new Layer(rootCanvas, this, this.dpr);
mainLayer.__builtin__ = true;
mainLayer.initContext();
layers[CANVAS_ZLEVEL] = mainLayer;
mainLayer.zlevel = CANVAS_ZLEVEL;
zlevelList.push(CANVAS_ZLEVEL);
this._domRoot = root;
}
}
CanvasPainter.prototype.getType = function () {
return 'canvas';
};
CanvasPainter.prototype.isSingleCanvas = function () {
return this._singleCanvas;
};
CanvasPainter.prototype.getViewportRoot = function () {
return this._domRoot;
};
CanvasPainter.prototype.getViewportRootOffset = function () {
var viewportRoot = this.getViewportRoot();
if (viewportRoot) {
return {
offsetLeft: viewportRoot.offsetLeft || 0,
offsetTop: viewportRoot.offsetTop || 0
};
}
};
CanvasPainter.prototype.refresh = function (paintAll) {
var list = this.storage.getDisplayList(true);
var prevList = this._prevDisplayList;
var zlevelList = this._zlevelList;
this._redrawId = Math.random();
this._paintList(list, prevList, paintAll, this._redrawId);
for (var i = 0; i < zlevelList.length; i++) {
var z = zlevelList[i];
var layer = this._layers[z];
if (!layer.__builtin__ && layer.refresh) {
var clearColor = i === 0 ? this._backgroundColor : null;
layer.refresh(clearColor);
}
}
if (this._opts.useDirtyRect) {
this._prevDisplayList = list.slice();
}
return this;
};
CanvasPainter.prototype.refreshHover = function () {
this._paintHoverList(this.storage.getDisplayList(false));
};
CanvasPainter.prototype._paintHoverList = function (list) {
var len = list.length;
var hoverLayer = this._hoverlayer;
hoverLayer && hoverLayer.clear();
if (!len) {
return;
}
var scope = {
inHover: true,
viewWidth: this._width,
viewHeight: this._height
};
var ctx;
for (var i = 0; i < len; i++) {
var el = list[i];
if (el.__inHover) {
if (!hoverLayer) {
hoverLayer = this._hoverlayer = this.getLayer(HOVER_LAYER_ZLEVEL);
}
if (!ctx) {
ctx = hoverLayer.ctx;
ctx.save();
}
brush(ctx, el, scope, i === len - 1);
}
}
if (ctx) {
ctx.restore();
}
};
CanvasPainter.prototype.getHoverLayer = function () {
return this.getLayer(HOVER_LAYER_ZLEVEL);
};
CanvasPainter.prototype.paintOne = function (ctx, el) {
brushSingle(ctx, el);
};
CanvasPainter.prototype._paintList = function (list, prevList, paintAll, redrawId) {
if (this._redrawId !== redrawId) {
return;
}
paintAll = paintAll || false;
this._updateLayerStatus(list);
var _a = this._doPaintList(list, prevList, paintAll), finished = _a.finished, needsRefreshHover = _a.needsRefreshHover;
if (this._needsManuallyCompositing) {
this._compositeManually();
}
if (needsRefreshHover) {
this._paintHoverList(list);
}
if (!finished) {
var self_1 = this;
requestAnimationFrame(function () {
self_1._paintList(list, prevList, paintAll, redrawId);
});
}
else {
this.eachLayer(function (layer) {
layer.afterBrush && layer.afterBrush();
});
}
};
CanvasPainter.prototype._compositeManually = function () {
var ctx = this.getLayer(CANVAS_ZLEVEL).ctx;
var width = this._domRoot.width;
var height = this._domRoot.height;
ctx.clearRect(0, 0, width, height);
this.eachBuiltinLayer(function (layer) {
if (layer.virtual) {
ctx.drawImage(layer.dom, 0, 0, width, height);
}
});
};
CanvasPainter.prototype._doPaintList = function (list, prevList, paintAll) {
var _this = this;
var layerList = [];
var useDirtyRect = this._opts.useDirtyRect;
for (var zi = 0; zi < this._zlevelList.length; zi++) {
var zlevel = this._zlevelList[zi];
var layer = this._layers[zlevel];
if (layer.__builtin__
&& layer !== this._hoverlayer
&& (layer.__dirty || paintAll)) {
layerList.push(layer);
}
}
var finished = true;
var needsRefreshHover = false;
var _loop_1 = function (k) {
var layer = layerList[k];
var ctx = layer.ctx;
var repaintRects = useDirtyRect
&& layer.createRepaintRects(list, prevList, this_1._width, this_1._height);
var start = paintAll ? layer.__startIndex : layer.__drawIndex;
var useTimer = !paintAll && layer.incremental && Date.now;
var startTime = useTimer && Date.now();
var clearColor = layer.zlevel === this_1._zlevelList[0]
? this_1._backgroundColor : null;
if (layer.__startIndex === layer.__endIndex) {
layer.clear(false, clearColor, repaintRects);
}
else if (start === layer.__startIndex) {
var firstEl = list[start];
if (!firstEl.incremental || !firstEl.notClear || paintAll) {
layer.clear(false, clearColor, repaintRects);
}
}
if (start === -1) {
console.error('For some unknown reason. drawIndex is -1');
start = layer.__startIndex;
}
var i;
var repaint = function (repaintRect) {
var scope = {
inHover: false,
allClipped: false,
prevEl: null,
viewWidth: _this._width,
viewHeight: _this._height
};
for (i = start; i < layer.__endIndex; i++) {
var el = list[i];
if (el.__inHover) {
needsRefreshHover = true;
}
_this._doPaintEl(el, layer, useDirtyRect, repaintRect, scope, i === layer.__endIndex - 1);
if (useTimer) {
var dTime = Date.now() - startTime;
if (dTime > 15) {
break;
}
}
}
if (scope.prevElClipPaths) {
ctx.restore();
}
};
if (repaintRects) {
if (repaintRects.length === 0) {
i = layer.__endIndex;
}
else {
var dpr = this_1.dpr;
for (var r = 0; r < repaintRects.length; ++r) {
var rect = repaintRects[r];
ctx.save();
ctx.beginPath();
ctx.rect(rect.x * dpr, rect.y * dpr, rect.width * dpr, rect.height * dpr);
ctx.clip();
repaint(rect);
ctx.restore();
}
}
}
else {
ctx.save();
repaint();
ctx.restore();
}
layer.__drawIndex = i;
if (layer.__drawIndex < layer.__endIndex) {
finished = false;
}
};
var this_1 = this;
for (var k = 0; k < layerList.length; k++) {
_loop_1(k);
}
if (env.wxa) {
util.each(this._layers, function (layer) {
if (layer && layer.ctx && layer.ctx.draw) {
layer.ctx.draw();
}
});
}
return {
finished: finished,
needsRefreshHover: needsRefreshHover
};
};
CanvasPainter.prototype._doPaintEl = function (el, currentLayer, useDirtyRect, repaintRect, scope, isLast) {
var ctx = currentLayer.ctx;
if (useDirtyRect) {
var paintRect = el.getPaintRect();
if (!repaintRect || paintRect && paintRect.intersect(repaintRect)) {
brush(ctx, el, scope, isLast);
el.setPrevPaintRect(paintRect);
}
}
else {
brush(ctx, el, scope, isLast);
}
};
CanvasPainter.prototype.getLayer = function (zlevel, virtual) {
if (this._singleCanvas && !this._needsManuallyCompositing) {
zlevel = CANVAS_ZLEVEL;
}
var layer = this._layers[zlevel];
if (!layer) {
layer = new Layer('zr_' + zlevel, this, this.dpr);
layer.zlevel = zlevel;
layer.__builtin__ = true;
if (this._layerConfig[zlevel]) {
util.merge(layer, this._layerConfig[zlevel], true);
}
else if (this._layerConfig[zlevel - EL_AFTER_INCREMENTAL_INC]) {
util.merge(layer, this._layerConfig[zlevel - EL_AFTER_INCREMENTAL_INC], true);
}
if (virtual) {
layer.virtual = virtual;
}
this.insertLayer(zlevel, layer);
layer.initContext();
}
return layer;
};
CanvasPainter.prototype.insertLayer = function (zlevel, layer) {
var layersMap = this._layers;
var zlevelList = this._zlevelList;
var len = zlevelList.length;
var domRoot = this._domRoot;
var prevLayer = null;
var i = -1;
if (layersMap[zlevel]) {
if (process.env.NODE_ENV !== 'production') {
util.logError('ZLevel ' + zlevel + ' has been used already');
}
return;
}
if (!isLayerValid(layer)) {
if (process.env.NODE_ENV !== 'production') {
util.logError('Layer of zlevel ' + zlevel + ' is not valid');
}
return;
}
if (len > 0 && zlevel > zlevelList[0]) {
for (i = 0; i < len - 1; i++) {
if (zlevelList[i] < zlevel
&& zlevelList[i + 1] > zlevel) {
break;
}
}
prevLayer = layersMap[zlevelList[i]];
}
zlevelList.splice(i + 1, 0, zlevel);
layersMap[zlevel] = layer;
if (!layer.virtual) {
if (prevLayer) {
var prevDom = prevLayer.dom;
if (prevDom.nextSibling) {
domRoot.insertBefore(layer.dom, prevDom.nextSibling);
}
else {
domRoot.appendChild(layer.dom);
}
}
else {
if (domRoot.firstChild) {
domRoot.insertBefore(layer.dom, domRoot.firstChild);
}
else {
domRoot.appendChild(layer.dom);
}
}
}
layer.__painter = this;
};
CanvasPainter.prototype.eachLayer = function (cb, context) {
var zlevelList = this._zlevelList;
for (var i = 0; i < zlevelList.length; i++) {
var z = zlevelList[i];
cb.call(context, this._layers[z], z);
}
};
CanvasPainter.prototype.eachBuiltinLayer = function (cb, context) {
var zlevelList = this._zlevelList;
for (var i = 0; i < zlevelList.length; i++) {
var z = zlevelList[i];
var layer = this._layers[z];
if (layer.__builtin__) {
cb.call(context, layer, z);
}
}
};
CanvasPainter.prototype.eachOtherLayer = function (cb, context) {
var zlevelList = this._zlevelList;
for (var i = 0; i < zlevelList.length; i++) {
var z = zlevelList[i];
var layer = this._layers[z];
if (!layer.__builtin__) {
cb.call(context, layer, z);
}
}
};
CanvasPainter.prototype.getLayers = function () {
return this._layers;
};
CanvasPainter.prototype._updateLayerStatus = function (list) {
this.eachBuiltinLayer(function (layer, z) {
layer.__dirty = layer.__used = false;
});
function updatePrevLayer(idx) {
if (prevLayer) {
if (prevLayer.__endIndex !== idx) {
prevLayer.__dirty = true;
}
prevLayer.__endIndex = idx;
}
}
if (this._singleCanvas) {
for (var i_1 = 1; i_1 < list.length; i_1++) {
var el = list[i_1];
if (el.zlevel !== list[i_1 - 1].zlevel || el.incremental) {
this._needsManuallyCompositing = true;
break;
}
}
}
var prevLayer = null;
var incrementalLayerCount = 0;
var prevZlevel;
var i;
for (i = 0; i < list.length; i++) {
var el = list[i];
var zlevel = el.zlevel;
var layer = void 0;
if (prevZlevel !== zlevel) {
prevZlevel = zlevel;
incrementalLayerCount = 0;
}
if (el.incremental) {
layer = this.getLayer(zlevel + INCREMENTAL_INC, this._needsManuallyCompositing);
layer.incremental = true;
incrementalLayerCount = 1;
}
else {
layer = this.getLayer(zlevel + (incrementalLayerCount > 0 ? EL_AFTER_INCREMENTAL_INC : 0), this._needsManuallyCompositing);
}
if (!layer.__builtin__) {
util.logError('ZLevel ' + zlevel + ' has been used by unkown layer ' + layer.id);
}
if (layer !== prevLayer) {
layer.__used = true;
if (layer.__startIndex !== i) {
layer.__dirty = true;
}
layer.__startIndex = i;
if (!layer.incremental) {
layer.__drawIndex = i;
}
else {
layer.__drawIndex = -1;
}
updatePrevLayer(i);
prevLayer = layer;
}
if ((el.__dirty & REDRAW_BIT) && !el.__inHover) {
layer.__dirty = true;
if (layer.incremental && layer.__drawIndex < 0) {
layer.__drawIndex = i;
}
}
}
updatePrevLayer(i);
this.eachBuiltinLayer(function (layer, z) {
if (!layer.__used && layer.getElementCount() > 0) {
layer.__dirty = true;
layer.__startIndex = layer.__endIndex = layer.__drawIndex = 0;
}
if (layer.__dirty && layer.__drawIndex < 0) {
layer.__drawIndex = layer.__startIndex;
}
});
};
CanvasPainter.prototype.clear = function () {
this.eachBuiltinLayer(this._clearLayer);
return this;
};
CanvasPainter.prototype._clearLayer = function (layer) {
layer.clear();
};
CanvasPainter.prototype.setBackgroundColor = function (backgroundColor) {
this._backgroundColor = backgroundColor;
util.each(this._layers, function (layer) {
layer.setUnpainted();
});
};
CanvasPainter.prototype.configLayer = function (zlevel, config) {
if (config) {
var layerConfig = this._layerConfig;
if (!layerConfig[zlevel]) {
layerConfig[zlevel] = config;
}
else {
util.merge(layerConfig[zlevel], config, true);
}
for (var i = 0; i < this._zlevelList.length; i++) {
var _zlevel = this._zlevelList[i];
if (_zlevel === zlevel || _zlevel === zlevel + EL_AFTER_INCREMENTAL_INC) {
var layer = this._layers[_zlevel];
util.merge(layer, layerConfig[zlevel], true);
}
}
}
};
CanvasPainter.prototype.delLayer = function (zlevel) {
var layers = this._layers;
var zlevelList = this._zlevelList;
var layer = layers[zlevel];
if (!layer) {
return;
}
layer.dom.parentNode.removeChild(layer.dom);
delete layers[zlevel];
zlevelList.splice(util.indexOf(zlevelList, zlevel), 1);
};
CanvasPainter.prototype.resize = function (width, height) {
if (!this._domRoot.style) {
if (width == null || height == null) {
return;
}
this._width = width;
this._height = height;
this.getLayer(CANVAS_ZLEVEL).resize(width, height);
}
else {
var domRoot = this._domRoot;
domRoot.style.display = 'none';
var opts = this._opts;
var root = this.root;
width != null && (opts.width = width);
height != null && (opts.height = height);
width = getSize(root, 0, opts);
height = getSize(root, 1, opts);
domRoot.style.display = '';
if (this._width !== width || height !== this._height) {
domRoot.style.width = width + 'px';
domRoot.style.height = height + 'px';
for (var id in this._layers) {
if (this._layers.hasOwnProperty(id)) {
this._layers[id].resize(width, height);
}
}
this.refresh(true);
}
this._width = width;
this._height = height;
}
return this;
};
CanvasPainter.prototype.clearLayer = function (zlevel) {
var layer = this._layers[zlevel];
if (layer) {
layer.clear();
}
};
CanvasPainter.prototype.dispose = function () {
this.root.innerHTML = '';
this.root =
this.storage =
this._domRoot =
this._layers = null;
};
CanvasPainter.prototype.getRenderedCanvas = function (opts) {
opts = opts || {};
if (this._singleCanvas && !this._compositeManually) {
return this._layers[CANVAS_ZLEVEL].dom;
}
var imageLayer = new Layer('image', this, opts.pixelRatio || this.dpr);
imageLayer.initContext();
imageLayer.clear(false, opts.backgroundColor || this._backgroundColor);
var ctx = imageLayer.ctx;
if (opts.pixelRatio <= this.dpr) {
this.refresh();
var width_1 = imageLayer.dom.width;
var height_1 = imageLayer.dom.height;
this.eachLayer(function (layer) {
if (layer.__builtin__) {
ctx.drawImage(layer.dom, 0, 0, width_1, height_1);
}
else if (layer.renderToCanvas) {
ctx.save();
layer.renderToCanvas(ctx);
ctx.restore();
}
});
}
else {
var scope = {
inHover: false,
viewWidth: this._width,
viewHeight: this._height
};
var displayList = this.storage.getDisplayList(true);
for (var i = 0, len = displayList.length; i < len; i++) {
var el = displayList[i];
brush(ctx, el, scope, i === len - 1);
}
}
return imageLayer.dom;
};
CanvasPainter.prototype.getWidth = function () {
return this._width;
};
CanvasPainter.prototype.getHeight = function () {
return this._height;
};
return CanvasPainter;
}());
export default CanvasPainter;
;
File diff suppressed because one or more lines are too long
+1
View File
@@ -0,0 +1 @@
export {};
+3
View File
@@ -0,0 +1,3 @@
import { registerPainter } from '../zrender.js';
import Painter from './Painter.js';
registerPainter('canvas', Painter);
+1
View File
@@ -0,0 +1 @@
{"version":3,"file":"canvas.js","sourceRoot":"","sources":["../../src/canvas/canvas.ts"],"names":[],"mappings":";;AAAA,qBAAmB;AACnB,sCAA2C;AAC3C,qCAAgC;AAEhC,yBAAe,CAAC,QAAQ,EAAE,oBAAO,CAAC,CAAC"}
+4
View File
@@ -0,0 +1,4 @@
import Path from '../graphic/Path';
import TSpan from '../graphic/TSpan';
export declare function normalizeLineDash(lineType: any, lineWidth?: number): number[] | false;
export declare function getLineDash(el: Path | TSpan): [number[] | false, number];
+27
View File
@@ -0,0 +1,27 @@
import { isArray, isNumber, map } from '../core/util.js';
export function normalizeLineDash(lineType, lineWidth) {
if (!lineType || lineType === 'solid' || !(lineWidth > 0)) {
return null;
}
return lineType === 'dashed'
? [4 * lineWidth, 2 * lineWidth]
: lineType === 'dotted'
? [lineWidth]
: isNumber(lineType)
? [lineType] : isArray(lineType) ? lineType : null;
}
export function getLineDash(el) {
var style = el.style;
var lineDash = style.lineDash && style.lineWidth > 0 && normalizeLineDash(style.lineDash, style.lineWidth);
var lineDashOffset = style.lineDashOffset;
if (lineDash) {
var lineScale_1 = (style.strokeNoScale && el.getLineScale) ? el.getLineScale() : 1;
if (lineScale_1 && lineScale_1 !== 1) {
lineDash = map(lineDash, function (rawVal) {
return rawVal / lineScale_1;
});
lineDashOffset /= lineScale_1;
}
}
return [lineDash, lineDashOffset];
}
+19
View File
@@ -0,0 +1,19 @@
import Displayable from '../graphic/Displayable';
import { ImagePatternObject } from '../graphic/Pattern';
import Path from '../graphic/Path';
export declare function createCanvasPattern(this: void, ctx: CanvasRenderingContext2D, pattern: ImagePatternObject, el: {
dirty: () => void;
}): CanvasPattern;
export declare type BrushScope = {
inHover: boolean;
viewWidth: number;
viewHeight: number;
prevElClipPaths?: Path[];
prevEl?: Displayable;
allClipped?: boolean;
batchFill?: string;
batchStroke?: string;
lastDrawType?: number;
};
export declare function brushSingle(ctx: CanvasRenderingContext2D, el: Displayable): void;
export declare function brush(ctx: CanvasRenderingContext2D, el: Displayable, scope: BrushScope, isLast: boolean): void;
+558
View File
@@ -0,0 +1,558 @@
import { DEFAULT_COMMON_STYLE } from '../graphic/Displayable.js';
import PathProxy from '../core/PathProxy.js';
import { createOrUpdateImage, isImageReady } from '../graphic/helper/image.js';
import { getCanvasGradient, isClipPathChanged } from './helper.js';
import Path from '../graphic/Path.js';
import ZRImage from '../graphic/Image.js';
import TSpan from '../graphic/TSpan.js';
import { RADIAN_TO_DEGREE } from '../core/util.js';
import { getLineDash } from './dashStyle.js';
import { REDRAW_BIT, SHAPE_CHANGED_BIT } from '../graphic/constants.js';
import { DEFAULT_FONT } from '../core/platform.js';
var pathProxyForDraw = new PathProxy(true);
function styleHasStroke(style) {
var stroke = style.stroke;
return !(stroke == null || stroke === 'none' || !(style.lineWidth > 0));
}
function isValidStrokeFillStyle(strokeOrFill) {
return typeof strokeOrFill === 'string' && strokeOrFill !== 'none';
}
function styleHasFill(style) {
var fill = style.fill;
return fill != null && fill !== 'none';
}
function doFillPath(ctx, style) {
if (style.fillOpacity != null && style.fillOpacity !== 1) {
var originalGlobalAlpha = ctx.globalAlpha;
ctx.globalAlpha = style.fillOpacity * style.opacity;
ctx.fill();
ctx.globalAlpha = originalGlobalAlpha;
}
else {
ctx.fill();
}
}
function doStrokePath(ctx, style) {
if (style.strokeOpacity != null && style.strokeOpacity !== 1) {
var originalGlobalAlpha = ctx.globalAlpha;
ctx.globalAlpha = style.strokeOpacity * style.opacity;
ctx.stroke();
ctx.globalAlpha = originalGlobalAlpha;
}
else {
ctx.stroke();
}
}
export function createCanvasPattern(ctx, pattern, el) {
var image = createOrUpdateImage(pattern.image, pattern.__image, el);
if (isImageReady(image)) {
var canvasPattern = ctx.createPattern(image, pattern.repeat || 'repeat');
if (typeof DOMMatrix === 'function'
&& canvasPattern
&& canvasPattern.setTransform) {
var matrix = new DOMMatrix();
matrix.translateSelf((pattern.x || 0), (pattern.y || 0));
matrix.rotateSelf(0, 0, (pattern.rotation || 0) * RADIAN_TO_DEGREE);
matrix.scaleSelf((pattern.scaleX || 1), (pattern.scaleY || 1));
canvasPattern.setTransform(matrix);
}
return canvasPattern;
}
}
function brushPath(ctx, el, style, inBatch) {
var _a;
var hasStroke = styleHasStroke(style);
var hasFill = styleHasFill(style);
var strokePercent = style.strokePercent;
var strokePart = strokePercent < 1;
var firstDraw = !el.path;
if ((!el.silent || strokePart) && firstDraw) {
el.createPathProxy();
}
var path = el.path || pathProxyForDraw;
var dirtyFlag = el.__dirty;
if (!inBatch) {
var fill = style.fill;
var stroke = style.stroke;
var hasFillGradient = hasFill && !!fill.colorStops;
var hasStrokeGradient = hasStroke && !!stroke.colorStops;
var hasFillPattern = hasFill && !!fill.image;
var hasStrokePattern = hasStroke && !!stroke.image;
var fillGradient = void 0;
var strokeGradient = void 0;
var fillPattern = void 0;
var strokePattern = void 0;
var rect = void 0;
if (hasFillGradient || hasStrokeGradient) {
rect = el.getBoundingRect();
}
if (hasFillGradient) {
fillGradient = dirtyFlag
? getCanvasGradient(ctx, fill, rect)
: el.__canvasFillGradient;
el.__canvasFillGradient = fillGradient;
}
if (hasStrokeGradient) {
strokeGradient = dirtyFlag
? getCanvasGradient(ctx, stroke, rect)
: el.__canvasStrokeGradient;
el.__canvasStrokeGradient = strokeGradient;
}
if (hasFillPattern) {
fillPattern = (dirtyFlag || !el.__canvasFillPattern)
? createCanvasPattern(ctx, fill, el)
: el.__canvasFillPattern;
el.__canvasFillPattern = fillPattern;
}
if (hasStrokePattern) {
strokePattern = (dirtyFlag || !el.__canvasStrokePattern)
? createCanvasPattern(ctx, stroke, el)
: el.__canvasStrokePattern;
el.__canvasStrokePattern = fillPattern;
}
if (hasFillGradient) {
ctx.fillStyle = fillGradient;
}
else if (hasFillPattern) {
if (fillPattern) {
ctx.fillStyle = fillPattern;
}
else {
hasFill = false;
}
}
if (hasStrokeGradient) {
ctx.strokeStyle = strokeGradient;
}
else if (hasStrokePattern) {
if (strokePattern) {
ctx.strokeStyle = strokePattern;
}
else {
hasStroke = false;
}
}
}
var scale = el.getGlobalScale();
path.setScale(scale[0], scale[1], el.segmentIgnoreThreshold);
var lineDash;
var lineDashOffset;
if (ctx.setLineDash && style.lineDash) {
_a = getLineDash(el), lineDash = _a[0], lineDashOffset = _a[1];
}
var needsRebuild = true;
if (firstDraw || (dirtyFlag & SHAPE_CHANGED_BIT)) {
path.setDPR(ctx.dpr);
if (strokePart) {
path.setContext(null);
}
else {
path.setContext(ctx);
needsRebuild = false;
}
path.reset();
el.buildPath(path, el.shape, inBatch);
path.toStatic();
el.pathUpdated();
}
if (needsRebuild) {
path.rebuildPath(ctx, strokePart ? strokePercent : 1);
}
if (lineDash) {
ctx.setLineDash(lineDash);
ctx.lineDashOffset = lineDashOffset;
}
if (!inBatch) {
if (style.strokeFirst) {
if (hasStroke) {
doStrokePath(ctx, style);
}
if (hasFill) {
doFillPath(ctx, style);
}
}
else {
if (hasFill) {
doFillPath(ctx, style);
}
if (hasStroke) {
doStrokePath(ctx, style);
}
}
}
if (lineDash) {
ctx.setLineDash([]);
}
}
function brushImage(ctx, el, style) {
var image = el.__image = createOrUpdateImage(style.image, el.__image, el, el.onload);
if (!image || !isImageReady(image)) {
return;
}
var x = style.x || 0;
var y = style.y || 0;
var width = el.getWidth();
var height = el.getHeight();
var aspect = image.width / image.height;
if (width == null && height != null) {
width = height * aspect;
}
else if (height == null && width != null) {
height = width / aspect;
}
else if (width == null && height == null) {
width = image.width;
height = image.height;
}
if (style.sWidth && style.sHeight) {
var sx = style.sx || 0;
var sy = style.sy || 0;
ctx.drawImage(image, sx, sy, style.sWidth, style.sHeight, x, y, width, height);
}
else if (style.sx && style.sy) {
var sx = style.sx;
var sy = style.sy;
var sWidth = width - sx;
var sHeight = height - sy;
ctx.drawImage(image, sx, sy, sWidth, sHeight, x, y, width, height);
}
else {
ctx.drawImage(image, x, y, width, height);
}
}
function brushText(ctx, el, style) {
var _a;
var text = style.text;
text != null && (text += '');
if (text) {
ctx.font = style.font || DEFAULT_FONT;
ctx.textAlign = style.textAlign;
ctx.textBaseline = style.textBaseline;
var lineDash = void 0;
var lineDashOffset = void 0;
if (ctx.setLineDash && style.lineDash) {
_a = getLineDash(el), lineDash = _a[0], lineDashOffset = _a[1];
}
if (lineDash) {
ctx.setLineDash(lineDash);
ctx.lineDashOffset = lineDashOffset;
}
if (style.strokeFirst) {
if (styleHasStroke(style)) {
ctx.strokeText(text, style.x, style.y);
}
if (styleHasFill(style)) {
ctx.fillText(text, style.x, style.y);
}
}
else {
if (styleHasFill(style)) {
ctx.fillText(text, style.x, style.y);
}
if (styleHasStroke(style)) {
ctx.strokeText(text, style.x, style.y);
}
}
if (lineDash) {
ctx.setLineDash([]);
}
}
}
var SHADOW_NUMBER_PROPS = ['shadowBlur', 'shadowOffsetX', 'shadowOffsetY'];
var STROKE_PROPS = [
['lineCap', 'butt'], ['lineJoin', 'miter'], ['miterLimit', 10]
];
function bindCommonProps(ctx, style, prevStyle, forceSetAll, scope) {
var styleChanged = false;
if (!forceSetAll) {
prevStyle = prevStyle || {};
if (style === prevStyle) {
return false;
}
}
if (forceSetAll || style.opacity !== prevStyle.opacity) {
flushPathDrawn(ctx, scope);
styleChanged = true;
var opacity = Math.max(Math.min(style.opacity, 1), 0);
ctx.globalAlpha = isNaN(opacity) ? DEFAULT_COMMON_STYLE.opacity : opacity;
}
if (forceSetAll || style.blend !== prevStyle.blend) {
if (!styleChanged) {
flushPathDrawn(ctx, scope);
styleChanged = true;
}
ctx.globalCompositeOperation = style.blend || DEFAULT_COMMON_STYLE.blend;
}
for (var i = 0; i < SHADOW_NUMBER_PROPS.length; i++) {
var propName = SHADOW_NUMBER_PROPS[i];
if (forceSetAll || style[propName] !== prevStyle[propName]) {
if (!styleChanged) {
flushPathDrawn(ctx, scope);
styleChanged = true;
}
ctx[propName] = ctx.dpr * (style[propName] || 0);
}
}
if (forceSetAll || style.shadowColor !== prevStyle.shadowColor) {
if (!styleChanged) {
flushPathDrawn(ctx, scope);
styleChanged = true;
}
ctx.shadowColor = style.shadowColor || DEFAULT_COMMON_STYLE.shadowColor;
}
return styleChanged;
}
function bindPathAndTextCommonStyle(ctx, el, prevEl, forceSetAll, scope) {
var style = getStyle(el, scope.inHover);
var prevStyle = forceSetAll
? null
: (prevEl && getStyle(prevEl, scope.inHover) || {});
if (style === prevStyle) {
return false;
}
var styleChanged = bindCommonProps(ctx, style, prevStyle, forceSetAll, scope);
if (forceSetAll || style.fill !== prevStyle.fill) {
if (!styleChanged) {
flushPathDrawn(ctx, scope);
styleChanged = true;
}
isValidStrokeFillStyle(style.fill) && (ctx.fillStyle = style.fill);
}
if (forceSetAll || style.stroke !== prevStyle.stroke) {
if (!styleChanged) {
flushPathDrawn(ctx, scope);
styleChanged = true;
}
isValidStrokeFillStyle(style.stroke) && (ctx.strokeStyle = style.stroke);
}
if (forceSetAll || style.opacity !== prevStyle.opacity) {
if (!styleChanged) {
flushPathDrawn(ctx, scope);
styleChanged = true;
}
ctx.globalAlpha = style.opacity == null ? 1 : style.opacity;
}
if (el.hasStroke()) {
var lineWidth = style.lineWidth;
var newLineWidth = lineWidth / ((style.strokeNoScale && el.getLineScale) ? el.getLineScale() : 1);
if (ctx.lineWidth !== newLineWidth) {
if (!styleChanged) {
flushPathDrawn(ctx, scope);
styleChanged = true;
}
ctx.lineWidth = newLineWidth;
}
}
for (var i = 0; i < STROKE_PROPS.length; i++) {
var prop = STROKE_PROPS[i];
var propName = prop[0];
if (forceSetAll || style[propName] !== prevStyle[propName]) {
if (!styleChanged) {
flushPathDrawn(ctx, scope);
styleChanged = true;
}
ctx[propName] = style[propName] || prop[1];
}
}
return styleChanged;
}
function bindImageStyle(ctx, el, prevEl, forceSetAll, scope) {
return bindCommonProps(ctx, getStyle(el, scope.inHover), prevEl && getStyle(prevEl, scope.inHover), forceSetAll, scope);
}
function setContextTransform(ctx, el) {
var m = el.transform;
var dpr = ctx.dpr || 1;
if (m) {
ctx.setTransform(dpr * m[0], dpr * m[1], dpr * m[2], dpr * m[3], dpr * m[4], dpr * m[5]);
}
else {
ctx.setTransform(dpr, 0, 0, dpr, 0, 0);
}
}
function updateClipStatus(clipPaths, ctx, scope) {
var allClipped = false;
for (var i = 0; i < clipPaths.length; i++) {
var clipPath = clipPaths[i];
allClipped = allClipped || clipPath.isZeroArea();
setContextTransform(ctx, clipPath);
ctx.beginPath();
clipPath.buildPath(ctx, clipPath.shape);
ctx.clip();
}
scope.allClipped = allClipped;
}
function isTransformChanged(m0, m1) {
if (m0 && m1) {
return m0[0] !== m1[0]
|| m0[1] !== m1[1]
|| m0[2] !== m1[2]
|| m0[3] !== m1[3]
|| m0[4] !== m1[4]
|| m0[5] !== m1[5];
}
else if (!m0 && !m1) {
return false;
}
return true;
}
var DRAW_TYPE_PATH = 1;
var DRAW_TYPE_IMAGE = 2;
var DRAW_TYPE_TEXT = 3;
var DRAW_TYPE_INCREMENTAL = 4;
function canPathBatch(style) {
var hasFill = styleHasFill(style);
var hasStroke = styleHasStroke(style);
return !(style.lineDash
|| !(+hasFill ^ +hasStroke)
|| (hasFill && typeof style.fill !== 'string')
|| (hasStroke && typeof style.stroke !== 'string')
|| style.strokePercent < 1
|| style.strokeOpacity < 1
|| style.fillOpacity < 1);
}
function flushPathDrawn(ctx, scope) {
scope.batchFill && ctx.fill();
scope.batchStroke && ctx.stroke();
scope.batchFill = '';
scope.batchStroke = '';
}
function getStyle(el, inHover) {
return inHover ? (el.__hoverStyle || el.style) : el.style;
}
export function brushSingle(ctx, el) {
brush(ctx, el, { inHover: false, viewWidth: 0, viewHeight: 0 }, true);
}
export function brush(ctx, el, scope, isLast) {
var m = el.transform;
if (!el.shouldBePainted(scope.viewWidth, scope.viewHeight, false, false)) {
el.__dirty &= ~REDRAW_BIT;
el.__isRendered = false;
return;
}
var clipPaths = el.__clipPaths;
var prevElClipPaths = scope.prevElClipPaths;
var forceSetTransform = false;
var forceSetStyle = false;
if (!prevElClipPaths || isClipPathChanged(clipPaths, prevElClipPaths)) {
if (prevElClipPaths && prevElClipPaths.length) {
flushPathDrawn(ctx, scope);
ctx.restore();
forceSetStyle = forceSetTransform = true;
scope.prevElClipPaths = null;
scope.allClipped = false;
scope.prevEl = null;
}
if (clipPaths && clipPaths.length) {
flushPathDrawn(ctx, scope);
ctx.save();
updateClipStatus(clipPaths, ctx, scope);
forceSetTransform = true;
}
scope.prevElClipPaths = clipPaths;
}
if (scope.allClipped) {
el.__isRendered = false;
return;
}
el.beforeBrush && el.beforeBrush();
el.innerBeforeBrush();
var prevEl = scope.prevEl;
if (!prevEl) {
forceSetStyle = forceSetTransform = true;
}
var canBatchPath = el instanceof Path
&& el.autoBatch
&& canPathBatch(el.style);
if (forceSetTransform || isTransformChanged(m, prevEl.transform)) {
flushPathDrawn(ctx, scope);
setContextTransform(ctx, el);
}
else if (!canBatchPath) {
flushPathDrawn(ctx, scope);
}
var style = getStyle(el, scope.inHover);
if (el instanceof Path) {
if (scope.lastDrawType !== DRAW_TYPE_PATH) {
forceSetStyle = true;
scope.lastDrawType = DRAW_TYPE_PATH;
}
bindPathAndTextCommonStyle(ctx, el, prevEl, forceSetStyle, scope);
if (!canBatchPath || (!scope.batchFill && !scope.batchStroke)) {
ctx.beginPath();
}
brushPath(ctx, el, style, canBatchPath);
if (canBatchPath) {
scope.batchFill = style.fill || '';
scope.batchStroke = style.stroke || '';
}
}
else {
if (el instanceof TSpan) {
if (scope.lastDrawType !== DRAW_TYPE_TEXT) {
forceSetStyle = true;
scope.lastDrawType = DRAW_TYPE_TEXT;
}
bindPathAndTextCommonStyle(ctx, el, prevEl, forceSetStyle, scope);
brushText(ctx, el, style);
}
else if (el instanceof ZRImage) {
if (scope.lastDrawType !== DRAW_TYPE_IMAGE) {
forceSetStyle = true;
scope.lastDrawType = DRAW_TYPE_IMAGE;
}
bindImageStyle(ctx, el, prevEl, forceSetStyle, scope);
brushImage(ctx, el, style);
}
else if (el.getTemporalDisplayables) {
if (scope.lastDrawType !== DRAW_TYPE_INCREMENTAL) {
forceSetStyle = true;
scope.lastDrawType = DRAW_TYPE_INCREMENTAL;
}
brushIncremental(ctx, el, scope);
}
}
if (canBatchPath && isLast) {
flushPathDrawn(ctx, scope);
}
el.innerAfterBrush();
el.afterBrush && el.afterBrush();
scope.prevEl = el;
el.__dirty = 0;
el.__isRendered = true;
}
function brushIncremental(ctx, el, scope) {
var displayables = el.getDisplayables();
var temporalDisplayables = el.getTemporalDisplayables();
ctx.save();
var innerScope = {
prevElClipPaths: null,
prevEl: null,
allClipped: false,
viewWidth: scope.viewWidth,
viewHeight: scope.viewHeight,
inHover: scope.inHover
};
var i;
var len;
for (i = el.getCursor(), len = displayables.length; i < len; i++) {
var displayable = displayables[i];
displayable.beforeBrush && displayable.beforeBrush();
displayable.innerBeforeBrush();
brush(ctx, displayable, innerScope, i === len - 1);
displayable.innerAfterBrush();
displayable.afterBrush && displayable.afterBrush();
innerScope.prevEl = displayable;
}
for (var i_1 = 0, len_1 = temporalDisplayables.length; i_1 < len_1; i_1++) {
var displayable = temporalDisplayables[i_1];
displayable.beforeBrush && displayable.beforeBrush();
displayable.innerBeforeBrush();
brush(ctx, displayable, innerScope, i_1 === len_1 - 1);
displayable.innerAfterBrush();
displayable.afterBrush && displayable.afterBrush();
innerScope.prevEl = displayable;
}
el.clearTemporalDisplayables();
el.notClear = true;
ctx.restore();
}
File diff suppressed because one or more lines are too long
+13
View File
@@ -0,0 +1,13 @@
import { LinearGradientObject } from '../graphic/LinearGradient';
import { RadialGradientObject } from '../graphic/RadialGradient';
import { GradientObject } from '../graphic/Gradient';
import { RectLike } from '../core/BoundingRect';
import Path from '../graphic/Path';
export declare function createLinearGradient(this: void, ctx: CanvasRenderingContext2D, obj: LinearGradientObject, rect: RectLike): CanvasGradient;
export declare function createRadialGradient(this: void, ctx: CanvasRenderingContext2D, obj: RadialGradientObject, rect: RectLike): CanvasGradient;
export declare function getCanvasGradient(this: void, ctx: CanvasRenderingContext2D, obj: GradientObject, rect: RectLike): CanvasGradient;
export declare function isClipPathChanged(clipPaths: Path[], prevClipPaths: Path[]): boolean;
export declare function getSize(root: HTMLElement, whIdx: number, opts: {
width?: number | string;
height?: number | string;
}): number;
+79
View File
@@ -0,0 +1,79 @@
function isSafeNum(num) {
return isFinite(num);
}
export function createLinearGradient(ctx, obj, rect) {
var x = obj.x == null ? 0 : obj.x;
var x2 = obj.x2 == null ? 1 : obj.x2;
var y = obj.y == null ? 0 : obj.y;
var y2 = obj.y2 == null ? 0 : obj.y2;
if (!obj.global) {
x = x * rect.width + rect.x;
x2 = x2 * rect.width + rect.x;
y = y * rect.height + rect.y;
y2 = y2 * rect.height + rect.y;
}
x = isSafeNum(x) ? x : 0;
x2 = isSafeNum(x2) ? x2 : 1;
y = isSafeNum(y) ? y : 0;
y2 = isSafeNum(y2) ? y2 : 0;
var canvasGradient = ctx.createLinearGradient(x, y, x2, y2);
return canvasGradient;
}
export function createRadialGradient(ctx, obj, rect) {
var width = rect.width;
var height = rect.height;
var min = Math.min(width, height);
var x = obj.x == null ? 0.5 : obj.x;
var y = obj.y == null ? 0.5 : obj.y;
var r = obj.r == null ? 0.5 : obj.r;
if (!obj.global) {
x = x * width + rect.x;
y = y * height + rect.y;
r = r * min;
}
x = isSafeNum(x) ? x : 0.5;
y = isSafeNum(y) ? y : 0.5;
r = r >= 0 && isSafeNum(r) ? r : 0.5;
var canvasGradient = ctx.createRadialGradient(x, y, 0, x, y, r);
return canvasGradient;
}
export function getCanvasGradient(ctx, obj, rect) {
var canvasGradient = obj.type === 'radial'
? createRadialGradient(ctx, obj, rect)
: createLinearGradient(ctx, obj, rect);
var colorStops = obj.colorStops;
for (var i = 0; i < colorStops.length; i++) {
canvasGradient.addColorStop(colorStops[i].offset, colorStops[i].color);
}
return canvasGradient;
}
export function isClipPathChanged(clipPaths, prevClipPaths) {
if (clipPaths === prevClipPaths || (!clipPaths && !prevClipPaths)) {
return false;
}
if (!clipPaths || !prevClipPaths || (clipPaths.length !== prevClipPaths.length)) {
return true;
}
for (var i = 0; i < clipPaths.length; i++) {
if (clipPaths[i] !== prevClipPaths[i]) {
return true;
}
}
return false;
}
function parseInt10(val) {
return parseInt(val, 10);
}
export function getSize(root, whIdx, opts) {
var wh = ['width', 'height'][whIdx];
var cwh = ['clientWidth', 'clientHeight'][whIdx];
var plt = ['paddingLeft', 'paddingTop'][whIdx];
var prb = ['paddingRight', 'paddingBottom'][whIdx];
if (opts[wh] != null && opts[wh] !== 'auto') {
return parseFloat(opts[wh]);
}
var stl = document.defaultView.getComputedStyle(root);
return ((root[cwh] || parseInt10(stl[wh]) || parseInt10(root.style[wh]))
- (parseInt10(stl[plt]) || 0)
- (parseInt10(stl[prb]) || 0)) | 0;
}
+1
View File
@@ -0,0 +1 @@
{"version":3,"file":"helper.js","sourceRoot":"","sources":["../../src/canvas/helper.ts"],"names":[],"mappings":"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"}
+6
View File
@@ -0,0 +1,6 @@
export declare const debugMode = 0;
export declare const devicePixelRatio: number;
export declare const DARK_MODE_THRESHOLD = 0.4;
export declare const DARK_LABEL_COLOR = "#333";
export declare const LIGHT_LABEL_COLOR = "#ccc";
export declare const LIGHTER_LABEL_COLOR = "#eee";
+13
View File
@@ -0,0 +1,13 @@
import env from './core/env.js';
var dpr = 1;
if (env.hasGlobalWindow) {
dpr = Math.max(window.devicePixelRatio
|| (window.screen && window.screen.deviceXDPI / window.screen.logicalXDPI)
|| 1, 1);
}
export var debugMode = 0;
export var devicePixelRatio = dpr;
export var DARK_MODE_THRESHOLD = 0.4;
export var DARK_LABEL_COLOR = '#333';
export var LIGHT_LABEL_COLOR = '#ccc';
export var LIGHTER_LABEL_COLOR = '#eee';
+1
View File
@@ -0,0 +1 @@
{"version":3,"file":"config.js","sourceRoot":"","sources":["../src/config.ts"],"names":[],"mappings":";;AAAA,IAAI,GAAG,GAAG,CAAC,CAAC;AAGZ,IAAI,OAAO,MAAM,KAAK,WAAW,EAAE;IAC/B,GAAG,GAAG,IAAI,CAAC,GAAG,CAAC,MAAM,CAAC,gBAAgB,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC;CACnD;AAOY,QAAA,SAAS,GAAG,CAAC,CAAC;AAGd,QAAA,gBAAgB,GAAG,GAAG,CAAC;AAMvB,QAAA,mBAAmB,GAAG,GAAG,CAAC;AAK1B,QAAA,gBAAgB,GAAG,MAAM,CAAC;AAK1B,QAAA,iBAAiB,GAAG,MAAM,CAAC;AAK3B,QAAA,mBAAmB,GAAG,MAAM,CAAC"}
+1
View File
@@ -0,0 +1 @@
export declare function containStroke(cx: number, cy: number, r: number, startAngle: number, endAngle: number, anticlockwise: boolean, lineWidth: number, x: number, y: number): boolean;
+35
View File
@@ -0,0 +1,35 @@
import { normalizeRadian } from './util.js';
var PI2 = Math.PI * 2;
export function containStroke(cx, cy, r, startAngle, endAngle, anticlockwise, lineWidth, x, y) {
if (lineWidth === 0) {
return false;
}
var _l = lineWidth;
x -= cx;
y -= cy;
var d = Math.sqrt(x * x + y * y);
if ((d - _l > r) || (d + _l < r)) {
return false;
}
if (Math.abs(startAngle - endAngle) % PI2 < 1e-4) {
return true;
}
if (anticlockwise) {
var tmp = startAngle;
startAngle = normalizeRadian(endAngle);
endAngle = normalizeRadian(tmp);
}
else {
startAngle = normalizeRadian(startAngle);
endAngle = normalizeRadian(endAngle);
}
if (startAngle > endAngle) {
endAngle += PI2;
}
var angle = Math.atan2(y, x);
if (angle < 0) {
angle += PI2;
}
return (angle >= startAngle && angle <= endAngle)
|| (angle + PI2 >= startAngle && angle + PI2 <= endAngle);
}
+1
View File
@@ -0,0 +1 @@
{"version":3,"file":"arc.js","sourceRoot":"","sources":["../../src/contain/arc.ts"],"names":[],"mappings":";;AACA,+BAAuC;AAEvC,IAAM,GAAG,GAAG,IAAI,CAAC,EAAE,GAAG,CAAC,CAAC;AAKxB,SAAgB,aAAa,CACzB,EAAU,EAAE,EAAU,EAAE,CAAS,EAAE,UAAkB,EAAE,QAAgB,EACvE,aAAsB,EACtB,SAAiB,EAAE,CAAS,EAAE,CAAS;IAGvC,IAAI,SAAS,KAAK,CAAC,EAAE;QACjB,OAAO,KAAK,CAAC;KAChB;IACD,IAAM,EAAE,GAAG,SAAS,CAAC;IAErB,CAAC,IAAI,EAAE,CAAC;IACR,CAAC,IAAI,EAAE,CAAC;IACR,IAAM,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC;IAEnC,IAAI,CAAC,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC,IAAI,CAAC,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC,EAAE;QAC9B,OAAO,KAAK,CAAC;KAChB;IAED,IAAI,IAAI,CAAC,GAAG,CAAC,UAAU,GAAG,QAAQ,CAAC,GAAG,GAAG,GAAG,IAAI,EAAE;QAE9C,OAAO,IAAI,CAAC;KACf;IACD,IAAI,aAAa,EAAE;QACf,IAAM,GAAG,GAAG,UAAU,CAAC;QACvB,UAAU,GAAG,sBAAe,CAAC,QAAQ,CAAC,CAAC;QACvC,QAAQ,GAAG,sBAAe,CAAC,GAAG,CAAC,CAAC;KACnC;SACI;QACD,UAAU,GAAG,sBAAe,CAAC,UAAU,CAAC,CAAC;QACzC,QAAQ,GAAG,sBAAe,CAAC,QAAQ,CAAC,CAAC;KACxC;IACD,IAAI,UAAU,GAAG,QAAQ,EAAE;QACvB,QAAQ,IAAI,GAAG,CAAC;KACnB;IAED,IAAI,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;IAC7B,IAAI,KAAK,GAAG,CAAC,EAAE;QACX,KAAK,IAAI,GAAG,CAAC;KAChB;IACD,OAAO,CAAC,KAAK,IAAI,UAAU,IAAI,KAAK,IAAI,QAAQ,CAAC;WAC1C,CAAC,KAAK,GAAG,GAAG,IAAI,UAAU,IAAI,KAAK,GAAG,GAAG,IAAI,QAAQ,CAAC,CAAC;AAClE,CAAC;AA1CD,sCA0CC"}
+1
View File
@@ -0,0 +1 @@
export declare function containStroke(x0: number, y0: number, x1: number, y1: number, x2: number, y2: number, x3: number, y3: number, lineWidth: number, x: number, y: number): boolean;
+15
View File
@@ -0,0 +1,15 @@
import * as curve from '../core/curve.js';
export function containStroke(x0, y0, x1, y1, x2, y2, x3, y3, lineWidth, x, y) {
if (lineWidth === 0) {
return false;
}
var _l = lineWidth;
if ((y > y0 + _l && y > y1 + _l && y > y2 + _l && y > y3 + _l)
|| (y < y0 - _l && y < y1 - _l && y < y2 - _l && y < y3 - _l)
|| (x > x0 + _l && x > x1 + _l && x > x2 + _l && x > x3 + _l)
|| (x < x0 - _l && x < x1 - _l && x < x2 - _l && x < x3 - _l)) {
return false;
}
var d = curve.cubicProjectPoint(x0, y0, x1, y1, x2, y2, x3, y3, x, y, null);
return d <= _l / 2;
}
+1
View File
@@ -0,0 +1 @@
{"version":3,"file":"cubic.js","sourceRoot":"","sources":["../../src/contain/cubic.ts"],"names":[],"mappings":";;AACA,qCAAuC;AAKvC,SAAgB,aAAa,CACzB,EAAU,EAAE,EAAU,EAAE,EAAU,EAAE,EAAU,EAC9C,EAAU,EAAE,EAAU,EAAE,EAAU,EAAE,EAAU,EAC9C,SAAiB,EAAE,CAAS,EAAE,CAAS;IAEvC,IAAI,SAAS,KAAK,CAAC,EAAE;QACjB,OAAO,KAAK,CAAC;KAChB;IACD,IAAM,EAAE,GAAG,SAAS,CAAC;IAErB,IACI,CAAC,CAAC,GAAG,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC;WACvD,CAAC,CAAC,GAAG,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC;WAC1D,CAAC,CAAC,GAAG,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC;WAC1D,CAAC,CAAC,GAAG,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC,EAC/D;QACE,OAAO,KAAK,CAAC;KAChB;IACD,IAAM,CAAC,GAAG,KAAK,CAAC,iBAAiB,CAC7B,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAC9B,CAAC,EAAE,CAAC,EAAE,IAAI,CACb,CAAC;IACF,OAAO,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC;AACvB,CAAC;AAvBD,sCAuBC"}
+1
View File
@@ -0,0 +1 @@
export declare function containStroke(x0: number, y0: number, x1: number, y1: number, lineWidth: number, x: number, y: number): boolean;
+24
View File
@@ -0,0 +1,24 @@
export function containStroke(x0, y0, x1, y1, lineWidth, x, y) {
if (lineWidth === 0) {
return false;
}
var _l = lineWidth;
var _a = 0;
var _b = x0;
if ((y > y0 + _l && y > y1 + _l)
|| (y < y0 - _l && y < y1 - _l)
|| (x > x0 + _l && x > x1 + _l)
|| (x < x0 - _l && x < x1 - _l)) {
return false;
}
if (x0 !== x1) {
_a = (y0 - y1) / (x0 - x1);
_b = (x0 * y1 - x1 * y0) / (x0 - x1);
}
else {
return Math.abs(x - x0) <= _l / 2;
}
var tmp = _a * x - y + _b;
var _s = tmp * tmp / (_a * _a + 1);
return _s <= _l / 2 * _l / 2;
}
+1
View File
@@ -0,0 +1 @@
{"version":3,"file":"line.js","sourceRoot":"","sources":["../../src/contain/line.ts"],"names":[],"mappings":";;AAYA,SAAgB,aAAa,CACzB,EAAU,EAAE,EAAU,EAAE,EAAU,EAAE,EAAU,EAC9C,SAAiB,EAAE,CAAS,EAAE,CAAS;IAEvC,IAAI,SAAS,KAAK,CAAC,EAAE;QACjB,OAAO,KAAK,CAAC;KAChB;IACD,IAAM,EAAE,GAAG,SAAS,CAAC;IACrB,IAAI,EAAE,GAAG,CAAC,CAAC;IACX,IAAI,EAAE,GAAG,EAAE,CAAC;IAEZ,IACI,CAAC,CAAC,GAAG,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC;WACzB,CAAC,CAAC,GAAG,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC;WAC5B,CAAC,CAAC,GAAG,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC;WAC5B,CAAC,CAAC,GAAG,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC,EACjC;QACE,OAAO,KAAK,CAAC;KAChB;IAED,IAAI,EAAE,KAAK,EAAE,EAAE;QACX,EAAE,GAAG,CAAC,EAAE,GAAG,EAAE,CAAC,GAAG,CAAC,EAAE,GAAG,EAAE,CAAC,CAAC;QAC3B,EAAE,GAAG,CAAC,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC,GAAG,CAAC,EAAE,GAAG,EAAE,CAAC,CAAC;KACxC;SACI;QACD,OAAO,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC;KACrC;IACD,IAAM,GAAG,GAAG,EAAE,GAAG,CAAC,GAAG,CAAC,GAAG,EAAE,CAAC;IAC5B,IAAM,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC,EAAE,GAAG,EAAE,GAAG,CAAC,CAAC,CAAC;IACrC,OAAO,EAAE,IAAI,EAAE,GAAG,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC;AACjC,CAAC;AA9BD,sCA8BC"}
+3
View File
@@ -0,0 +1,3 @@
import PathProxy from '../core/PathProxy';
export declare function contain(pathProxy: PathProxy, x: number, y: number): boolean;
export declare function containStroke(pathProxy: PathProxy, lineWidth: number, x: number, y: number): boolean;
+307
View File
@@ -0,0 +1,307 @@
import PathProxy from '../core/PathProxy.js';
import * as line from './line.js';
import * as cubic from './cubic.js';
import * as quadratic from './quadratic.js';
import * as arc from './arc.js';
import * as curve from '../core/curve.js';
import windingLine from './windingLine.js';
var CMD = PathProxy.CMD;
var PI2 = Math.PI * 2;
var EPSILON = 1e-4;
function isAroundEqual(a, b) {
return Math.abs(a - b) < EPSILON;
}
var roots = [-1, -1, -1];
var extrema = [-1, -1];
function swapExtrema() {
var tmp = extrema[0];
extrema[0] = extrema[1];
extrema[1] = tmp;
}
function windingCubic(x0, y0, x1, y1, x2, y2, x3, y3, x, y) {
if ((y > y0 && y > y1 && y > y2 && y > y3)
|| (y < y0 && y < y1 && y < y2 && y < y3)) {
return 0;
}
var nRoots = curve.cubicRootAt(y0, y1, y2, y3, y, roots);
if (nRoots === 0) {
return 0;
}
else {
var w = 0;
var nExtrema = -1;
var y0_ = void 0;
var y1_ = void 0;
for (var i = 0; i < nRoots; i++) {
var t = roots[i];
var unit = (t === 0 || t === 1) ? 0.5 : 1;
var x_ = curve.cubicAt(x0, x1, x2, x3, t);
if (x_ < x) {
continue;
}
if (nExtrema < 0) {
nExtrema = curve.cubicExtrema(y0, y1, y2, y3, extrema);
if (extrema[1] < extrema[0] && nExtrema > 1) {
swapExtrema();
}
y0_ = curve.cubicAt(y0, y1, y2, y3, extrema[0]);
if (nExtrema > 1) {
y1_ = curve.cubicAt(y0, y1, y2, y3, extrema[1]);
}
}
if (nExtrema === 2) {
if (t < extrema[0]) {
w += y0_ < y0 ? unit : -unit;
}
else if (t < extrema[1]) {
w += y1_ < y0_ ? unit : -unit;
}
else {
w += y3 < y1_ ? unit : -unit;
}
}
else {
if (t < extrema[0]) {
w += y0_ < y0 ? unit : -unit;
}
else {
w += y3 < y0_ ? unit : -unit;
}
}
}
return w;
}
}
function windingQuadratic(x0, y0, x1, y1, x2, y2, x, y) {
if ((y > y0 && y > y1 && y > y2)
|| (y < y0 && y < y1 && y < y2)) {
return 0;
}
var nRoots = curve.quadraticRootAt(y0, y1, y2, y, roots);
if (nRoots === 0) {
return 0;
}
else {
var t = curve.quadraticExtremum(y0, y1, y2);
if (t >= 0 && t <= 1) {
var w = 0;
var y_ = curve.quadraticAt(y0, y1, y2, t);
for (var i = 0; i < nRoots; i++) {
var unit = (roots[i] === 0 || roots[i] === 1) ? 0.5 : 1;
var x_ = curve.quadraticAt(x0, x1, x2, roots[i]);
if (x_ < x) {
continue;
}
if (roots[i] < t) {
w += y_ < y0 ? unit : -unit;
}
else {
w += y2 < y_ ? unit : -unit;
}
}
return w;
}
else {
var unit = (roots[0] === 0 || roots[0] === 1) ? 0.5 : 1;
var x_ = curve.quadraticAt(x0, x1, x2, roots[0]);
if (x_ < x) {
return 0;
}
return y2 < y0 ? unit : -unit;
}
}
}
function windingArc(cx, cy, r, startAngle, endAngle, anticlockwise, x, y) {
y -= cy;
if (y > r || y < -r) {
return 0;
}
var tmp = Math.sqrt(r * r - y * y);
roots[0] = -tmp;
roots[1] = tmp;
var dTheta = Math.abs(startAngle - endAngle);
if (dTheta < 1e-4) {
return 0;
}
if (dTheta >= PI2 - 1e-4) {
startAngle = 0;
endAngle = PI2;
var dir = anticlockwise ? 1 : -1;
if (x >= roots[0] + cx && x <= roots[1] + cx) {
return dir;
}
else {
return 0;
}
}
if (startAngle > endAngle) {
var tmp_1 = startAngle;
startAngle = endAngle;
endAngle = tmp_1;
}
if (startAngle < 0) {
startAngle += PI2;
endAngle += PI2;
}
var w = 0;
for (var i = 0; i < 2; i++) {
var x_ = roots[i];
if (x_ + cx > x) {
var angle = Math.atan2(y, x_);
var dir = anticlockwise ? 1 : -1;
if (angle < 0) {
angle = PI2 + angle;
}
if ((angle >= startAngle && angle <= endAngle)
|| (angle + PI2 >= startAngle && angle + PI2 <= endAngle)) {
if (angle > Math.PI / 2 && angle < Math.PI * 1.5) {
dir = -dir;
}
w += dir;
}
}
}
return w;
}
function containPath(path, lineWidth, isStroke, x, y) {
var data = path.data;
var len = path.len();
var w = 0;
var xi = 0;
var yi = 0;
var x0 = 0;
var y0 = 0;
var x1;
var y1;
for (var i = 0; i < len;) {
var cmd = data[i++];
var isFirst = i === 1;
if (cmd === CMD.M && i > 1) {
if (!isStroke) {
w += windingLine(xi, yi, x0, y0, x, y);
}
}
if (isFirst) {
xi = data[i];
yi = data[i + 1];
x0 = xi;
y0 = yi;
}
switch (cmd) {
case CMD.M:
x0 = data[i++];
y0 = data[i++];
xi = x0;
yi = y0;
break;
case CMD.L:
if (isStroke) {
if (line.containStroke(xi, yi, data[i], data[i + 1], lineWidth, x, y)) {
return true;
}
}
else {
w += windingLine(xi, yi, data[i], data[i + 1], x, y) || 0;
}
xi = data[i++];
yi = data[i++];
break;
case CMD.C:
if (isStroke) {
if (cubic.containStroke(xi, yi, data[i++], data[i++], data[i++], data[i++], data[i], data[i + 1], lineWidth, x, y)) {
return true;
}
}
else {
w += windingCubic(xi, yi, data[i++], data[i++], data[i++], data[i++], data[i], data[i + 1], x, y) || 0;
}
xi = data[i++];
yi = data[i++];
break;
case CMD.Q:
if (isStroke) {
if (quadratic.containStroke(xi, yi, data[i++], data[i++], data[i], data[i + 1], lineWidth, x, y)) {
return true;
}
}
else {
w += windingQuadratic(xi, yi, data[i++], data[i++], data[i], data[i + 1], x, y) || 0;
}
xi = data[i++];
yi = data[i++];
break;
case CMD.A:
var cx = data[i++];
var cy = data[i++];
var rx = data[i++];
var ry = data[i++];
var theta = data[i++];
var dTheta = data[i++];
i += 1;
var anticlockwise = !!(1 - data[i++]);
x1 = Math.cos(theta) * rx + cx;
y1 = Math.sin(theta) * ry + cy;
if (!isFirst) {
w += windingLine(xi, yi, x1, y1, x, y);
}
else {
x0 = x1;
y0 = y1;
}
var _x = (x - cx) * ry / rx + cx;
if (isStroke) {
if (arc.containStroke(cx, cy, ry, theta, theta + dTheta, anticlockwise, lineWidth, _x, y)) {
return true;
}
}
else {
w += windingArc(cx, cy, ry, theta, theta + dTheta, anticlockwise, _x, y);
}
xi = Math.cos(theta + dTheta) * rx + cx;
yi = Math.sin(theta + dTheta) * ry + cy;
break;
case CMD.R:
x0 = xi = data[i++];
y0 = yi = data[i++];
var width = data[i++];
var height = data[i++];
x1 = x0 + width;
y1 = y0 + height;
if (isStroke) {
if (line.containStroke(x0, y0, x1, y0, lineWidth, x, y)
|| line.containStroke(x1, y0, x1, y1, lineWidth, x, y)
|| line.containStroke(x1, y1, x0, y1, lineWidth, x, y)
|| line.containStroke(x0, y1, x0, y0, lineWidth, x, y)) {
return true;
}
}
else {
w += windingLine(x1, y0, x1, y1, x, y);
w += windingLine(x0, y1, x0, y0, x, y);
}
break;
case CMD.Z:
if (isStroke) {
if (line.containStroke(xi, yi, x0, y0, lineWidth, x, y)) {
return true;
}
}
else {
w += windingLine(xi, yi, x0, y0, x, y);
}
xi = x0;
yi = y0;
break;
}
}
if (!isStroke && !isAroundEqual(yi, y0)) {
w += windingLine(xi, yi, x0, y0, x, y) || 0;
}
return w !== 0;
}
export function contain(pathProxy, x, y) {
return containPath(pathProxy, 0, false, x, y);
}
export function containStroke(pathProxy, lineWidth, x, y) {
return containPath(pathProxy, lineWidth, true, x, y);
}
File diff suppressed because one or more lines are too long
+2
View File
@@ -0,0 +1,2 @@
import { VectorArray } from '../core/vector';
export declare function contain(points: VectorArray[], x: number, y: number): boolean;
+22
View File
@@ -0,0 +1,22 @@
import windingLine from './windingLine.js';
var EPSILON = 1e-8;
function isAroundEqual(a, b) {
return Math.abs(a - b) < EPSILON;
}
export function contain(points, x, y) {
var w = 0;
var p = points[0];
if (!p) {
return false;
}
for (var i = 1; i < points.length; i++) {
var p2 = points[i];
w += windingLine(p[0], p[1], p2[0], p2[1], x, y);
p = p2;
}
var p0 = points[0];
if (!isAroundEqual(p[0], p0[0]) || !isAroundEqual(p[1], p0[1])) {
w += windingLine(p[0], p[1], p0[0], p0[1], x, y);
}
return w !== 0;
}
+1
View File
@@ -0,0 +1 @@
{"version":3,"file":"polygon.js","sourceRoot":"","sources":["../../src/contain/polygon.ts"],"names":[],"mappings":";;AAAA,6CAAwC;AAGxC,IAAM,OAAO,GAAG,IAAI,CAAC;AAErB,SAAS,aAAa,CAAC,CAAS,EAAE,CAAS;IACvC,OAAO,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,OAAO,CAAC;AACrC,CAAC;AAED,SAAgB,OAAO,CAAC,MAAqB,EAAE,CAAS,EAAE,CAAS;IAC/D,IAAI,CAAC,GAAG,CAAC,CAAC;IACV,IAAI,CAAC,GAAG,MAAM,CAAC,CAAC,CAAC,CAAC;IAElB,IAAI,CAAC,CAAC,EAAE;QACJ,OAAO,KAAK,CAAC;KAChB;IAED,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;QACpC,IAAM,EAAE,GAAG,MAAM,CAAC,CAAC,CAAC,CAAC;QACrB,CAAC,IAAI,wBAAW,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;QACjD,CAAC,GAAG,EAAE,CAAC;KACV;IAGD,IAAM,EAAE,GAAG,MAAM,CAAC,CAAC,CAAC,CAAC;IACrB,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,EAAE;QAC5D,CAAC,IAAI,wBAAW,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;KACpD;IAED,OAAO,CAAC,KAAK,CAAC,CAAC;AACnB,CAAC;AArBD,0BAqBC"}
+1
View File
@@ -0,0 +1 @@
export declare function containStroke(x0: number, y0: number, x1: number, y1: number, x2: number, y2: number, lineWidth: number, x: number, y: number): boolean;
+15
View File
@@ -0,0 +1,15 @@
import { quadraticProjectPoint } from '../core/curve.js';
export function containStroke(x0, y0, x1, y1, x2, y2, lineWidth, x, y) {
if (lineWidth === 0) {
return false;
}
var _l = lineWidth;
if ((y > y0 + _l && y > y1 + _l && y > y2 + _l)
|| (y < y0 - _l && y < y1 - _l && y < y2 - _l)
|| (x > x0 + _l && x > x1 + _l && x > x2 + _l)
|| (x < x0 - _l && x < x1 - _l && x < x2 - _l)) {
return false;
}
var d = quadraticProjectPoint(x0, y0, x1, y1, x2, y2, x, y, null);
return d <= _l / 2;
}
+1
View File
@@ -0,0 +1 @@
{"version":3,"file":"quadratic.js","sourceRoot":"","sources":["../../src/contain/quadratic.ts"],"names":[],"mappings":";;AAAA,uCAAoD;AAKpD,SAAgB,aAAa,CACzB,EAAU,EAAE,EAAU,EAAE,EAAU,EAAE,EAAU,EAAE,EAAU,EAAE,EAAU,EACtE,SAAiB,EAAE,CAAS,EAAE,CAAS;IAEvC,IAAI,SAAS,KAAK,CAAC,EAAE;QACjB,OAAO,KAAK,CAAC;KAChB;IACD,IAAM,EAAE,GAAG,SAAS,CAAC;IAErB,IACI,CAAC,CAAC,GAAG,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC;WACxC,CAAC,CAAC,GAAG,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC;WAC3C,CAAC,CAAC,GAAG,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC;WAC3C,CAAC,CAAC,GAAG,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC,EAChD;QACE,OAAO,KAAK,CAAC;KAChB;IACD,IAAM,CAAC,GAAG,6BAAqB,CAC3B,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EACtB,CAAC,EAAE,CAAC,EAAE,IAAI,CACb,CAAC;IACF,OAAO,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC;AACvB,CAAC;AAtBD,sCAsBC"}
+23
View File
@@ -0,0 +1,23 @@
import BoundingRect, { RectLike } from '../core/BoundingRect';
import { TextAlign, TextVerticalAlign, BuiltinTextPosition } from '../core/types';
export declare function getWidth(text: string, font: string): number;
export declare function innerGetBoundingRect(text: string, font: string, textAlign?: TextAlign, textBaseline?: TextVerticalAlign): BoundingRect;
export declare function getBoundingRect(text: string, font: string, textAlign?: TextAlign, textBaseline?: TextVerticalAlign): BoundingRect;
export declare function adjustTextX(x: number, width: number, textAlign: TextAlign): number;
export declare function adjustTextY(y: number, height: number, verticalAlign: TextVerticalAlign): number;
export declare function getLineHeight(font?: string): number;
export declare function measureText(text: string, font?: string): {
width: number;
};
export declare function parsePercent(value: number | string, maxValue: number): number;
export interface TextPositionCalculationResult {
x: number;
y: number;
align: TextAlign;
verticalAlign: TextVerticalAlign;
}
export declare function calculateTextPosition(out: TextPositionCalculationResult, opts: {
position?: BuiltinTextPosition | (number | string)[];
distance?: number;
global?: boolean;
}, rect: RectLike): TextPositionCalculationResult;
+170
View File
@@ -0,0 +1,170 @@
import BoundingRect from '../core/BoundingRect.js';
import LRU from '../core/LRU.js';
import { DEFAULT_FONT, platformApi } from '../core/platform.js';
var textWidthCache = {};
export function getWidth(text, font) {
font = font || DEFAULT_FONT;
var cacheOfFont = textWidthCache[font];
if (!cacheOfFont) {
cacheOfFont = textWidthCache[font] = new LRU(500);
}
var width = cacheOfFont.get(text);
if (width == null) {
width = platformApi.measureText(text, font).width;
cacheOfFont.put(text, width);
}
return width;
}
export function innerGetBoundingRect(text, font, textAlign, textBaseline) {
var width = getWidth(text, font);
var height = getLineHeight(font);
var x = adjustTextX(0, width, textAlign);
var y = adjustTextY(0, height, textBaseline);
var rect = new BoundingRect(x, y, width, height);
return rect;
}
export function getBoundingRect(text, font, textAlign, textBaseline) {
var textLines = ((text || '') + '').split('\n');
var len = textLines.length;
if (len === 1) {
return innerGetBoundingRect(textLines[0], font, textAlign, textBaseline);
}
else {
var uniondRect = new BoundingRect(0, 0, 0, 0);
for (var i = 0; i < textLines.length; i++) {
var rect = innerGetBoundingRect(textLines[i], font, textAlign, textBaseline);
i === 0 ? uniondRect.copy(rect) : uniondRect.union(rect);
}
return uniondRect;
}
}
export function adjustTextX(x, width, textAlign) {
if (textAlign === 'right') {
x -= width;
}
else if (textAlign === 'center') {
x -= width / 2;
}
return x;
}
export function adjustTextY(y, height, verticalAlign) {
if (verticalAlign === 'middle') {
y -= height / 2;
}
else if (verticalAlign === 'bottom') {
y -= height;
}
return y;
}
export function getLineHeight(font) {
return getWidth('国', font);
}
export function measureText(text, font) {
return platformApi.measureText(text, font);
}
export function parsePercent(value, maxValue) {
if (typeof value === 'string') {
if (value.lastIndexOf('%') >= 0) {
return parseFloat(value) / 100 * maxValue;
}
return parseFloat(value);
}
return value;
}
export function calculateTextPosition(out, opts, rect) {
var textPosition = opts.position || 'inside';
var distance = opts.distance != null ? opts.distance : 5;
var height = rect.height;
var width = rect.width;
var halfHeight = height / 2;
var x = rect.x;
var y = rect.y;
var textAlign = 'left';
var textVerticalAlign = 'top';
if (textPosition instanceof Array) {
x += parsePercent(textPosition[0], rect.width);
y += parsePercent(textPosition[1], rect.height);
textAlign = null;
textVerticalAlign = null;
}
else {
switch (textPosition) {
case 'left':
x -= distance;
y += halfHeight;
textAlign = 'right';
textVerticalAlign = 'middle';
break;
case 'right':
x += distance + width;
y += halfHeight;
textVerticalAlign = 'middle';
break;
case 'top':
x += width / 2;
y -= distance;
textAlign = 'center';
textVerticalAlign = 'bottom';
break;
case 'bottom':
x += width / 2;
y += height + distance;
textAlign = 'center';
break;
case 'inside':
x += width / 2;
y += halfHeight;
textAlign = 'center';
textVerticalAlign = 'middle';
break;
case 'insideLeft':
x += distance;
y += halfHeight;
textVerticalAlign = 'middle';
break;
case 'insideRight':
x += width - distance;
y += halfHeight;
textAlign = 'right';
textVerticalAlign = 'middle';
break;
case 'insideTop':
x += width / 2;
y += distance;
textAlign = 'center';
break;
case 'insideBottom':
x += width / 2;
y += height - distance;
textAlign = 'center';
textVerticalAlign = 'bottom';
break;
case 'insideTopLeft':
x += distance;
y += distance;
break;
case 'insideTopRight':
x += width - distance;
y += distance;
textAlign = 'right';
break;
case 'insideBottomLeft':
x += distance;
y += height - distance;
textVerticalAlign = 'bottom';
break;
case 'insideBottomRight':
x += width - distance;
y += height - distance;
textAlign = 'right';
textVerticalAlign = 'bottom';
break;
}
}
out = out || {};
out.x = x;
out.y = y;
out.align = textAlign;
out.verticalAlign = textVerticalAlign;
return out;
}
File diff suppressed because one or more lines are too long
+1
View File
@@ -0,0 +1 @@
export declare function normalizeRadian(angle: number): number;
+8
View File
@@ -0,0 +1,8 @@
var PI2 = Math.PI * 2;
export function normalizeRadian(angle) {
angle %= PI2;
if (angle < 0) {
angle += PI2;
}
return angle;
}
+1
View File
@@ -0,0 +1 @@
{"version":3,"file":"util.js","sourceRoot":"","sources":["../../src/contain/util.ts"],"names":[],"mappings":";;AACA,IAAM,GAAG,GAAG,IAAI,CAAC,EAAE,GAAG,CAAC,CAAC;AAExB,SAAgB,eAAe,CAAC,KAAa;IACzC,KAAK,IAAI,GAAG,CAAC;IACb,IAAI,KAAK,GAAG,CAAC,EAAE;QACX,KAAK,IAAI,GAAG,CAAC;KAChB;IACD,OAAO,KAAK,CAAC;AACjB,CAAC;AAND,0CAMC"}
+1
View File
@@ -0,0 +1 @@
export default function windingLine(x0: number, y0: number, x1: number, y1: number, x: number, y: number): number;
+15
View File
@@ -0,0 +1,15 @@
export default function windingLine(x0, y0, x1, y1, x, y) {
if ((y > y0 && y > y1) || (y < y0 && y < y1)) {
return 0;
}
if (y1 === y0) {
return 0;
}
var t = (y - y0) / (y1 - y0);
var dir = y1 < y0 ? 1 : -1;
if (t === 1 || t === 0) {
dir = y1 < y0 ? 0.5 : -0.5;
}
var x_ = t * (x1 - x0) + x0;
return x_ === x ? Infinity : x_ > x ? dir : 0;
}
+1
View File
@@ -0,0 +1 @@
{"version":3,"file":"windingLine.js","sourceRoot":"","sources":["../../src/contain/windingLine.ts"],"names":[],"mappings":";;AACA,SAAwB,WAAW,CAC/B,EAAU,EAAE,EAAU,EAAE,EAAU,EAAE,EAAU,EAAE,CAAS,EAAE,CAAS;IAEpE,IAAI,CAAC,CAAC,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,CAAC,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,CAAC,EAAE;QAC1C,OAAO,CAAC,CAAC;KACZ;IAED,IAAI,EAAE,KAAK,EAAE,EAAE;QACX,OAAO,CAAC,CAAC;KACZ;IACD,IAAM,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,CAAC,GAAG,CAAC,EAAE,GAAG,EAAE,CAAC,CAAC;IAE/B,IAAI,GAAG,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IAE3B,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE;QACpB,GAAG,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC;KAC9B;IAED,IAAM,EAAE,GAAG,CAAC,GAAG,CAAC,EAAE,GAAG,EAAE,CAAC,GAAG,EAAE,CAAC;IAG9B,OAAO,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC;AAClD,CAAC;AAtBD,iCAsBC"}
+27
View File
@@ -0,0 +1,27 @@
import Element, { ElementOption } from '../Element';
import BoundingRect from '../core/BoundingRect';
import Storage from '../Storage';
export interface GroupOption extends ElementOption {
}
export default class Group extends Element {
isGroup: boolean;
type: string;
private _children;
__storage: Storage;
constructor(opts?: GroupOption);
children(): Element<ElementOption>[];
childAt(idx: number): Element;
childOfName(name: string): Element;
childCount(): number;
add(child: Element): Group;
addBefore(child: Element, nextSibling: Element): this;
_doAdd(child: Element): void;
remove(child: Element): this;
removeAll(): this;
eachChild<Context>(cb: (this: Context, el: Element, index?: number) => void, context?: Context): this;
traverse<T>(cb: (this: T, el: Element) => void, context?: T): this;
addChildrenToStorage(storage: Storage): void;
delChildrenFromStorage(storage: Storage): void;
dirty(): this;
getBoundingRect(includeChildren?: Element[]): BoundingRect;
}
+172
View File
@@ -0,0 +1,172 @@
"use strict";
exports.__esModule = true;
var tslib_1 = require("tslib");
var zrUtil = require("../core/util");
var Element_1 = require("../Element");
var BoundingRect_1 = require("../core/BoundingRect");
var Group = (function (_super) {
tslib_1.__extends(Group, _super);
function Group(opts) {
var _this = _super.call(this) || this;
_this.isGroup = true;
_this.type = 'group';
_this._children = [];
_this.attr(opts);
return _this;
}
Group.prototype.children = function () {
return this._children;
};
Group.prototype.childAt = function (idx) {
return this._children[idx];
};
Group.prototype.childOfName = function (name) {
var children = this._children;
for (var i = 0; i < children.length; i++) {
if (children[i].name === name) {
return children[i];
}
}
};
Group.prototype.childCount = function () {
return this._children.length;
};
Group.prototype.add = function (child) {
if (child && child !== this && child.parent !== this) {
this._children.push(child);
this._doAdd(child);
}
return this;
};
Group.prototype.addBefore = function (child, nextSibling) {
if (child && child !== this && child.parent !== this
&& nextSibling && nextSibling.parent === this) {
var children = this._children;
var idx = children.indexOf(nextSibling);
if (idx >= 0) {
children.splice(idx, 0, child);
this._doAdd(child);
}
}
return this;
};
Group.prototype._doAdd = function (child) {
if (child.parent) {
child.parent.remove(child);
}
child.parent = this;
var storage = this.__storage;
var zr = this.__zr;
if (storage && storage !== child.__storage) {
storage.addToStorage(child);
if (child instanceof Group) {
child.addChildrenToStorage(storage);
}
}
zr && zr.refresh();
};
Group.prototype.remove = function (child) {
var zr = this.__zr;
var storage = this.__storage;
var children = this._children;
var idx = zrUtil.indexOf(children, child);
if (idx < 0) {
return this;
}
children.splice(idx, 1);
child.parent = null;
if (storage) {
storage.delFromStorage(child);
if (child instanceof Group) {
child.delChildrenFromStorage(storage);
}
}
zr && zr.refresh();
return this;
};
Group.prototype.removeAll = function () {
var children = this._children;
var storage = this.__storage;
for (var i = 0; i < children.length; i++) {
var child = children[i];
if (storage) {
storage.delFromStorage(child);
if (child instanceof Group) {
child.delChildrenFromStorage(storage);
}
}
child.parent = null;
}
children.length = 0;
return this;
};
Group.prototype.eachChild = function (cb, context) {
var children = this._children;
for (var i = 0; i < children.length; i++) {
var child = children[i];
cb.call(context, child, i);
}
return this;
};
Group.prototype.traverse = function (cb, context) {
for (var i = 0; i < this._children.length; i++) {
var child = this._children[i];
cb.call(context, child);
if (child.type === 'group') {
child.traverse(cb, context);
}
}
return this;
};
Group.prototype.addChildrenToStorage = function (storage) {
for (var i = 0; i < this._children.length; i++) {
var child = this._children[i];
storage.addToStorage(child);
if (child instanceof Group) {
child.addChildrenToStorage(storage);
}
}
};
Group.prototype.delChildrenFromStorage = function (storage) {
for (var i = 0; i < this._children.length; i++) {
var child = this._children[i];
storage.delFromStorage(child);
if (child instanceof Group) {
child.delChildrenFromStorage(storage);
}
}
};
Group.prototype.dirty = function () {
this.__dirty = true;
this.__zr && this.__zr.refresh();
return this;
};
Group.prototype.getBoundingRect = function (includeChildren) {
var tmpRect = new BoundingRect_1["default"](0, 0, 0, 0);
var children = includeChildren || this._children;
var tmpMat = [];
var rect = null;
for (var i = 0; i < children.length; i++) {
var child = children[i];
if (child.ignore || child.invisible) {
continue;
}
var childRect = child.getBoundingRect();
var transform = child.getLocalTransform(tmpMat);
if (transform) {
tmpRect.copy(childRect);
tmpRect.applyTransform(transform);
rect = rect || tmpRect.clone();
rect.union(tmpRect);
}
else {
rect = rect || childRect.clone();
rect.union(childRect);
}
}
return rect || tmpRect;
};
return Group;
}(Element_1["default"]));
exports["default"] = Group;
//# sourceMappingURL=Group.js.map
File diff suppressed because one or more lines are too long
+29
View File
@@ -0,0 +1,29 @@
import * as matrix from './matrix';
import { PointLike } from './Point';
declare class BoundingRect {
x: number;
y: number;
width: number;
height: number;
constructor(x: number, y: number, width: number, height: number);
union(other: BoundingRect): void;
applyTransform(m: matrix.MatrixArray): void;
calculateTransform(b: RectLike): matrix.MatrixArray;
intersect(b: RectLike, mtv?: PointLike): boolean;
contain(x: number, y: number): boolean;
clone(): BoundingRect;
copy(other: RectLike): void;
plain(): RectLike;
isFinite(): boolean;
isZero(): boolean;
static create(rect: RectLike): BoundingRect;
static copy(target: RectLike, source: RectLike): void;
static applyTransform(target: RectLike, source: RectLike, m: matrix.MatrixArray): void;
}
export declare type RectLike = {
x: number;
y: number;
width: number;
height: number;
};
export default BoundingRect;
+215
View File
@@ -0,0 +1,215 @@
import * as matrix from './matrix.js';
import Point from './Point.js';
var mathMin = Math.min;
var mathMax = Math.max;
var lt = new Point();
var rb = new Point();
var lb = new Point();
var rt = new Point();
var minTv = new Point();
var maxTv = new Point();
var BoundingRect = (function () {
function BoundingRect(x, y, width, height) {
if (width < 0) {
x = x + width;
width = -width;
}
if (height < 0) {
y = y + height;
height = -height;
}
this.x = x;
this.y = y;
this.width = width;
this.height = height;
}
BoundingRect.prototype.union = function (other) {
var x = mathMin(other.x, this.x);
var y = mathMin(other.y, this.y);
if (isFinite(this.x) && isFinite(this.width)) {
this.width = mathMax(other.x + other.width, this.x + this.width) - x;
}
else {
this.width = other.width;
}
if (isFinite(this.y) && isFinite(this.height)) {
this.height = mathMax(other.y + other.height, this.y + this.height) - y;
}
else {
this.height = other.height;
}
this.x = x;
this.y = y;
};
BoundingRect.prototype.applyTransform = function (m) {
BoundingRect.applyTransform(this, this, m);
};
BoundingRect.prototype.calculateTransform = function (b) {
var a = this;
var sx = b.width / a.width;
var sy = b.height / a.height;
var m = matrix.create();
matrix.translate(m, m, [-a.x, -a.y]);
matrix.scale(m, m, [sx, sy]);
matrix.translate(m, m, [b.x, b.y]);
return m;
};
BoundingRect.prototype.intersect = function (b, mtv) {
if (!b) {
return false;
}
if (!(b instanceof BoundingRect)) {
b = BoundingRect.create(b);
}
var a = this;
var ax0 = a.x;
var ax1 = a.x + a.width;
var ay0 = a.y;
var ay1 = a.y + a.height;
var bx0 = b.x;
var bx1 = b.x + b.width;
var by0 = b.y;
var by1 = b.y + b.height;
var overlap = !(ax1 < bx0 || bx1 < ax0 || ay1 < by0 || by1 < ay0);
if (mtv) {
var dMin = Infinity;
var dMax = 0;
var d0 = Math.abs(ax1 - bx0);
var d1 = Math.abs(bx1 - ax0);
var d2 = Math.abs(ay1 - by0);
var d3 = Math.abs(by1 - ay0);
var dx = Math.min(d0, d1);
var dy = Math.min(d2, d3);
if (ax1 < bx0 || bx1 < ax0) {
if (dx > dMax) {
dMax = dx;
if (d0 < d1) {
Point.set(maxTv, -d0, 0);
}
else {
Point.set(maxTv, d1, 0);
}
}
}
else {
if (dx < dMin) {
dMin = dx;
if (d0 < d1) {
Point.set(minTv, d0, 0);
}
else {
Point.set(minTv, -d1, 0);
}
}
}
if (ay1 < by0 || by1 < ay0) {
if (dy > dMax) {
dMax = dy;
if (d2 < d3) {
Point.set(maxTv, 0, -d2);
}
else {
Point.set(maxTv, 0, d3);
}
}
}
else {
if (dx < dMin) {
dMin = dx;
if (d2 < d3) {
Point.set(minTv, 0, d2);
}
else {
Point.set(minTv, 0, -d3);
}
}
}
}
if (mtv) {
Point.copy(mtv, overlap ? minTv : maxTv);
}
return overlap;
};
BoundingRect.prototype.contain = function (x, y) {
var rect = this;
return x >= rect.x
&& x <= (rect.x + rect.width)
&& y >= rect.y
&& y <= (rect.y + rect.height);
};
BoundingRect.prototype.clone = function () {
return new BoundingRect(this.x, this.y, this.width, this.height);
};
BoundingRect.prototype.copy = function (other) {
BoundingRect.copy(this, other);
};
BoundingRect.prototype.plain = function () {
return {
x: this.x,
y: this.y,
width: this.width,
height: this.height
};
};
BoundingRect.prototype.isFinite = function () {
return isFinite(this.x)
&& isFinite(this.y)
&& isFinite(this.width)
&& isFinite(this.height);
};
BoundingRect.prototype.isZero = function () {
return this.width === 0 || this.height === 0;
};
BoundingRect.create = function (rect) {
return new BoundingRect(rect.x, rect.y, rect.width, rect.height);
};
BoundingRect.copy = function (target, source) {
target.x = source.x;
target.y = source.y;
target.width = source.width;
target.height = source.height;
};
BoundingRect.applyTransform = function (target, source, m) {
if (!m) {
if (target !== source) {
BoundingRect.copy(target, source);
}
return;
}
if (m[1] < 1e-5 && m[1] > -1e-5 && m[2] < 1e-5 && m[2] > -1e-5) {
var sx = m[0];
var sy = m[3];
var tx = m[4];
var ty = m[5];
target.x = source.x * sx + tx;
target.y = source.y * sy + ty;
target.width = source.width * sx;
target.height = source.height * sy;
if (target.width < 0) {
target.x += target.width;
target.width = -target.width;
}
if (target.height < 0) {
target.y += target.height;
target.height = -target.height;
}
return;
}
lt.x = lb.x = source.x;
lt.y = rt.y = source.y;
rb.x = rt.x = source.x + source.width;
rb.y = lb.y = source.y + source.height;
lt.transform(m);
rt.transform(m);
rb.transform(m);
lb.transform(m);
target.x = mathMin(lt.x, rb.x, lb.x, rt.x);
target.y = mathMin(lt.y, rb.y, lb.y, rt.y);
var maxX = mathMax(lt.x, rb.x, lb.x, rt.x);
var maxY = mathMax(lt.y, rb.y, lb.y, rt.y);
target.width = maxX - target.x;
target.height = maxY - target.y;
};
return BoundingRect;
}());
export default BoundingRect;
File diff suppressed because one or more lines are too long
+23
View File
@@ -0,0 +1,23 @@
import { Dictionary, WithThisType } from './types';
export declare type EventCallbackSingleParam<EvtParam = any> = EvtParam extends any ? (params: EvtParam) => boolean | void : never;
export declare type EventCallback<EvtParams = any[]> = EvtParams extends any[] ? (...args: EvtParams) => boolean | void : never;
export declare type EventQuery = string | Object;
declare type CbThis<Ctx, Impl> = unknown extends Ctx ? Impl : Ctx;
declare type DefaultEventDefinition = Dictionary<EventCallback<any[]>>;
export interface EventProcessor<EvtDef = DefaultEventDefinition> {
normalizeQuery?: (query: EventQuery) => EventQuery;
filter?: (eventType: keyof EvtDef, query: EventQuery) => boolean;
afterTrigger?: (eventType: keyof EvtDef) => void;
}
export default class Eventful<EvtDef extends DefaultEventDefinition = DefaultEventDefinition> {
private _$handlers;
protected _$eventProcessor: EventProcessor<EvtDef>;
constructor(eventProcessors?: EventProcessor<EvtDef>);
on<Ctx, EvtNm extends keyof EvtDef>(event: EvtNm, handler: WithThisType<EvtDef[EvtNm], CbThis<Ctx, this>>, context?: Ctx): this;
on<Ctx, EvtNm extends keyof EvtDef>(event: EvtNm, query: EventQuery, handler: WithThisType<EvtDef[EvtNm], CbThis<Ctx, this>>, context?: Ctx): this;
isSilent(eventName: keyof EvtDef): boolean;
off(eventType?: keyof EvtDef, handler?: Function): this;
trigger<EvtNm extends keyof EvtDef>(eventType: EvtNm, ...args: Parameters<EvtDef[EvtNm]>): this;
triggerWithContext(type: keyof EvtDef, ...args: any[]): this;
}
export {};
+162
View File
@@ -0,0 +1,162 @@
var Eventful = (function () {
function Eventful(eventProcessors) {
if (eventProcessors) {
this._$eventProcessor = eventProcessors;
}
}
Eventful.prototype.on = function (event, query, handler, context) {
if (!this._$handlers) {
this._$handlers = {};
}
var _h = this._$handlers;
if (typeof query === 'function') {
context = handler;
handler = query;
query = null;
}
if (!handler || !event) {
return this;
}
var eventProcessor = this._$eventProcessor;
if (query != null && eventProcessor && eventProcessor.normalizeQuery) {
query = eventProcessor.normalizeQuery(query);
}
if (!_h[event]) {
_h[event] = [];
}
for (var i = 0; i < _h[event].length; i++) {
if (_h[event][i].h === handler) {
return this;
}
}
var wrap = {
h: handler,
query: query,
ctx: (context || this),
callAtLast: handler.zrEventfulCallAtLast
};
var lastIndex = _h[event].length - 1;
var lastWrap = _h[event][lastIndex];
(lastWrap && lastWrap.callAtLast)
? _h[event].splice(lastIndex, 0, wrap)
: _h[event].push(wrap);
return this;
};
Eventful.prototype.isSilent = function (eventName) {
var _h = this._$handlers;
return !_h || !_h[eventName] || !_h[eventName].length;
};
Eventful.prototype.off = function (eventType, handler) {
var _h = this._$handlers;
if (!_h) {
return this;
}
if (!eventType) {
this._$handlers = {};
return this;
}
if (handler) {
if (_h[eventType]) {
var newList = [];
for (var i = 0, l = _h[eventType].length; i < l; i++) {
if (_h[eventType][i].h !== handler) {
newList.push(_h[eventType][i]);
}
}
_h[eventType] = newList;
}
if (_h[eventType] && _h[eventType].length === 0) {
delete _h[eventType];
}
}
else {
delete _h[eventType];
}
return this;
};
Eventful.prototype.trigger = function (eventType) {
var args = [];
for (var _i = 1; _i < arguments.length; _i++) {
args[_i - 1] = arguments[_i];
}
if (!this._$handlers) {
return this;
}
var _h = this._$handlers[eventType];
var eventProcessor = this._$eventProcessor;
if (_h) {
var argLen = args.length;
var len = _h.length;
for (var i = 0; i < len; i++) {
var hItem = _h[i];
if (eventProcessor
&& eventProcessor.filter
&& hItem.query != null
&& !eventProcessor.filter(eventType, hItem.query)) {
continue;
}
switch (argLen) {
case 0:
hItem.h.call(hItem.ctx);
break;
case 1:
hItem.h.call(hItem.ctx, args[0]);
break;
case 2:
hItem.h.call(hItem.ctx, args[0], args[1]);
break;
default:
hItem.h.apply(hItem.ctx, args);
break;
}
}
}
eventProcessor && eventProcessor.afterTrigger
&& eventProcessor.afterTrigger(eventType);
return this;
};
Eventful.prototype.triggerWithContext = function (type) {
var args = [];
for (var _i = 1; _i < arguments.length; _i++) {
args[_i - 1] = arguments[_i];
}
if (!this._$handlers) {
return this;
}
var _h = this._$handlers[type];
var eventProcessor = this._$eventProcessor;
if (_h) {
var argLen = args.length;
var ctx = args[argLen - 1];
var len = _h.length;
for (var i = 0; i < len; i++) {
var hItem = _h[i];
if (eventProcessor
&& eventProcessor.filter
&& hItem.query != null
&& !eventProcessor.filter(type, hItem.query)) {
continue;
}
switch (argLen) {
case 0:
hItem.h.call(ctx);
break;
case 1:
hItem.h.call(ctx, args[0]);
break;
case 2:
hItem.h.call(ctx, args[0], args[1]);
break;
default:
hItem.h.apply(ctx, args.slice(1, argLen - 1));
break;
}
}
}
eventProcessor && eventProcessor.afterTrigger
&& eventProcessor.afterTrigger(type);
return this;
};
return Eventful;
}());
export default Eventful;
File diff suppressed because one or more lines are too long
+18
View File
@@ -0,0 +1,18 @@
import { ZRRawTouchEvent } from './types';
import Displayable from '../graphic/Displayable';
export declare class GestureMgr {
private _track;
constructor();
recognize(event: ZRRawTouchEvent, target: Displayable, root: HTMLElement): {
type: string;
target: Displayable<import("../graphic/Displayable").DisplayableProps>;
event: ZRRawTouchEvent;
};
clear(): this;
_doTrack(event: ZRRawTouchEvent, target: Displayable, root: HTMLElement): void;
_recognize(event: ZRRawTouchEvent): {
type: string;
target: Displayable<import("../graphic/Displayable").DisplayableProps>;
event: ZRRawTouchEvent;
};
}
+82
View File
@@ -0,0 +1,82 @@
import * as eventUtil from './event.js';
var GestureMgr = (function () {
function GestureMgr() {
this._track = [];
}
GestureMgr.prototype.recognize = function (event, target, root) {
this._doTrack(event, target, root);
return this._recognize(event);
};
GestureMgr.prototype.clear = function () {
this._track.length = 0;
return this;
};
GestureMgr.prototype._doTrack = function (event, target, root) {
var touches = event.touches;
if (!touches) {
return;
}
var trackItem = {
points: [],
touches: [],
target: target,
event: event
};
for (var i = 0, len = touches.length; i < len; i++) {
var touch = touches[i];
var pos = eventUtil.clientToLocal(root, touch, {});
trackItem.points.push([pos.zrX, pos.zrY]);
trackItem.touches.push(touch);
}
this._track.push(trackItem);
};
GestureMgr.prototype._recognize = function (event) {
for (var eventName in recognizers) {
if (recognizers.hasOwnProperty(eventName)) {
var gestureInfo = recognizers[eventName](this._track, event);
if (gestureInfo) {
return gestureInfo;
}
}
}
};
return GestureMgr;
}());
export { GestureMgr };
function dist(pointPair) {
var dx = pointPair[1][0] - pointPair[0][0];
var dy = pointPair[1][1] - pointPair[0][1];
return Math.sqrt(dx * dx + dy * dy);
}
function center(pointPair) {
return [
(pointPair[0][0] + pointPair[1][0]) / 2,
(pointPair[0][1] + pointPair[1][1]) / 2
];
}
var recognizers = {
pinch: function (tracks, event) {
var trackLen = tracks.length;
if (!trackLen) {
return;
}
var pinchEnd = (tracks[trackLen - 1] || {}).points;
var pinchPre = (tracks[trackLen - 2] || {}).points || pinchEnd;
if (pinchPre
&& pinchPre.length > 1
&& pinchEnd
&& pinchEnd.length > 1) {
var pinchScale = dist(pinchEnd) / dist(pinchPre);
!isFinite(pinchScale) && (pinchScale = 1);
event.pinchScale = pinchScale;
var pinchCenter = center(pinchEnd);
event.pinchX = pinchCenter[0];
event.pinchY = pinchCenter[1];
return {
type: 'pinch',
target: tracks[0].target,
event: event
};
}
}
};
+1
View File
@@ -0,0 +1 @@
{"version":3,"file":"GestureMgr.js","sourceRoot":"","sources":["../../src/core/GestureMgr.ts"],"names":[],"mappings":"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"}
+28
View File
@@ -0,0 +1,28 @@
export declare class Entry<T> {
value: T;
key: string | number;
next: Entry<T>;
prev: Entry<T>;
constructor(val: T);
}
export declare class LinkedList<T> {
head: Entry<T>;
tail: Entry<T>;
private _len;
insert(val: T): Entry<T>;
insertEntry(entry: Entry<T>): void;
remove(entry: Entry<T>): void;
len(): number;
clear(): void;
}
export default class LRU<T> {
private _list;
private _maxSize;
private _lastRemovedEntry;
private _map;
constructor(maxSize: number);
put(key: string | number, value: T): T;
get(key: string | number): T;
clear(): void;
len(): number;
}
+110
View File
@@ -0,0 +1,110 @@
var Entry = (function () {
function Entry(val) {
this.value = val;
}
return Entry;
}());
export { Entry };
var LinkedList = (function () {
function LinkedList() {
this._len = 0;
}
LinkedList.prototype.insert = function (val) {
var entry = new Entry(val);
this.insertEntry(entry);
return entry;
};
LinkedList.prototype.insertEntry = function (entry) {
if (!this.head) {
this.head = this.tail = entry;
}
else {
this.tail.next = entry;
entry.prev = this.tail;
entry.next = null;
this.tail = entry;
}
this._len++;
};
LinkedList.prototype.remove = function (entry) {
var prev = entry.prev;
var next = entry.next;
if (prev) {
prev.next = next;
}
else {
this.head = next;
}
if (next) {
next.prev = prev;
}
else {
this.tail = prev;
}
entry.next = entry.prev = null;
this._len--;
};
LinkedList.prototype.len = function () {
return this._len;
};
LinkedList.prototype.clear = function () {
this.head = this.tail = null;
this._len = 0;
};
return LinkedList;
}());
export { LinkedList };
var LRU = (function () {
function LRU(maxSize) {
this._list = new LinkedList();
this._maxSize = 10;
this._map = {};
this._maxSize = maxSize;
}
LRU.prototype.put = function (key, value) {
var list = this._list;
var map = this._map;
var removed = null;
if (map[key] == null) {
var len = list.len();
var entry = this._lastRemovedEntry;
if (len >= this._maxSize && len > 0) {
var leastUsedEntry = list.head;
list.remove(leastUsedEntry);
delete map[leastUsedEntry.key];
removed = leastUsedEntry.value;
this._lastRemovedEntry = leastUsedEntry;
}
if (entry) {
entry.value = value;
}
else {
entry = new Entry(value);
}
entry.key = key;
list.insertEntry(entry);
map[key] = entry;
}
return removed;
};
LRU.prototype.get = function (key) {
var entry = this._map[key];
var list = this._list;
if (entry != null) {
if (entry !== list.tail) {
list.remove(entry);
list.insertEntry(entry);
}
return entry.value;
}
};
LRU.prototype.clear = function () {
this._list.clear();
this._map = {};
};
LRU.prototype.len = function () {
return this._list.len();
};
return LRU;
}());
export default LRU;
+1
View File
@@ -0,0 +1 @@
{"version":3,"file":"LRU.js","sourceRoot":"","sources":["../../src/core/LRU.ts"],"names":[],"mappings":"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"}
+14
View File
@@ -0,0 +1,14 @@
import { PointLike } from './Point';
import BoundingRect from './BoundingRect';
import { MatrixArray } from './matrix';
declare class OrientedBoundingRect {
private _corners;
private _axes;
private _origin;
constructor(rect?: BoundingRect, transform?: MatrixArray);
fromBoundingRect(rect: BoundingRect, transform?: MatrixArray): void;
intersect(other: OrientedBoundingRect, mtv?: PointLike): boolean;
private _intersectCheckOneSide;
private _getProjMinMaxOnAxis;
}
export default OrientedBoundingRect;
+120
View File
@@ -0,0 +1,120 @@
import Point from './Point.js';
var extent = [0, 0];
var extent2 = [0, 0];
var minTv = new Point();
var maxTv = new Point();
var OrientedBoundingRect = (function () {
function OrientedBoundingRect(rect, transform) {
this._corners = [];
this._axes = [];
this._origin = [0, 0];
for (var i = 0; i < 4; i++) {
this._corners[i] = new Point();
}
for (var i = 0; i < 2; i++) {
this._axes[i] = new Point();
}
if (rect) {
this.fromBoundingRect(rect, transform);
}
}
OrientedBoundingRect.prototype.fromBoundingRect = function (rect, transform) {
var corners = this._corners;
var axes = this._axes;
var x = rect.x;
var y = rect.y;
var x2 = x + rect.width;
var y2 = y + rect.height;
corners[0].set(x, y);
corners[1].set(x2, y);
corners[2].set(x2, y2);
corners[3].set(x, y2);
if (transform) {
for (var i = 0; i < 4; i++) {
corners[i].transform(transform);
}
}
Point.sub(axes[0], corners[1], corners[0]);
Point.sub(axes[1], corners[3], corners[0]);
axes[0].normalize();
axes[1].normalize();
for (var i = 0; i < 2; i++) {
this._origin[i] = axes[i].dot(corners[0]);
}
};
OrientedBoundingRect.prototype.intersect = function (other, mtv) {
var overlapped = true;
var noMtv = !mtv;
minTv.set(Infinity, Infinity);
maxTv.set(0, 0);
if (!this._intersectCheckOneSide(this, other, minTv, maxTv, noMtv, 1)) {
overlapped = false;
if (noMtv) {
return overlapped;
}
}
if (!this._intersectCheckOneSide(other, this, minTv, maxTv, noMtv, -1)) {
overlapped = false;
if (noMtv) {
return overlapped;
}
}
if (!noMtv) {
Point.copy(mtv, overlapped ? minTv : maxTv);
}
return overlapped;
};
OrientedBoundingRect.prototype._intersectCheckOneSide = function (self, other, minTv, maxTv, noMtv, inverse) {
var overlapped = true;
for (var i = 0; i < 2; i++) {
var axis = this._axes[i];
this._getProjMinMaxOnAxis(i, self._corners, extent);
this._getProjMinMaxOnAxis(i, other._corners, extent2);
if (extent[1] < extent2[0] || extent[0] > extent2[1]) {
overlapped = false;
if (noMtv) {
return overlapped;
}
var dist0 = Math.abs(extent2[0] - extent[1]);
var dist1 = Math.abs(extent[0] - extent2[1]);
if (Math.min(dist0, dist1) > maxTv.len()) {
if (dist0 < dist1) {
Point.scale(maxTv, axis, -dist0 * inverse);
}
else {
Point.scale(maxTv, axis, dist1 * inverse);
}
}
}
else if (minTv) {
var dist0 = Math.abs(extent2[0] - extent[1]);
var dist1 = Math.abs(extent[0] - extent2[1]);
if (Math.min(dist0, dist1) < minTv.len()) {
if (dist0 < dist1) {
Point.scale(minTv, axis, dist0 * inverse);
}
else {
Point.scale(minTv, axis, -dist1 * inverse);
}
}
}
}
return overlapped;
};
OrientedBoundingRect.prototype._getProjMinMaxOnAxis = function (dim, corners, out) {
var axis = this._axes[dim];
var origin = this._origin;
var proj = corners[0].dot(axis) + origin[dim];
var min = proj;
var max = proj;
for (var i = 1; i < corners.length; i++) {
var proj_1 = corners[i].dot(axis) + origin[dim];
min = Math.min(proj_1, min);
max = Math.max(proj_1, max);
}
out[0] = min;
out[1] = max;
};
return OrientedBoundingRect;
}());
export default OrientedBoundingRect;
File diff suppressed because one or more lines are too long
+75
View File
@@ -0,0 +1,75 @@
import BoundingRect from './BoundingRect';
interface ExtendedCanvasRenderingContext2D extends CanvasRenderingContext2D {
dpr?: number;
}
export declare function normalizeArcAngles(angles: number[], anticlockwise: boolean): void;
export default class PathProxy {
dpr: number;
data: number[] | Float32Array;
private _version;
private _saveData;
private _pendingPtX;
private _pendingPtY;
private _pendingPtDist;
private _ctx;
private _xi;
private _yi;
private _x0;
private _y0;
private _len;
private _pathSegLen;
private _pathLen;
private _ux;
private _uy;
static CMD: {
M: number;
L: number;
C: number;
Q: number;
A: number;
Z: number;
R: number;
};
constructor(notSaveData?: boolean);
increaseVersion(): void;
getVersion(): number;
setScale(sx: number, sy: number, segmentIgnoreThreshold?: number): void;
setDPR(dpr: number): void;
setContext(ctx: ExtendedCanvasRenderingContext2D): void;
getContext(): ExtendedCanvasRenderingContext2D;
beginPath(): this;
reset(): void;
moveTo(x: number, y: number): this;
lineTo(x: number, y: number): this;
bezierCurveTo(x1: number, y1: number, x2: number, y2: number, x3: number, y3: number): this;
quadraticCurveTo(x1: number, y1: number, x2: number, y2: number): this;
arc(cx: number, cy: number, r: number, startAngle: number, endAngle: number, anticlockwise?: boolean): this;
arcTo(x1: number, y1: number, x2: number, y2: number, radius: number): this;
rect(x: number, y: number, w: number, h: number): this;
closePath(): this;
fill(ctx: CanvasRenderingContext2D): void;
stroke(ctx: CanvasRenderingContext2D): void;
len(): number;
setData(data: Float32Array | number[]): void;
appendPath(path: PathProxy | PathProxy[]): void;
addData(cmd: number, a?: number, b?: number, c?: number, d?: number, e?: number, f?: number, g?: number, h?: number): void;
private _drawPendingPt;
private _expandData;
toStatic(): void;
getBoundingRect(): BoundingRect;
private _calculateLength;
rebuildPath(ctx: PathRebuilder, percent: number): void;
clone(): PathProxy;
private static initDefaultProps;
}
export interface PathRebuilder {
moveTo(x: number, y: number): void;
lineTo(x: number, y: number): void;
bezierCurveTo(x: number, y: number, x2: number, y2: number, x3: number, y3: number): void;
quadraticCurveTo(x: number, y: number, x2: number, y2: number): void;
arc(cx: number, cy: number, r: number, startAngle: number, endAngle: number, anticlockwise: boolean): void;
ellipse(cx: number, cy: number, radiusX: number, radiusY: number, rotation: number, startAngle: number, endAngle: number, anticlockwise: boolean): void;
rect(x: number, y: number, width: number, height: number): void;
closePath(): void;
}
export {};

Some files were not shown because too many files have changed in this diff Show More