逐步完成前后端服务器
This commit is contained in:
67
frontend/node_modules/zrender/lib/canvas/Layer.d.ts
generated
vendored
Normal file
67
frontend/node_modules/zrender/lib/canvas/Layer.d.ts
generated
vendored
Normal file
@ -0,0 +1,67 @@
|
||||
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;
|
||||
__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>;
|
||||
}
|
||||
297
frontend/node_modules/zrender/lib/canvas/Layer.js
generated
vendored
Normal file
297
frontend/node_modules/zrender/lib/canvas/Layer.js
generated
vendored
Normal file
@ -0,0 +1,297 @@
|
||||
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 && 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)) {
|
||||
var shouldCache = clearColor.global || (clearColor.__width === width
|
||||
&& clearColor.__height === height);
|
||||
clearColorGradientOrPattern = shouldCache
|
||||
&& clearColor.__canvasGradient
|
||||
|| getCanvasGradient(ctx, clearColor, {
|
||||
x: 0,
|
||||
y: 0,
|
||||
width: width,
|
||||
height: height
|
||||
});
|
||||
clearColor.__canvasGradient = clearColorGradientOrPattern;
|
||||
clearColor.__width = width;
|
||||
clearColor.__height = height;
|
||||
}
|
||||
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;
|
||||
72
frontend/node_modules/zrender/lib/canvas/Painter.d.ts
generated
vendored
Normal file
72
frontend/node_modules/zrender/lib/canvas/Painter.d.ts
generated
vendored
Normal 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
frontend/node_modules/zrender/lib/canvas/Painter.js
generated
vendored
Normal file
641
frontend/node_modules/zrender/lib/canvas/Painter.js
generated
vendored
Normal 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 || (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;
|
||||
;
|
||||
1
frontend/node_modules/zrender/lib/canvas/canvas.d.ts
generated
vendored
Normal file
1
frontend/node_modules/zrender/lib/canvas/canvas.d.ts
generated
vendored
Normal file
@ -0,0 +1 @@
|
||||
export {};
|
||||
3
frontend/node_modules/zrender/lib/canvas/canvas.js
generated
vendored
Normal file
3
frontend/node_modules/zrender/lib/canvas/canvas.js
generated
vendored
Normal file
@ -0,0 +1,3 @@
|
||||
import { registerPainter } from '../zrender.js';
|
||||
import Painter from './Painter.js';
|
||||
registerPainter('canvas', Painter);
|
||||
4
frontend/node_modules/zrender/lib/canvas/dashStyle.d.ts
generated
vendored
Normal file
4
frontend/node_modules/zrender/lib/canvas/dashStyle.d.ts
generated
vendored
Normal 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
frontend/node_modules/zrender/lib/canvas/dashStyle.js
generated
vendored
Normal file
27
frontend/node_modules/zrender/lib/canvas/dashStyle.js
generated
vendored
Normal 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
frontend/node_modules/zrender/lib/canvas/graphic.d.ts
generated
vendored
Normal file
19
frontend/node_modules/zrender/lib/canvas/graphic.d.ts
generated
vendored
Normal 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
frontend/node_modules/zrender/lib/canvas/graphic.js
generated
vendored
Normal file
558
frontend/node_modules/zrender/lib/canvas/graphic.js
generated
vendored
Normal 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();
|
||||
}
|
||||
13
frontend/node_modules/zrender/lib/canvas/helper.d.ts
generated
vendored
Normal file
13
frontend/node_modules/zrender/lib/canvas/helper.d.ts
generated
vendored
Normal 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
frontend/node_modules/zrender/lib/canvas/helper.js
generated
vendored
Normal file
79
frontend/node_modules/zrender/lib/canvas/helper.js
generated
vendored
Normal 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;
|
||||
}
|
||||
Reference in New Issue
Block a user