Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

@antv/g-plugin-image-loader

Package Overview
Dependencies
Maintainers
63
Versions
157
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@antv/g-plugin-image-loader - npm Package Compare versions

Comparing version 1.1.33 to 1.1.34

527

dist/index.esm.js

@@ -335,46 +335,7 @@ import { isBrowser, parsedTransformToMat4, parseTransform, GradientType, computeLinearGradient, computeRadialGradient, UnitType, Rect, ElementEvent, Shape, AbstractRendererPlugin } from '@antv/g-lite';

}
function _classCallCheck(instance, Constructor) {
if (!(instance instanceof Constructor)) {
throw new TypeError("Cannot call a class as a function");
}
function _inheritsLoose(subClass, superClass) {
subClass.prototype = Object.create(superClass.prototype);
subClass.prototype.constructor = subClass;
_setPrototypeOf(subClass, superClass);
}
function _defineProperties(target, props) {
for (var i = 0; i < props.length; i++) {
var descriptor = props[i];
descriptor.enumerable = descriptor.enumerable || false;
descriptor.configurable = true;
if ("value" in descriptor) descriptor.writable = true;
Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
}
}
function _createClass(Constructor, protoProps, staticProps) {
if (protoProps) _defineProperties(Constructor.prototype, protoProps);
if (staticProps) _defineProperties(Constructor, staticProps);
Object.defineProperty(Constructor, "prototype", {
writable: false
});
return Constructor;
}
function _inherits(subClass, superClass) {
if (typeof superClass !== "function" && superClass !== null) {
throw new TypeError("Super expression must either be null or a function");
}
subClass.prototype = Object.create(superClass && superClass.prototype, {
constructor: {
value: subClass,
writable: true,
configurable: true
}
});
Object.defineProperty(subClass, "prototype", {
writable: false
});
if (superClass) _setPrototypeOf(subClass, superClass);
}
function _getPrototypeOf(o) {
_getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) {
return o.__proto__ || Object.getPrototypeOf(o);
};
return _getPrototypeOf(o);
}
function _setPrototypeOf(o, p) {

@@ -387,55 +348,2 @@ _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) {

}
function _isNativeReflectConstruct() {
if (typeof Reflect === "undefined" || !Reflect.construct) return false;
if (Reflect.construct.sham) return false;
if (typeof Proxy === "function") return true;
try {
Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {}));
return true;
} catch (e) {
return false;
}
}
function _assertThisInitialized(self) {
if (self === void 0) {
throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
}
return self;
}
function _possibleConstructorReturn(self, call) {
if (call && (typeof call === "object" || typeof call === "function")) {
return call;
} else if (call !== void 0) {
throw new TypeError("Derived constructors may only return object or undefined");
}
return _assertThisInitialized(self);
}
function _createSuper(Derived) {
var hasNativeReflectConstruct = _isNativeReflectConstruct();
return function _createSuperInternal() {
var Super = _getPrototypeOf(Derived),
result;
if (hasNativeReflectConstruct) {
var NewTarget = _getPrototypeOf(this).constructor;
result = Reflect.construct(Super, arguments, NewTarget);
} else {
result = Super.apply(this, arguments);
}
return _possibleConstructorReturn(this, result);
};
}
function _toPrimitive(input, hint) {
if (typeof input !== "object" || input === null) return input;
var prim = input[Symbol.toPrimitive];
if (prim !== undefined) {
var res = prim.call(input, hint || "default");
if (typeof res !== "object") return res;
throw new TypeError("@@toPrimitive must return a primitive value.");
}
return (hint === "string" ? String : Number)(input);
}
function _toPropertyKey(arg) {
var key = _toPrimitive(arg, "string");
return typeof key === "symbol" ? key : String(key);
}

@@ -553,3 +461,2 @@ /**

function ImagePool(canvasConfig) {
_classCallCheck(this, ImagePool);
this.canvasConfig = void 0;

@@ -561,170 +468,158 @@ this.imageCache = {};

}
_createClass(ImagePool, [{
key: "getImageSync",
value: function getImageSync(src, callback) {
if (!this.imageCache[src]) {
this.getOrCreateImage(src).then(function () {
if (callback) {
callback();
}
});
} else {
var _proto = ImagePool.prototype;
_proto.getImageSync = function getImageSync(src, callback) {
if (!this.imageCache[src]) {
this.getOrCreateImage(src).then(function () {
if (callback) {
callback();
}
});
} else {
if (callback) {
callback();
}
return this.imageCache[src];
}
}, {
key: "getOrCreateImage",
value: function getOrCreateImage(src) {
var _this = this;
if (this.imageCache[src]) {
return Promise.resolve(this.imageCache[src]);
return this.imageCache[src];
};
_proto.getOrCreateImage = function getOrCreateImage(src) {
var _this = this;
if (this.imageCache[src]) {
return Promise.resolve(this.imageCache[src]);
}
// @see https://github.com/antvis/g/issues/938
var createImage = this.canvasConfig.createImage;
return new Promise(function (resolve, reject) {
var image;
if (createImage) {
image = createImage(src);
} else if (isBrowser) {
image = new window.Image();
}
// @see https://github.com/antvis/g/issues/938
var createImage = this.canvasConfig.createImage;
return new Promise(function (resolve, reject) {
var image;
if (createImage) {
image = createImage(src);
} else if (isBrowser) {
image = new window.Image();
}
if (image) {
image.onload = function () {
resolve(image);
};
image.onerror = function (ev) {
reject(ev);
};
image.crossOrigin = 'Anonymous';
image.src = src;
_this.imageCache[src] = image;
}
});
if (image) {
image.onload = function () {
resolve(image);
};
image.onerror = function (ev) {
reject(ev);
};
image.crossOrigin = 'Anonymous';
image.src = src;
_this.imageCache[src] = image;
}
});
};
_proto.getOrCreatePatternSync = function getOrCreatePatternSync(pattern, context, $offscreenCanvas, dpr, callback) {
var patternKey = this.generatePatternKey(pattern);
if (patternKey && this.patternCache[patternKey]) {
return this.patternCache[patternKey];
}
}, {
key: "getOrCreatePatternSync",
value: function getOrCreatePatternSync(pattern, context, $offscreenCanvas, dpr, callback) {
var patternKey = this.generatePatternKey(pattern);
if (patternKey && this.patternCache[patternKey]) {
return this.patternCache[patternKey];
}
var image = pattern.image,
repetition = pattern.repetition,
transform = pattern.transform;
var src;
var needScaleWithDPR = false;
// Image URL
if (isString(image)) {
src = this.getImageSync(image, callback);
} else if ($offscreenCanvas) {
src = $offscreenCanvas;
needScaleWithDPR = true;
var image = pattern.image,
repetition = pattern.repetition,
transform = pattern.transform;
var src;
var needScaleWithDPR = false;
// Image URL
if (isString(image)) {
src = this.getImageSync(image, callback);
} else if ($offscreenCanvas) {
src = $offscreenCanvas;
needScaleWithDPR = true;
} else {
src = image;
}
// @see https://developer.mozilla.org/zh-CN/docs/Web/API/CanvasRenderingContext2D/createPattern
var canvasPattern = src && context.createPattern(src, repetition);
if (canvasPattern) {
var mat;
// @see https://developer.mozilla.org/en-US/docs/Web/API/CanvasPattern/setTransform
if (transform) {
mat = parsedTransformToMat4(parseTransform(transform));
} else {
src = image;
mat = identity(create());
}
// @see https://developer.mozilla.org/zh-CN/docs/Web/API/CanvasRenderingContext2D/createPattern
var canvasPattern = src && context.createPattern(src, repetition);
if (canvasPattern) {
var mat;
// @see https://developer.mozilla.org/en-US/docs/Web/API/CanvasPattern/setTransform
if (transform) {
mat = parsedTransformToMat4(parseTransform(transform));
} else {
mat = identity(create());
}
if (needScaleWithDPR) {
scale(mat, mat, [1 / dpr, 1 / dpr, 1]);
}
canvasPattern.setTransform({
a: mat[0],
b: mat[1],
c: mat[4],
d: mat[5],
e: mat[12],
f: mat[13]
});
if (needScaleWithDPR) {
scale(mat, mat, [1 / dpr, 1 / dpr, 1]);
}
if (patternKey && canvasPattern) {
this.patternCache[patternKey] = canvasPattern;
}
return canvasPattern;
canvasPattern.setTransform({
a: mat[0],
b: mat[1],
c: mat[4],
d: mat[5],
e: mat[12],
f: mat[13]
});
}
}, {
key: "getOrCreateGradient",
value: function getOrCreateGradient(params, context) {
var key = this.generateGradientKey(params);
var type = params.type,
steps = params.steps,
width = params.width,
height = params.height,
angle = params.angle,
cx = params.cx,
cy = params.cy,
size = params.size;
if (this.gradientCache[key]) {
return this.gradientCache[key];
}
var gradient = null;
if (type === GradientType.LinearGradient) {
var _computeLinearGradien = computeLinearGradient(width, height, angle),
x1 = _computeLinearGradien.x1,
y1 = _computeLinearGradien.y1,
x2 = _computeLinearGradien.x2,
y2 = _computeLinearGradien.y2;
// @see https://developer.mozilla.org/zh-CN/docs/Web/API/CanvasRenderingContext2D/createLinearGradient
gradient = context.createLinearGradient(x1, y1, x2, y2);
} else if (type === GradientType.RadialGradient) {
var _computeRadialGradien = computeRadialGradient(width, height, cx, cy, size),
x = _computeRadialGradien.x,
y = _computeRadialGradien.y,
r = _computeRadialGradien.r;
// @see https://developer.mozilla.org/zh-CN/docs/Web/API/CanvasRenderingContext2D/createRadialGradient
gradient = context.createRadialGradient(x, y, 0, x, y, r);
}
if (gradient) {
steps.forEach(function (_ref) {
var offset = _ref.offset,
color = _ref.color;
if (offset.unit === UnitType.kPercentage) {
var _gradient;
(_gradient = gradient) === null || _gradient === void 0 ? void 0 : _gradient.addColorStop(offset.value / 100, color.toString());
}
});
this.gradientCache[key] = gradient;
}
if (patternKey && canvasPattern) {
this.patternCache[patternKey] = canvasPattern;
}
return canvasPattern;
};
_proto.getOrCreateGradient = function getOrCreateGradient(params, context) {
var key = this.generateGradientKey(params);
var type = params.type,
steps = params.steps,
width = params.width,
height = params.height,
angle = params.angle,
cx = params.cx,
cy = params.cy,
size = params.size;
if (this.gradientCache[key]) {
return this.gradientCache[key];
}
}, {
key: "generateGradientKey",
value: function generateGradientKey(params) {
var type = params.type,
width = params.width,
height = params.height,
steps = params.steps,
angle = params.angle,
cx = params.cx,
cy = params.cy,
size = params.size;
return "gradient-".concat(type, "-").concat((angle === null || angle === void 0 ? void 0 : angle.toString()) || 0, "-").concat((cx === null || cx === void 0 ? void 0 : cx.toString()) || 0, "-").concat((cy === null || cy === void 0 ? void 0 : cy.toString()) || 0, "-").concat((size === null || size === void 0 ? void 0 : size.toString()) || 0, "-").concat(width, "-").concat(height, "-").concat(steps.map(function (_ref2) {
var offset = _ref2.offset,
color = _ref2.color;
return "".concat(offset).concat(color);
}).join('-'));
var gradient = null;
if (type === GradientType.LinearGradient) {
var _computeLinearGradien = computeLinearGradient(width, height, angle),
x1 = _computeLinearGradien.x1,
y1 = _computeLinearGradien.y1,
x2 = _computeLinearGradien.x2,
y2 = _computeLinearGradien.y2;
// @see https://developer.mozilla.org/zh-CN/docs/Web/API/CanvasRenderingContext2D/createLinearGradient
gradient = context.createLinearGradient(x1, y1, x2, y2);
} else if (type === GradientType.RadialGradient) {
var _computeRadialGradien = computeRadialGradient(width, height, cx, cy, size),
x = _computeRadialGradien.x,
y = _computeRadialGradien.y,
r = _computeRadialGradien.r;
// @see https://developer.mozilla.org/zh-CN/docs/Web/API/CanvasRenderingContext2D/createRadialGradient
gradient = context.createRadialGradient(x, y, 0, x, y, r);
}
}, {
key: "generatePatternKey",
value: function generatePatternKey(pattern) {
var image = pattern.image,
repetition = pattern.repetition;
// only generate cache for Image
if (isString(image)) {
return "pattern-".concat(image, "-").concat(repetition);
} else if (image instanceof Rect) {
return "pattern-".concat(image.entity, "-").concat(repetition);
}
if (gradient) {
steps.forEach(function (_ref) {
var offset = _ref.offset,
color = _ref.color;
if (offset.unit === UnitType.kPercentage) {
var _gradient;
(_gradient = gradient) === null || _gradient === void 0 ? void 0 : _gradient.addColorStop(offset.value / 100, color.toString());
}
});
this.gradientCache[key] = gradient;
}
}]);
return this.gradientCache[key];
};
_proto.generateGradientKey = function generateGradientKey(params) {
var type = params.type,
width = params.width,
height = params.height,
steps = params.steps,
angle = params.angle,
cx = params.cx,
cy = params.cy,
size = params.size;
return "gradient-" + type + "-" + ((angle === null || angle === void 0 ? void 0 : angle.toString()) || 0) + "-" + ((cx === null || cx === void 0 ? void 0 : cx.toString()) || 0) + "-" + ((cy === null || cy === void 0 ? void 0 : cy.toString()) || 0) + "-" + ((size === null || size === void 0 ? void 0 : size.toString()) || 0) + "-" + width + "-" + height + "-" + steps.map(function (_ref2) {
var offset = _ref2.offset,
color = _ref2.color;
return "" + offset + color;
}).join('-');
};
_proto.generatePatternKey = function generatePatternKey(pattern) {
var image = pattern.image,
repetition = pattern.repetition;
// only generate cache for Image
if (isString(image)) {
return "pattern-" + image + "-" + repetition;
} else if (image instanceof Rect) {
return "pattern-" + image.entity + "-" + repetition;
}
};
return ImagePool;

@@ -734,21 +629,33 @@ }();

var LoadImagePlugin = /*#__PURE__*/function () {
function LoadImagePlugin() {
_classCallCheck(this, LoadImagePlugin);
}
_createClass(LoadImagePlugin, [{
key: "apply",
value: function apply(context) {
// @ts-ignore
var renderingService = context.renderingService,
renderingContext = context.renderingContext,
imagePool = context.imagePool;
var canvas = renderingContext.root.ownerDocument.defaultView;
var handleMounted = function handleMounted(e) {
var object = e.target;
var nodeName = object.nodeName,
attributes = object.attributes;
if (nodeName === Shape.IMAGE) {
var img = attributes.img;
if (isString(img)) {
imagePool.getImageSync(img, function () {
function LoadImagePlugin() {}
var _proto = LoadImagePlugin.prototype;
_proto.apply = function apply(context) {
// @ts-ignore
var renderingService = context.renderingService,
renderingContext = context.renderingContext,
imagePool = context.imagePool;
var canvas = renderingContext.root.ownerDocument.defaultView;
var handleMounted = function handleMounted(e) {
var object = e.target;
var nodeName = object.nodeName,
attributes = object.attributes;
if (nodeName === Shape.IMAGE) {
var img = attributes.img;
if (isString(img)) {
imagePool.getImageSync(img, function () {
// set dirty rectangle flag
object.renderable.dirty = true;
renderingService.dirtify();
});
}
}
};
var handleAttributeChanged = function handleAttributeChanged(e) {
var object = e.target;
var attrName = e.attrName,
newValue = e.newValue;
if (object.nodeName === Shape.IMAGE) {
if (attrName === 'img') {
if (isString(newValue)) {
imagePool.getOrCreateImage(newValue).then(function () {
// set dirty rectangle flag

@@ -760,39 +667,23 @@ object.renderable.dirty = true;

}
};
var handleAttributeChanged = function handleAttributeChanged(e) {
var object = e.target;
var attrName = e.attrName,
newValue = e.newValue;
if (object.nodeName === Shape.IMAGE) {
if (attrName === 'img') {
if (isString(newValue)) {
imagePool.getOrCreateImage(newValue).then(function () {
// set dirty rectangle flag
object.renderable.dirty = true;
renderingService.dirtify();
});
}
}
};
renderingService.hooks.init.tapPromise(LoadImagePlugin.tag, /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
return _regeneratorRuntime().wrap(function _callee$(_context) {
while (1) {
switch (_context.prev = _context.next) {
case 0:
canvas.addEventListener(ElementEvent.MOUNTED, handleMounted);
canvas.addEventListener(ElementEvent.ATTR_MODIFIED, handleAttributeChanged);
case 2:
case "end":
return _context.stop();
}
}
};
renderingService.hooks.init.tapPromise(LoadImagePlugin.tag, /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
return _regeneratorRuntime().wrap(function _callee$(_context) {
while (1) {
switch (_context.prev = _context.next) {
case 0:
canvas.addEventListener(ElementEvent.MOUNTED, handleMounted);
canvas.addEventListener(ElementEvent.ATTR_MODIFIED, handleAttributeChanged);
case 2:
case "end":
return _context.stop();
}
}
}, _callee);
})));
renderingService.hooks.destroy.tap(LoadImagePlugin.tag, function () {
canvas.removeEventListener(ElementEvent.MOUNTED, handleMounted);
canvas.removeEventListener(ElementEvent.ATTR_MODIFIED, handleAttributeChanged);
});
}
}]);
}, _callee);
})));
renderingService.hooks.destroy.tap(LoadImagePlugin.tag, function () {
canvas.removeEventListener(ElementEvent.MOUNTED, handleMounted);
canvas.removeEventListener(ElementEvent.ATTR_MODIFIED, handleAttributeChanged);
});
};
return LoadImagePlugin;

@@ -803,27 +694,21 @@ }();

var Plugin = /*#__PURE__*/function (_AbstractRendererPlug) {
_inherits(Plugin, _AbstractRendererPlug);
var _super = _createSuper(Plugin);
_inheritsLoose(Plugin, _AbstractRendererPlug);
function Plugin() {
var _this;
_classCallCheck(this, Plugin);
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
_this = _super.call.apply(_super, [this].concat(args));
_this = _AbstractRendererPlug.call.apply(_AbstractRendererPlug, [this].concat(args)) || this;
_this.name = 'image-loader';
return _this;
}
_createClass(Plugin, [{
key: "init",
value: function init() {
// @ts-ignore
this.context.imagePool = new ImagePool(this.context.config);
this.addRenderingPlugin(new LoadImagePlugin());
}
}, {
key: "destroy",
value: function destroy() {
this.removeAllRenderingPlugins();
}
}]);
var _proto = Plugin.prototype;
_proto.init = function init() {
// @ts-ignore
this.context.imagePool = new ImagePool(this.context.config);
this.addRenderingPlugin(new LoadImagePlugin());
};
_proto.destroy = function destroy() {
this.removeAllRenderingPlugins();
};
return Plugin;

@@ -830,0 +715,0 @@ }(AbstractRendererPlugin);

527

dist/index.js

@@ -339,46 +339,7 @@ 'use strict';

}
function _classCallCheck(instance, Constructor) {
if (!(instance instanceof Constructor)) {
throw new TypeError("Cannot call a class as a function");
}
function _inheritsLoose(subClass, superClass) {
subClass.prototype = Object.create(superClass.prototype);
subClass.prototype.constructor = subClass;
_setPrototypeOf(subClass, superClass);
}
function _defineProperties(target, props) {
for (var i = 0; i < props.length; i++) {
var descriptor = props[i];
descriptor.enumerable = descriptor.enumerable || false;
descriptor.configurable = true;
if ("value" in descriptor) descriptor.writable = true;
Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
}
}
function _createClass(Constructor, protoProps, staticProps) {
if (protoProps) _defineProperties(Constructor.prototype, protoProps);
if (staticProps) _defineProperties(Constructor, staticProps);
Object.defineProperty(Constructor, "prototype", {
writable: false
});
return Constructor;
}
function _inherits(subClass, superClass) {
if (typeof superClass !== "function" && superClass !== null) {
throw new TypeError("Super expression must either be null or a function");
}
subClass.prototype = Object.create(superClass && superClass.prototype, {
constructor: {
value: subClass,
writable: true,
configurable: true
}
});
Object.defineProperty(subClass, "prototype", {
writable: false
});
if (superClass) _setPrototypeOf(subClass, superClass);
}
function _getPrototypeOf(o) {
_getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) {
return o.__proto__ || Object.getPrototypeOf(o);
};
return _getPrototypeOf(o);
}
function _setPrototypeOf(o, p) {

@@ -391,55 +352,2 @@ _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) {

}
function _isNativeReflectConstruct() {
if (typeof Reflect === "undefined" || !Reflect.construct) return false;
if (Reflect.construct.sham) return false;
if (typeof Proxy === "function") return true;
try {
Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {}));
return true;
} catch (e) {
return false;
}
}
function _assertThisInitialized(self) {
if (self === void 0) {
throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
}
return self;
}
function _possibleConstructorReturn(self, call) {
if (call && (typeof call === "object" || typeof call === "function")) {
return call;
} else if (call !== void 0) {
throw new TypeError("Derived constructors may only return object or undefined");
}
return _assertThisInitialized(self);
}
function _createSuper(Derived) {
var hasNativeReflectConstruct = _isNativeReflectConstruct();
return function _createSuperInternal() {
var Super = _getPrototypeOf(Derived),
result;
if (hasNativeReflectConstruct) {
var NewTarget = _getPrototypeOf(this).constructor;
result = Reflect.construct(Super, arguments, NewTarget);
} else {
result = Super.apply(this, arguments);
}
return _possibleConstructorReturn(this, result);
};
}
function _toPrimitive(input, hint) {
if (typeof input !== "object" || input === null) return input;
var prim = input[Symbol.toPrimitive];
if (prim !== undefined) {
var res = prim.call(input, hint || "default");
if (typeof res !== "object") return res;
throw new TypeError("@@toPrimitive must return a primitive value.");
}
return (hint === "string" ? String : Number)(input);
}
function _toPropertyKey(arg) {
var key = _toPrimitive(arg, "string");
return typeof key === "symbol" ? key : String(key);
}

@@ -557,3 +465,2 @@ /**

function ImagePool(canvasConfig) {
_classCallCheck(this, ImagePool);
this.canvasConfig = void 0;

@@ -565,170 +472,158 @@ this.imageCache = {};

}
_createClass(ImagePool, [{
key: "getImageSync",
value: function getImageSync(src, callback) {
if (!this.imageCache[src]) {
this.getOrCreateImage(src).then(function () {
if (callback) {
callback();
}
});
} else {
var _proto = ImagePool.prototype;
_proto.getImageSync = function getImageSync(src, callback) {
if (!this.imageCache[src]) {
this.getOrCreateImage(src).then(function () {
if (callback) {
callback();
}
});
} else {
if (callback) {
callback();
}
return this.imageCache[src];
}
}, {
key: "getOrCreateImage",
value: function getOrCreateImage(src) {
var _this = this;
if (this.imageCache[src]) {
return Promise.resolve(this.imageCache[src]);
return this.imageCache[src];
};
_proto.getOrCreateImage = function getOrCreateImage(src) {
var _this = this;
if (this.imageCache[src]) {
return Promise.resolve(this.imageCache[src]);
}
// @see https://github.com/antvis/g/issues/938
var createImage = this.canvasConfig.createImage;
return new Promise(function (resolve, reject) {
var image;
if (createImage) {
image = createImage(src);
} else if (gLite.isBrowser) {
image = new window.Image();
}
// @see https://github.com/antvis/g/issues/938
var createImage = this.canvasConfig.createImage;
return new Promise(function (resolve, reject) {
var image;
if (createImage) {
image = createImage(src);
} else if (gLite.isBrowser) {
image = new window.Image();
}
if (image) {
image.onload = function () {
resolve(image);
};
image.onerror = function (ev) {
reject(ev);
};
image.crossOrigin = 'Anonymous';
image.src = src;
_this.imageCache[src] = image;
}
});
if (image) {
image.onload = function () {
resolve(image);
};
image.onerror = function (ev) {
reject(ev);
};
image.crossOrigin = 'Anonymous';
image.src = src;
_this.imageCache[src] = image;
}
});
};
_proto.getOrCreatePatternSync = function getOrCreatePatternSync(pattern, context, $offscreenCanvas, dpr, callback) {
var patternKey = this.generatePatternKey(pattern);
if (patternKey && this.patternCache[patternKey]) {
return this.patternCache[patternKey];
}
}, {
key: "getOrCreatePatternSync",
value: function getOrCreatePatternSync(pattern, context, $offscreenCanvas, dpr, callback) {
var patternKey = this.generatePatternKey(pattern);
if (patternKey && this.patternCache[patternKey]) {
return this.patternCache[patternKey];
}
var image = pattern.image,
repetition = pattern.repetition,
transform = pattern.transform;
var src;
var needScaleWithDPR = false;
// Image URL
if (util.isString(image)) {
src = this.getImageSync(image, callback);
} else if ($offscreenCanvas) {
src = $offscreenCanvas;
needScaleWithDPR = true;
var image = pattern.image,
repetition = pattern.repetition,
transform = pattern.transform;
var src;
var needScaleWithDPR = false;
// Image URL
if (util.isString(image)) {
src = this.getImageSync(image, callback);
} else if ($offscreenCanvas) {
src = $offscreenCanvas;
needScaleWithDPR = true;
} else {
src = image;
}
// @see https://developer.mozilla.org/zh-CN/docs/Web/API/CanvasRenderingContext2D/createPattern
var canvasPattern = src && context.createPattern(src, repetition);
if (canvasPattern) {
var mat;
// @see https://developer.mozilla.org/en-US/docs/Web/API/CanvasPattern/setTransform
if (transform) {
mat = gLite.parsedTransformToMat4(gLite.parseTransform(transform));
} else {
src = image;
mat = identity(create());
}
// @see https://developer.mozilla.org/zh-CN/docs/Web/API/CanvasRenderingContext2D/createPattern
var canvasPattern = src && context.createPattern(src, repetition);
if (canvasPattern) {
var mat;
// @see https://developer.mozilla.org/en-US/docs/Web/API/CanvasPattern/setTransform
if (transform) {
mat = gLite.parsedTransformToMat4(gLite.parseTransform(transform));
} else {
mat = identity(create());
}
if (needScaleWithDPR) {
scale(mat, mat, [1 / dpr, 1 / dpr, 1]);
}
canvasPattern.setTransform({
a: mat[0],
b: mat[1],
c: mat[4],
d: mat[5],
e: mat[12],
f: mat[13]
});
if (needScaleWithDPR) {
scale(mat, mat, [1 / dpr, 1 / dpr, 1]);
}
if (patternKey && canvasPattern) {
this.patternCache[patternKey] = canvasPattern;
}
return canvasPattern;
canvasPattern.setTransform({
a: mat[0],
b: mat[1],
c: mat[4],
d: mat[5],
e: mat[12],
f: mat[13]
});
}
}, {
key: "getOrCreateGradient",
value: function getOrCreateGradient(params, context) {
var key = this.generateGradientKey(params);
var type = params.type,
steps = params.steps,
width = params.width,
height = params.height,
angle = params.angle,
cx = params.cx,
cy = params.cy,
size = params.size;
if (this.gradientCache[key]) {
return this.gradientCache[key];
}
var gradient = null;
if (type === gLite.GradientType.LinearGradient) {
var _computeLinearGradien = gLite.computeLinearGradient(width, height, angle),
x1 = _computeLinearGradien.x1,
y1 = _computeLinearGradien.y1,
x2 = _computeLinearGradien.x2,
y2 = _computeLinearGradien.y2;
// @see https://developer.mozilla.org/zh-CN/docs/Web/API/CanvasRenderingContext2D/createLinearGradient
gradient = context.createLinearGradient(x1, y1, x2, y2);
} else if (type === gLite.GradientType.RadialGradient) {
var _computeRadialGradien = gLite.computeRadialGradient(width, height, cx, cy, size),
x = _computeRadialGradien.x,
y = _computeRadialGradien.y,
r = _computeRadialGradien.r;
// @see https://developer.mozilla.org/zh-CN/docs/Web/API/CanvasRenderingContext2D/createRadialGradient
gradient = context.createRadialGradient(x, y, 0, x, y, r);
}
if (gradient) {
steps.forEach(function (_ref) {
var offset = _ref.offset,
color = _ref.color;
if (offset.unit === gLite.UnitType.kPercentage) {
var _gradient;
(_gradient = gradient) === null || _gradient === void 0 ? void 0 : _gradient.addColorStop(offset.value / 100, color.toString());
}
});
this.gradientCache[key] = gradient;
}
if (patternKey && canvasPattern) {
this.patternCache[patternKey] = canvasPattern;
}
return canvasPattern;
};
_proto.getOrCreateGradient = function getOrCreateGradient(params, context) {
var key = this.generateGradientKey(params);
var type = params.type,
steps = params.steps,
width = params.width,
height = params.height,
angle = params.angle,
cx = params.cx,
cy = params.cy,
size = params.size;
if (this.gradientCache[key]) {
return this.gradientCache[key];
}
}, {
key: "generateGradientKey",
value: function generateGradientKey(params) {
var type = params.type,
width = params.width,
height = params.height,
steps = params.steps,
angle = params.angle,
cx = params.cx,
cy = params.cy,
size = params.size;
return "gradient-".concat(type, "-").concat((angle === null || angle === void 0 ? void 0 : angle.toString()) || 0, "-").concat((cx === null || cx === void 0 ? void 0 : cx.toString()) || 0, "-").concat((cy === null || cy === void 0 ? void 0 : cy.toString()) || 0, "-").concat((size === null || size === void 0 ? void 0 : size.toString()) || 0, "-").concat(width, "-").concat(height, "-").concat(steps.map(function (_ref2) {
var offset = _ref2.offset,
color = _ref2.color;
return "".concat(offset).concat(color);
}).join('-'));
var gradient = null;
if (type === gLite.GradientType.LinearGradient) {
var _computeLinearGradien = gLite.computeLinearGradient(width, height, angle),
x1 = _computeLinearGradien.x1,
y1 = _computeLinearGradien.y1,
x2 = _computeLinearGradien.x2,
y2 = _computeLinearGradien.y2;
// @see https://developer.mozilla.org/zh-CN/docs/Web/API/CanvasRenderingContext2D/createLinearGradient
gradient = context.createLinearGradient(x1, y1, x2, y2);
} else if (type === gLite.GradientType.RadialGradient) {
var _computeRadialGradien = gLite.computeRadialGradient(width, height, cx, cy, size),
x = _computeRadialGradien.x,
y = _computeRadialGradien.y,
r = _computeRadialGradien.r;
// @see https://developer.mozilla.org/zh-CN/docs/Web/API/CanvasRenderingContext2D/createRadialGradient
gradient = context.createRadialGradient(x, y, 0, x, y, r);
}
}, {
key: "generatePatternKey",
value: function generatePatternKey(pattern) {
var image = pattern.image,
repetition = pattern.repetition;
// only generate cache for Image
if (util.isString(image)) {
return "pattern-".concat(image, "-").concat(repetition);
} else if (image instanceof gLite.Rect) {
return "pattern-".concat(image.entity, "-").concat(repetition);
}
if (gradient) {
steps.forEach(function (_ref) {
var offset = _ref.offset,
color = _ref.color;
if (offset.unit === gLite.UnitType.kPercentage) {
var _gradient;
(_gradient = gradient) === null || _gradient === void 0 ? void 0 : _gradient.addColorStop(offset.value / 100, color.toString());
}
});
this.gradientCache[key] = gradient;
}
}]);
return this.gradientCache[key];
};
_proto.generateGradientKey = function generateGradientKey(params) {
var type = params.type,
width = params.width,
height = params.height,
steps = params.steps,
angle = params.angle,
cx = params.cx,
cy = params.cy,
size = params.size;
return "gradient-" + type + "-" + ((angle === null || angle === void 0 ? void 0 : angle.toString()) || 0) + "-" + ((cx === null || cx === void 0 ? void 0 : cx.toString()) || 0) + "-" + ((cy === null || cy === void 0 ? void 0 : cy.toString()) || 0) + "-" + ((size === null || size === void 0 ? void 0 : size.toString()) || 0) + "-" + width + "-" + height + "-" + steps.map(function (_ref2) {
var offset = _ref2.offset,
color = _ref2.color;
return "" + offset + color;
}).join('-');
};
_proto.generatePatternKey = function generatePatternKey(pattern) {
var image = pattern.image,
repetition = pattern.repetition;
// only generate cache for Image
if (util.isString(image)) {
return "pattern-" + image + "-" + repetition;
} else if (image instanceof gLite.Rect) {
return "pattern-" + image.entity + "-" + repetition;
}
};
return ImagePool;

@@ -738,21 +633,33 @@ }();

var LoadImagePlugin = /*#__PURE__*/function () {
function LoadImagePlugin() {
_classCallCheck(this, LoadImagePlugin);
}
_createClass(LoadImagePlugin, [{
key: "apply",
value: function apply(context) {
// @ts-ignore
var renderingService = context.renderingService,
renderingContext = context.renderingContext,
imagePool = context.imagePool;
var canvas = renderingContext.root.ownerDocument.defaultView;
var handleMounted = function handleMounted(e) {
var object = e.target;
var nodeName = object.nodeName,
attributes = object.attributes;
if (nodeName === gLite.Shape.IMAGE) {
var img = attributes.img;
if (util.isString(img)) {
imagePool.getImageSync(img, function () {
function LoadImagePlugin() {}
var _proto = LoadImagePlugin.prototype;
_proto.apply = function apply(context) {
// @ts-ignore
var renderingService = context.renderingService,
renderingContext = context.renderingContext,
imagePool = context.imagePool;
var canvas = renderingContext.root.ownerDocument.defaultView;
var handleMounted = function handleMounted(e) {
var object = e.target;
var nodeName = object.nodeName,
attributes = object.attributes;
if (nodeName === gLite.Shape.IMAGE) {
var img = attributes.img;
if (util.isString(img)) {
imagePool.getImageSync(img, function () {
// set dirty rectangle flag
object.renderable.dirty = true;
renderingService.dirtify();
});
}
}
};
var handleAttributeChanged = function handleAttributeChanged(e) {
var object = e.target;
var attrName = e.attrName,
newValue = e.newValue;
if (object.nodeName === gLite.Shape.IMAGE) {
if (attrName === 'img') {
if (util.isString(newValue)) {
imagePool.getOrCreateImage(newValue).then(function () {
// set dirty rectangle flag

@@ -764,39 +671,23 @@ object.renderable.dirty = true;

}
};
var handleAttributeChanged = function handleAttributeChanged(e) {
var object = e.target;
var attrName = e.attrName,
newValue = e.newValue;
if (object.nodeName === gLite.Shape.IMAGE) {
if (attrName === 'img') {
if (util.isString(newValue)) {
imagePool.getOrCreateImage(newValue).then(function () {
// set dirty rectangle flag
object.renderable.dirty = true;
renderingService.dirtify();
});
}
}
};
renderingService.hooks.init.tapPromise(LoadImagePlugin.tag, /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
return _regeneratorRuntime().wrap(function _callee$(_context) {
while (1) {
switch (_context.prev = _context.next) {
case 0:
canvas.addEventListener(gLite.ElementEvent.MOUNTED, handleMounted);
canvas.addEventListener(gLite.ElementEvent.ATTR_MODIFIED, handleAttributeChanged);
case 2:
case "end":
return _context.stop();
}
}
};
renderingService.hooks.init.tapPromise(LoadImagePlugin.tag, /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
return _regeneratorRuntime().wrap(function _callee$(_context) {
while (1) {
switch (_context.prev = _context.next) {
case 0:
canvas.addEventListener(gLite.ElementEvent.MOUNTED, handleMounted);
canvas.addEventListener(gLite.ElementEvent.ATTR_MODIFIED, handleAttributeChanged);
case 2:
case "end":
return _context.stop();
}
}
}, _callee);
})));
renderingService.hooks.destroy.tap(LoadImagePlugin.tag, function () {
canvas.removeEventListener(gLite.ElementEvent.MOUNTED, handleMounted);
canvas.removeEventListener(gLite.ElementEvent.ATTR_MODIFIED, handleAttributeChanged);
});
}
}]);
}, _callee);
})));
renderingService.hooks.destroy.tap(LoadImagePlugin.tag, function () {
canvas.removeEventListener(gLite.ElementEvent.MOUNTED, handleMounted);
canvas.removeEventListener(gLite.ElementEvent.ATTR_MODIFIED, handleAttributeChanged);
});
};
return LoadImagePlugin;

@@ -807,27 +698,21 @@ }();

var Plugin = /*#__PURE__*/function (_AbstractRendererPlug) {
_inherits(Plugin, _AbstractRendererPlug);
var _super = _createSuper(Plugin);
_inheritsLoose(Plugin, _AbstractRendererPlug);
function Plugin() {
var _this;
_classCallCheck(this, Plugin);
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
_this = _super.call.apply(_super, [this].concat(args));
_this = _AbstractRendererPlug.call.apply(_AbstractRendererPlug, [this].concat(args)) || this;
_this.name = 'image-loader';
return _this;
}
_createClass(Plugin, [{
key: "init",
value: function init() {
// @ts-ignore
this.context.imagePool = new ImagePool(this.context.config);
this.addRenderingPlugin(new LoadImagePlugin());
}
}, {
key: "destroy",
value: function destroy() {
this.removeAllRenderingPlugins();
}
}]);
var _proto = Plugin.prototype;
_proto.init = function init() {
// @ts-ignore
this.context.imagePool = new ImagePool(this.context.config);
this.addRenderingPlugin(new LoadImagePlugin());
};
_proto.destroy = function destroy() {
this.removeAllRenderingPlugins();
};
return Plugin;

@@ -834,0 +719,0 @@ }(gLite.AbstractRendererPlugin);

527

dist/index.umd.js

@@ -338,46 +338,7 @@ (function (global, factory) {

}
function _classCallCheck(instance, Constructor) {
if (!(instance instanceof Constructor)) {
throw new TypeError("Cannot call a class as a function");
}
function _inheritsLoose(subClass, superClass) {
subClass.prototype = Object.create(superClass.prototype);
subClass.prototype.constructor = subClass;
_setPrototypeOf(subClass, superClass);
}
function _defineProperties(target, props) {
for (var i = 0; i < props.length; i++) {
var descriptor = props[i];
descriptor.enumerable = descriptor.enumerable || false;
descriptor.configurable = true;
if ("value" in descriptor) descriptor.writable = true;
Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
}
}
function _createClass(Constructor, protoProps, staticProps) {
if (protoProps) _defineProperties(Constructor.prototype, protoProps);
if (staticProps) _defineProperties(Constructor, staticProps);
Object.defineProperty(Constructor, "prototype", {
writable: false
});
return Constructor;
}
function _inherits(subClass, superClass) {
if (typeof superClass !== "function" && superClass !== null) {
throw new TypeError("Super expression must either be null or a function");
}
subClass.prototype = Object.create(superClass && superClass.prototype, {
constructor: {
value: subClass,
writable: true,
configurable: true
}
});
Object.defineProperty(subClass, "prototype", {
writable: false
});
if (superClass) _setPrototypeOf(subClass, superClass);
}
function _getPrototypeOf(o) {
_getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) {
return o.__proto__ || Object.getPrototypeOf(o);
};
return _getPrototypeOf(o);
}
function _setPrototypeOf(o, p) {

@@ -390,55 +351,2 @@ _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) {

}
function _isNativeReflectConstruct() {
if (typeof Reflect === "undefined" || !Reflect.construct) return false;
if (Reflect.construct.sham) return false;
if (typeof Proxy === "function") return true;
try {
Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {}));
return true;
} catch (e) {
return false;
}
}
function _assertThisInitialized(self) {
if (self === void 0) {
throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
}
return self;
}
function _possibleConstructorReturn(self, call) {
if (call && (typeof call === "object" || typeof call === "function")) {
return call;
} else if (call !== void 0) {
throw new TypeError("Derived constructors may only return object or undefined");
}
return _assertThisInitialized(self);
}
function _createSuper(Derived) {
var hasNativeReflectConstruct = _isNativeReflectConstruct();
return function _createSuperInternal() {
var Super = _getPrototypeOf(Derived),
result;
if (hasNativeReflectConstruct) {
var NewTarget = _getPrototypeOf(this).constructor;
result = Reflect.construct(Super, arguments, NewTarget);
} else {
result = Super.apply(this, arguments);
}
return _possibleConstructorReturn(this, result);
};
}
function _toPrimitive(input, hint) {
if (typeof input !== "object" || input === null) return input;
var prim = input[Symbol.toPrimitive];
if (prim !== undefined) {
var res = prim.call(input, hint || "default");
if (typeof res !== "object") return res;
throw new TypeError("@@toPrimitive must return a primitive value.");
}
return (hint === "string" ? String : Number)(input);
}
function _toPropertyKey(arg) {
var key = _toPrimitive(arg, "string");
return typeof key === "symbol" ? key : String(key);
}

@@ -563,3 +471,2 @@ /**

function ImagePool(canvasConfig) {
_classCallCheck(this, ImagePool);
this.canvasConfig = void 0;

@@ -571,170 +478,158 @@ this.imageCache = {};

}
_createClass(ImagePool, [{
key: "getImageSync",
value: function getImageSync(src, callback) {
if (!this.imageCache[src]) {
this.getOrCreateImage(src).then(function () {
if (callback) {
callback();
}
});
} else {
var _proto = ImagePool.prototype;
_proto.getImageSync = function getImageSync(src, callback) {
if (!this.imageCache[src]) {
this.getOrCreateImage(src).then(function () {
if (callback) {
callback();
}
});
} else {
if (callback) {
callback();
}
return this.imageCache[src];
}
}, {
key: "getOrCreateImage",
value: function getOrCreateImage(src) {
var _this = this;
if (this.imageCache[src]) {
return Promise.resolve(this.imageCache[src]);
return this.imageCache[src];
};
_proto.getOrCreateImage = function getOrCreateImage(src) {
var _this = this;
if (this.imageCache[src]) {
return Promise.resolve(this.imageCache[src]);
}
// @see https://github.com/antvis/g/issues/938
var createImage = this.canvasConfig.createImage;
return new Promise(function (resolve, reject) {
var image;
if (createImage) {
image = createImage(src);
} else if (gLite.isBrowser) {
image = new window.Image();
}
// @see https://github.com/antvis/g/issues/938
var createImage = this.canvasConfig.createImage;
return new Promise(function (resolve, reject) {
var image;
if (createImage) {
image = createImage(src);
} else if (gLite.isBrowser) {
image = new window.Image();
}
if (image) {
image.onload = function () {
resolve(image);
};
image.onerror = function (ev) {
reject(ev);
};
image.crossOrigin = 'Anonymous';
image.src = src;
_this.imageCache[src] = image;
}
});
if (image) {
image.onload = function () {
resolve(image);
};
image.onerror = function (ev) {
reject(ev);
};
image.crossOrigin = 'Anonymous';
image.src = src;
_this.imageCache[src] = image;
}
});
};
_proto.getOrCreatePatternSync = function getOrCreatePatternSync(pattern, context, $offscreenCanvas, dpr, callback) {
var patternKey = this.generatePatternKey(pattern);
if (patternKey && this.patternCache[patternKey]) {
return this.patternCache[patternKey];
}
}, {
key: "getOrCreatePatternSync",
value: function getOrCreatePatternSync(pattern, context, $offscreenCanvas, dpr, callback) {
var patternKey = this.generatePatternKey(pattern);
if (patternKey && this.patternCache[patternKey]) {
return this.patternCache[patternKey];
}
var image = pattern.image,
repetition = pattern.repetition,
transform = pattern.transform;
var src;
var needScaleWithDPR = false;
// Image URL
if (isString(image)) {
src = this.getImageSync(image, callback);
} else if ($offscreenCanvas) {
src = $offscreenCanvas;
needScaleWithDPR = true;
var image = pattern.image,
repetition = pattern.repetition,
transform = pattern.transform;
var src;
var needScaleWithDPR = false;
// Image URL
if (isString(image)) {
src = this.getImageSync(image, callback);
} else if ($offscreenCanvas) {
src = $offscreenCanvas;
needScaleWithDPR = true;
} else {
src = image;
}
// @see https://developer.mozilla.org/zh-CN/docs/Web/API/CanvasRenderingContext2D/createPattern
var canvasPattern = src && context.createPattern(src, repetition);
if (canvasPattern) {
var mat;
// @see https://developer.mozilla.org/en-US/docs/Web/API/CanvasPattern/setTransform
if (transform) {
mat = gLite.parsedTransformToMat4(gLite.parseTransform(transform));
} else {
src = image;
mat = identity(create());
}
// @see https://developer.mozilla.org/zh-CN/docs/Web/API/CanvasRenderingContext2D/createPattern
var canvasPattern = src && context.createPattern(src, repetition);
if (canvasPattern) {
var mat;
// @see https://developer.mozilla.org/en-US/docs/Web/API/CanvasPattern/setTransform
if (transform) {
mat = gLite.parsedTransformToMat4(gLite.parseTransform(transform));
} else {
mat = identity(create());
}
if (needScaleWithDPR) {
scale(mat, mat, [1 / dpr, 1 / dpr, 1]);
}
canvasPattern.setTransform({
a: mat[0],
b: mat[1],
c: mat[4],
d: mat[5],
e: mat[12],
f: mat[13]
});
if (needScaleWithDPR) {
scale(mat, mat, [1 / dpr, 1 / dpr, 1]);
}
if (patternKey && canvasPattern) {
this.patternCache[patternKey] = canvasPattern;
}
return canvasPattern;
canvasPattern.setTransform({
a: mat[0],
b: mat[1],
c: mat[4],
d: mat[5],
e: mat[12],
f: mat[13]
});
}
}, {
key: "getOrCreateGradient",
value: function getOrCreateGradient(params, context) {
var key = this.generateGradientKey(params);
var type = params.type,
steps = params.steps,
width = params.width,
height = params.height,
angle = params.angle,
cx = params.cx,
cy = params.cy,
size = params.size;
if (this.gradientCache[key]) {
return this.gradientCache[key];
}
var gradient = null;
if (type === gLite.GradientType.LinearGradient) {
var _computeLinearGradien = gLite.computeLinearGradient(width, height, angle),
x1 = _computeLinearGradien.x1,
y1 = _computeLinearGradien.y1,
x2 = _computeLinearGradien.x2,
y2 = _computeLinearGradien.y2;
// @see https://developer.mozilla.org/zh-CN/docs/Web/API/CanvasRenderingContext2D/createLinearGradient
gradient = context.createLinearGradient(x1, y1, x2, y2);
} else if (type === gLite.GradientType.RadialGradient) {
var _computeRadialGradien = gLite.computeRadialGradient(width, height, cx, cy, size),
x = _computeRadialGradien.x,
y = _computeRadialGradien.y,
r = _computeRadialGradien.r;
// @see https://developer.mozilla.org/zh-CN/docs/Web/API/CanvasRenderingContext2D/createRadialGradient
gradient = context.createRadialGradient(x, y, 0, x, y, r);
}
if (gradient) {
steps.forEach(function (_ref) {
var offset = _ref.offset,
color = _ref.color;
if (offset.unit === gLite.UnitType.kPercentage) {
var _gradient;
(_gradient = gradient) === null || _gradient === void 0 ? void 0 : _gradient.addColorStop(offset.value / 100, color.toString());
}
});
this.gradientCache[key] = gradient;
}
if (patternKey && canvasPattern) {
this.patternCache[patternKey] = canvasPattern;
}
return canvasPattern;
};
_proto.getOrCreateGradient = function getOrCreateGradient(params, context) {
var key = this.generateGradientKey(params);
var type = params.type,
steps = params.steps,
width = params.width,
height = params.height,
angle = params.angle,
cx = params.cx,
cy = params.cy,
size = params.size;
if (this.gradientCache[key]) {
return this.gradientCache[key];
}
}, {
key: "generateGradientKey",
value: function generateGradientKey(params) {
var type = params.type,
width = params.width,
height = params.height,
steps = params.steps,
angle = params.angle,
cx = params.cx,
cy = params.cy,
size = params.size;
return "gradient-".concat(type, "-").concat((angle === null || angle === void 0 ? void 0 : angle.toString()) || 0, "-").concat((cx === null || cx === void 0 ? void 0 : cx.toString()) || 0, "-").concat((cy === null || cy === void 0 ? void 0 : cy.toString()) || 0, "-").concat((size === null || size === void 0 ? void 0 : size.toString()) || 0, "-").concat(width, "-").concat(height, "-").concat(steps.map(function (_ref2) {
var offset = _ref2.offset,
color = _ref2.color;
return "".concat(offset).concat(color);
}).join('-'));
var gradient = null;
if (type === gLite.GradientType.LinearGradient) {
var _computeLinearGradien = gLite.computeLinearGradient(width, height, angle),
x1 = _computeLinearGradien.x1,
y1 = _computeLinearGradien.y1,
x2 = _computeLinearGradien.x2,
y2 = _computeLinearGradien.y2;
// @see https://developer.mozilla.org/zh-CN/docs/Web/API/CanvasRenderingContext2D/createLinearGradient
gradient = context.createLinearGradient(x1, y1, x2, y2);
} else if (type === gLite.GradientType.RadialGradient) {
var _computeRadialGradien = gLite.computeRadialGradient(width, height, cx, cy, size),
x = _computeRadialGradien.x,
y = _computeRadialGradien.y,
r = _computeRadialGradien.r;
// @see https://developer.mozilla.org/zh-CN/docs/Web/API/CanvasRenderingContext2D/createRadialGradient
gradient = context.createRadialGradient(x, y, 0, x, y, r);
}
}, {
key: "generatePatternKey",
value: function generatePatternKey(pattern) {
var image = pattern.image,
repetition = pattern.repetition;
// only generate cache for Image
if (isString(image)) {
return "pattern-".concat(image, "-").concat(repetition);
} else if (image instanceof gLite.Rect) {
return "pattern-".concat(image.entity, "-").concat(repetition);
}
if (gradient) {
steps.forEach(function (_ref) {
var offset = _ref.offset,
color = _ref.color;
if (offset.unit === gLite.UnitType.kPercentage) {
var _gradient;
(_gradient = gradient) === null || _gradient === void 0 ? void 0 : _gradient.addColorStop(offset.value / 100, color.toString());
}
});
this.gradientCache[key] = gradient;
}
}]);
return this.gradientCache[key];
};
_proto.generateGradientKey = function generateGradientKey(params) {
var type = params.type,
width = params.width,
height = params.height,
steps = params.steps,
angle = params.angle,
cx = params.cx,
cy = params.cy,
size = params.size;
return "gradient-" + type + "-" + ((angle === null || angle === void 0 ? void 0 : angle.toString()) || 0) + "-" + ((cx === null || cx === void 0 ? void 0 : cx.toString()) || 0) + "-" + ((cy === null || cy === void 0 ? void 0 : cy.toString()) || 0) + "-" + ((size === null || size === void 0 ? void 0 : size.toString()) || 0) + "-" + width + "-" + height + "-" + steps.map(function (_ref2) {
var offset = _ref2.offset,
color = _ref2.color;
return "" + offset + color;
}).join('-');
};
_proto.generatePatternKey = function generatePatternKey(pattern) {
var image = pattern.image,
repetition = pattern.repetition;
// only generate cache for Image
if (isString(image)) {
return "pattern-" + image + "-" + repetition;
} else if (image instanceof gLite.Rect) {
return "pattern-" + image.entity + "-" + repetition;
}
};
return ImagePool;

@@ -744,21 +639,33 @@ }();

var LoadImagePlugin = /*#__PURE__*/function () {
function LoadImagePlugin() {
_classCallCheck(this, LoadImagePlugin);
}
_createClass(LoadImagePlugin, [{
key: "apply",
value: function apply(context) {
// @ts-ignore
var renderingService = context.renderingService,
renderingContext = context.renderingContext,
imagePool = context.imagePool;
var canvas = renderingContext.root.ownerDocument.defaultView;
var handleMounted = function handleMounted(e) {
var object = e.target;
var nodeName = object.nodeName,
attributes = object.attributes;
if (nodeName === gLite.Shape.IMAGE) {
var img = attributes.img;
if (isString(img)) {
imagePool.getImageSync(img, function () {
function LoadImagePlugin() {}
var _proto = LoadImagePlugin.prototype;
_proto.apply = function apply(context) {
// @ts-ignore
var renderingService = context.renderingService,
renderingContext = context.renderingContext,
imagePool = context.imagePool;
var canvas = renderingContext.root.ownerDocument.defaultView;
var handleMounted = function handleMounted(e) {
var object = e.target;
var nodeName = object.nodeName,
attributes = object.attributes;
if (nodeName === gLite.Shape.IMAGE) {
var img = attributes.img;
if (isString(img)) {
imagePool.getImageSync(img, function () {
// set dirty rectangle flag
object.renderable.dirty = true;
renderingService.dirtify();
});
}
}
};
var handleAttributeChanged = function handleAttributeChanged(e) {
var object = e.target;
var attrName = e.attrName,
newValue = e.newValue;
if (object.nodeName === gLite.Shape.IMAGE) {
if (attrName === 'img') {
if (isString(newValue)) {
imagePool.getOrCreateImage(newValue).then(function () {
// set dirty rectangle flag

@@ -770,39 +677,23 @@ object.renderable.dirty = true;

}
};
var handleAttributeChanged = function handleAttributeChanged(e) {
var object = e.target;
var attrName = e.attrName,
newValue = e.newValue;
if (object.nodeName === gLite.Shape.IMAGE) {
if (attrName === 'img') {
if (isString(newValue)) {
imagePool.getOrCreateImage(newValue).then(function () {
// set dirty rectangle flag
object.renderable.dirty = true;
renderingService.dirtify();
});
}
}
};
renderingService.hooks.init.tapPromise(LoadImagePlugin.tag, /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
return _regeneratorRuntime().wrap(function _callee$(_context) {
while (1) {
switch (_context.prev = _context.next) {
case 0:
canvas.addEventListener(gLite.ElementEvent.MOUNTED, handleMounted);
canvas.addEventListener(gLite.ElementEvent.ATTR_MODIFIED, handleAttributeChanged);
case 2:
case "end":
return _context.stop();
}
}
};
renderingService.hooks.init.tapPromise(LoadImagePlugin.tag, /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
return _regeneratorRuntime().wrap(function _callee$(_context) {
while (1) {
switch (_context.prev = _context.next) {
case 0:
canvas.addEventListener(gLite.ElementEvent.MOUNTED, handleMounted);
canvas.addEventListener(gLite.ElementEvent.ATTR_MODIFIED, handleAttributeChanged);
case 2:
case "end":
return _context.stop();
}
}
}, _callee);
})));
renderingService.hooks.destroy.tap(LoadImagePlugin.tag, function () {
canvas.removeEventListener(gLite.ElementEvent.MOUNTED, handleMounted);
canvas.removeEventListener(gLite.ElementEvent.ATTR_MODIFIED, handleAttributeChanged);
});
}
}]);
}, _callee);
})));
renderingService.hooks.destroy.tap(LoadImagePlugin.tag, function () {
canvas.removeEventListener(gLite.ElementEvent.MOUNTED, handleMounted);
canvas.removeEventListener(gLite.ElementEvent.ATTR_MODIFIED, handleAttributeChanged);
});
};
return LoadImagePlugin;

@@ -813,27 +704,21 @@ }();

var Plugin = /*#__PURE__*/function (_AbstractRendererPlug) {
_inherits(Plugin, _AbstractRendererPlug);
var _super = _createSuper(Plugin);
_inheritsLoose(Plugin, _AbstractRendererPlug);
function Plugin() {
var _this;
_classCallCheck(this, Plugin);
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
_this = _super.call.apply(_super, [this].concat(args));
_this = _AbstractRendererPlug.call.apply(_AbstractRendererPlug, [this].concat(args)) || this;
_this.name = 'image-loader';
return _this;
}
_createClass(Plugin, [{
key: "init",
value: function init() {
// @ts-ignore
this.context.imagePool = new ImagePool(this.context.config);
this.addRenderingPlugin(new LoadImagePlugin());
}
}, {
key: "destroy",
value: function destroy() {
this.removeAllRenderingPlugins();
}
}]);
var _proto = Plugin.prototype;
_proto.init = function init() {
// @ts-ignore
this.context.imagePool = new ImagePool(this.context.config);
this.addRenderingPlugin(new LoadImagePlugin());
};
_proto.destroy = function destroy() {
this.removeAllRenderingPlugins();
};
return Plugin;

@@ -840,0 +725,0 @@ }(gLite.AbstractRendererPlugin);

2

dist/index.umd.min.js

@@ -1,1 +0,1 @@

!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("@antv/g-lite")):"function"==typeof define&&define.amd?define(["exports","@antv/g-lite"],e):e(((t="undefined"!=typeof globalThis?globalThis:t||self).G=t.G||{},t.G.ImageLoader={}),t.window.G)}(this,(function(t,e){"use strict";function r(){r=function(){return t};var t={},e=Object.prototype,n=e.hasOwnProperty,o=Object.defineProperty||function(t,e,r){t[e]=r.value},i="function"==typeof Symbol?Symbol:{},a=i.iterator||"@@iterator",c=i.asyncIterator||"@@asyncIterator",u=i.toStringTag||"@@toStringTag";function f(t,e,r){return Object.defineProperty(t,e,{value:r,enumerable:!0,configurable:!0,writable:!0}),t[e]}try{f({},"")}catch(t){f=function(t,e,r){return t[e]=r}}function l(t,e,r,n){var i=Object.create((e&&e.prototype instanceof p?e:p).prototype),a=new j(n||[]);return o(i,"_invoke",{value:x(t,r,a)}),i}function s(t,e,r){try{return{type:"normal",arg:t.call(e,r)}}catch(t){return{type:"throw",arg:t}}}t.wrap=l;var h={};function p(){}function v(){}function d(){}var y={};f(y,a,(function(){return this}));var g=Object.getPrototypeOf,m=g&&g(g(_([])));m&&m!==e&&n.call(m,a)&&(y=m);var w=d.prototype=p.prototype=Object.create(y);function b(t){["next","throw","return"].forEach((function(e){f(t,e,(function(t){return this._invoke(e,t)}))}))}function E(t,e){function r(o,i,a,c){var u=s(t[o],t,i);if("throw"!==u.type){var f=u.arg,l=f.value;return l&&"object"==typeof l&&n.call(l,"__await")?e.resolve(l.__await).then((function(t){r("next",t,a,c)}),(function(t){r("throw",t,a,c)})):e.resolve(l).then((function(t){f.value=t,a(f)}),(function(t){return r("throw",t,a,c)}))}c(u.arg)}var i;o(this,"_invoke",{value:function(t,n){function o(){return new e((function(e,o){r(t,n,e,o)}))}return i=i?i.then(o,o):o()}})}function x(t,e,r){var n="suspendedStart";return function(o,i){if("executing"===n)throw Error("Generator is already running");if("completed"===n){if("throw"===o)throw i;return C()}for(r.method=o,r.arg=i;;){var a=r.delegate;if(a){var c=O(a,r);if(c){if(c===h)continue;return c}}if("next"===r.method)r.sent=r._sent=r.arg;else if("throw"===r.method){if("suspendedStart"===n)throw n="completed",r.arg;r.dispatchException(r.arg)}else"return"===r.method&&r.abrupt("return",r.arg);n="executing";var u=s(t,e,r);if("normal"===u.type){if(n=r.done?"completed":"suspendedYield",u.arg===h)continue;return{value:u.arg,done:r.done}}"throw"===u.type&&(n="completed",r.method="throw",r.arg=u.arg)}}}function O(t,e){var r=e.method,n=t.iterator[r];if(void 0===n)return e.delegate=null,"throw"===r&&t.iterator.return&&(e.method="return",e.arg=void 0,O(t,e),"throw"===e.method)||"return"!==r&&(e.method="throw",e.arg=new TypeError("The iterator does not provide a '"+r+"' method")),h;var o=s(n,t.iterator,e.arg);if("throw"===o.type)return e.method="throw",e.arg=o.arg,e.delegate=null,h;var i=o.arg;return i?i.done?(e[t.resultName]=i.value,e.next=t.nextLoc,"return"!==e.method&&(e.method="next",e.arg=void 0),e.delegate=null,h):i:(e.method="throw",e.arg=new TypeError("iterator result is not an object"),e.delegate=null,h)}function L(t){var e={tryLoc:t[0]};1 in t&&(e.catchLoc=t[1]),2 in t&&(e.finallyLoc=t[2],e.afterLoc=t[3]),this.tryEntries.push(e)}function P(t){var e=t.completion||{};e.type="normal",delete e.arg,t.completion=e}function j(t){this.tryEntries=[{tryLoc:"root"}],t.forEach(L,this),this.reset(!0)}function _(t){if(t){var e=t[a];if(e)return e.call(t);if("function"==typeof t.next)return t;if(!isNaN(t.length)){var r=-1,o=function e(){for(;++r<t.length;)if(n.call(t,r))return e.value=t[r],e.done=!1,e;return e.value=void 0,e.done=!0,e};return o.next=o}}return{next:C}}function C(){return{value:void 0,done:!0}}return v.prototype=d,o(w,"constructor",{value:d,configurable:!0}),o(d,"constructor",{value:v,configurable:!0}),v.displayName=f(d,u,"GeneratorFunction"),t.isGeneratorFunction=function(t){var e="function"==typeof t&&t.constructor;return!!e&&(e===v||"GeneratorFunction"===(e.displayName||e.name))},t.mark=function(t){return Object.setPrototypeOf?Object.setPrototypeOf(t,d):(t.__proto__=d,f(t,u,"GeneratorFunction")),t.prototype=Object.create(w),t},t.awrap=function(t){return{__await:t}},b(E.prototype),f(E.prototype,c,(function(){return this})),t.AsyncIterator=E,t.async=function(e,r,n,o,i){void 0===i&&(i=Promise);var a=new E(l(e,r,n,o),i);return t.isGeneratorFunction(r)?a:a.next().then((function(t){return t.done?t.value:a.next()}))},b(w),f(w,u,"Generator"),f(w,a,(function(){return this})),f(w,"toString",(function(){return"[object Generator]"})),t.keys=function(t){var e=Object(t),r=[];for(var n in e)r.push(n);return r.reverse(),function t(){for(;r.length;){var n=r.pop();if(n in e)return t.value=n,t.done=!1,t}return t.done=!0,t}},t.values=_,j.prototype={constructor:j,reset:function(t){if(this.prev=0,this.next=0,this.sent=this._sent=void 0,this.done=!1,this.delegate=null,this.method="next",this.arg=void 0,this.tryEntries.forEach(P),!t)for(var e in this)"t"===e.charAt(0)&&n.call(this,e)&&!isNaN(+e.slice(1))&&(this[e]=void 0)},stop:function(){this.done=!0;var t=this.tryEntries[0].completion;if("throw"===t.type)throw t.arg;return this.rval},dispatchException:function(t){if(this.done)throw t;var e=this;function r(r,n){return a.type="throw",a.arg=t,e.next=r,n&&(e.method="next",e.arg=void 0),!!n}for(var o=this.tryEntries.length-1;o>=0;--o){var i=this.tryEntries[o],a=i.completion;if("root"===i.tryLoc)return r("end");if(this.prev>=i.tryLoc){var c=n.call(i,"catchLoc"),u=n.call(i,"finallyLoc");if(c&&u){if(i.catchLoc>this.prev)return r(i.catchLoc,!0);if(i.finallyLoc>this.prev)return r(i.finallyLoc)}else if(c){if(i.catchLoc>this.prev)return r(i.catchLoc,!0)}else{if(!u)throw Error("try statement without catch or finally");if(i.finallyLoc>this.prev)return r(i.finallyLoc)}}}},abrupt:function(t,e){for(var r=this.tryEntries.length-1;r>=0;--r){var o=this.tryEntries[r];if(this.prev>=o.tryLoc&&n.call(o,"finallyLoc")&&o.finallyLoc>this.prev){var i=o;break}}i&&("break"===t||"continue"===t)&&e>=i.tryLoc&&i.finallyLoc>=e&&(i=null);var a=i?i.completion:{};return a.type=t,a.arg=e,i?(this.method="next",this.next=i.finallyLoc,h):this.complete(a)},complete:function(t,e){if("throw"===t.type)throw t.arg;return"break"===t.type||"continue"===t.type?this.next=t.arg:"return"===t.type?(this.rval=this.arg=t.arg,this.method="return",this.next="end"):"normal"===t.type&&e&&(this.next=e),h},finish:function(t){for(var e=this.tryEntries.length-1;e>=0;--e){var r=this.tryEntries[e];if(r.finallyLoc===t)return this.complete(r.completion,r.afterLoc),P(r),h}},catch:function(t){for(var e=this.tryEntries.length-1;e>=0;--e){var r=this.tryEntries[e];if(r.tryLoc===t){var n=r.completion;if("throw"===n.type){var o=n.arg;P(r)}return o}}throw Error("illegal catch attempt")},delegateYield:function(t,e,r){return this.delegate={iterator:_(t),resultName:e,nextLoc:r},"next"===this.method&&(this.arg=void 0),h}},t}function n(t,e,r,n,o,i,a){try{var c=t[i](a),u=c.value}catch(t){return void r(t)}c.done?e(u):Promise.resolve(u).then(n,o)}function o(t){return function(){var e=this,r=arguments;return new Promise((function(o,i){var a=t.apply(e,r);function c(t){n(a,o,i,c,u,"next",t)}function u(t){n(a,o,i,c,u,"throw",t)}c(void 0)}))}}function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function a(t,e){for(var r=0;e.length>r;r++){var n=e[r];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,(o=void 0,"symbol"==typeof(o=function(t,e){if("object"!=typeof t||null===t)return t;var r=t[Symbol.toPrimitive];if(void 0!==r){var n=r.call(t,e||"default");if("object"!=typeof n)return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===e?String:Number)(t)}(n.key,"string"))?o:o+""),n)}var o}function c(t,e,r){return e&&a(t.prototype,e),r&&a(t,r),Object.defineProperty(t,"prototype",{writable:!1}),t}function u(t){return u=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(t){return t.__proto__||Object.getPrototypeOf(t)},u(t)}function f(t,e){return f=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(t,e){return t.__proto__=e,t},f(t,e)}function l(t,e){if(e&&("object"==typeof e||"function"==typeof e))return e;if(void 0!==e)throw new TypeError("Derived constructors may only return object or undefined");return function(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}(t)}function s(t){var e=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(t){return!1}}();return function(){var r,n=u(t);if(e){var o=u(this).constructor;r=Reflect.construct(n,arguments,o)}else r=n.apply(this,arguments);return l(this,r)}}var h="undefined"!=typeof Float32Array?Float32Array:Array;Math.hypot||(Math.hypot=function(){for(var t=0,e=arguments.length;e--;)t+=arguments[e]*arguments[e];return Math.sqrt(t)});var p={}.toString,v=function(t){return e="String",p.call(t)==="[object "+e+"]";var e},d=function(){function t(e){i(this,t),this.canvasConfig=void 0,this.imageCache={},this.gradientCache={},this.patternCache={},this.canvasConfig=e}return c(t,[{key:"getImageSync",value:function(t,e){return this.imageCache[t]?e&&e():this.getOrCreateImage(t).then((function(){e&&e()})),this.imageCache[t]}},{key:"getOrCreateImage",value:function(t){var r=this;if(this.imageCache[t])return Promise.resolve(this.imageCache[t]);var n=this.canvasConfig.createImage;return new Promise((function(o,i){var a;n?a=n(t):e.isBrowser&&(a=new window.Image),a&&(a.onload=function(){o(a)},a.onerror=function(t){i(t)},a.crossOrigin="Anonymous",a.src=t,r.imageCache[t]=a)}))}},{key:"getOrCreatePatternSync",value:function(t,r,n,o,i){var a=this.generatePatternKey(t);if(a&&this.patternCache[a])return this.patternCache[a];var c,u=t.image,f=t.repetition,l=t.transform,s=!1;v(u)?c=this.getImageSync(u,i):n?(c=n,s=!0):c=u;var p,d,y=c&&r.createPattern(c,f);y&&(p=l?e.parsedTransformToMat4(e.parseTransform(l)):function(t){return t[0]=1,t[1]=0,t[2]=0,t[3]=0,t[4]=0,t[5]=1,t[6]=0,t[7]=0,t[8]=0,t[9]=0,t[10]=1,t[11]=0,t[12]=0,t[13]=0,t[14]=0,t[15]=1,t}((d=new h(16),h!=Float32Array&&(d[1]=0,d[2]=0,d[3]=0,d[4]=0,d[6]=0,d[7]=0,d[8]=0,d[9]=0,d[11]=0,d[12]=0,d[13]=0,d[14]=0),d[0]=1,d[5]=1,d[10]=1,d[15]=1,d)),s&&function(t,e,r){var n=r[0],o=r[1],i=r[2];t[0]=e[0]*n,t[1]=e[1]*n,t[2]=e[2]*n,t[3]=e[3]*n,t[4]=e[4]*o,t[5]=e[5]*o,t[6]=e[6]*o,t[7]=e[7]*o,t[8]=e[8]*i,t[9]=e[9]*i,t[10]=e[10]*i,t[11]=e[11]*i,t[12]=e[12],t[13]=e[13],t[14]=e[14],t[15]=e[15]}(p,p,[1/o,1/o,1]),y.setTransform({a:p[0],b:p[1],c:p[4],d:p[5],e:p[12],f:p[13]}));return a&&y&&(this.patternCache[a]=y),y}},{key:"getOrCreateGradient",value:function(t,r){var n=this.generateGradientKey(t),o=t.type,i=t.steps,a=t.width,c=t.height,u=t.cx,f=t.cy,l=t.size;if(this.gradientCache[n])return this.gradientCache[n];var s=null;if(o===e.GradientType.LinearGradient){var h=e.computeLinearGradient(a,c,t.angle);s=r.createLinearGradient(h.x1,h.y1,h.x2,h.y2)}else if(o===e.GradientType.RadialGradient){var p=e.computeRadialGradient(a,c,u,f,l),v=p.x,d=p.y;s=r.createRadialGradient(v,d,0,v,d,p.r)}return s&&(i.forEach((function(t){var r,n=t.offset;n.unit===e.UnitType.kPercentage&&(null===(r=s)||void 0===r||r.addColorStop(n.value/100,""+t.color))})),this.gradientCache[n]=s),this.gradientCache[n]}},{key:"generateGradientKey",value:function(t){var e=t.width,r=t.height,n=t.steps,o=t.angle,i=t.cx,a=t.cy,c=t.size;return"gradient-".concat(t.type,"-").concat((null==o?void 0:""+o)||0,"-").concat((null==i?void 0:""+i)||0,"-").concat((null==a?void 0:""+a)||0,"-").concat((null==c?void 0:""+c)||0,"-").concat(e,"-").concat(r,"-").concat(n.map((function(t){var e=t.color;return"".concat(t.offset).concat(e)})).join("-"))}},{key:"generatePatternKey",value:function(t){var r=t.image,n=t.repetition;return v(r)?"pattern-".concat(r,"-").concat(n):r instanceof e.Rect?"pattern-".concat(r.entity,"-").concat(n):void 0}}]),t}(),y=function(){function t(){i(this,t)}return c(t,[{key:"apply",value:function(n){var i=n.renderingService,a=n.imagePool,c=n.renderingContext.root.ownerDocument.defaultView,u=function(t){var r=t.target;if(r.nodeName===e.Shape.IMAGE){var n=r.attributes.img;v(n)&&a.getImageSync(n,(function(){r.renderable.dirty=!0,i.dirtify()}))}},f=function(t){var r=t.target,n=t.newValue;r.nodeName===e.Shape.IMAGE&&"img"===t.attrName&&v(n)&&a.getOrCreateImage(n).then((function(){r.renderable.dirty=!0,i.dirtify()}))};i.hooks.init.tapPromise(t.tag,o(r().mark((function t(){return r().wrap((function(t){for(;;)switch(t.prev=t.next){case 0:c.addEventListener(e.ElementEvent.MOUNTED,u),c.addEventListener(e.ElementEvent.ATTR_MODIFIED,f);case 2:case"end":return t.stop()}}),t)})))),i.hooks.destroy.tap(t.tag,(function(){c.removeEventListener(e.ElementEvent.MOUNTED,u),c.removeEventListener(e.ElementEvent.ATTR_MODIFIED,f)}))}}]),t}();y.tag="LoadImage";var g=function(t){!function(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function");t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,writable:!0,configurable:!0}}),Object.defineProperty(t,"prototype",{writable:!1}),e&&f(t,e)}(r,t);var e=s(r);function r(){var t;i(this,r);for(var n=arguments.length,o=Array(n),a=0;n>a;a++)o[a]=arguments[a];return(t=e.call.apply(e,[this].concat(o))).name="image-loader",t}return c(r,[{key:"init",value:function(){this.context.imagePool=new d(this.context.config),this.addRenderingPlugin(new y)}},{key:"destroy",value:function(){this.removeAllRenderingPlugins()}}]),r}(e.AbstractRendererPlugin);t.ImagePool=d,t.Plugin=g,Object.defineProperty(t,"__esModule",{value:!0})}));
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("@antv/g-lite")):"function"==typeof define&&define.amd?define(["exports","@antv/g-lite"],e):e(((t="undefined"!=typeof globalThis?globalThis:t||self).G=t.G||{},t.G.ImageLoader={}),t.window.G)}(this,(function(t,e){"use strict";function r(){r=function(){return t};var t={},e=Object.prototype,n=e.hasOwnProperty,o=Object.defineProperty||function(t,e,r){t[e]=r.value},i="function"==typeof Symbol?Symbol:{},a=i.iterator||"@@iterator",c=i.asyncIterator||"@@asyncIterator",u=i.toStringTag||"@@toStringTag";function f(t,e,r){return Object.defineProperty(t,e,{value:r,enumerable:!0,configurable:!0,writable:!0}),t[e]}try{f({},"")}catch(t){f=function(t,e,r){return t[e]=r}}function s(t,e,r,n){var i=Object.create((e&&e.prototype instanceof d?e:d).prototype),a=new C(n||[]);return o(i,"_invoke",{value:x(t,r,a)}),i}function h(t,e,r){try{return{type:"normal",arg:t.call(e,r)}}catch(t){return{type:"throw",arg:t}}}t.wrap=s;var l={};function d(){}function p(){}function v(){}var g={};f(g,a,(function(){return this}));var y=Object.getPrototypeOf,m=y&&y(y(G([])));m&&m!==e&&n.call(m,a)&&(g=m);var w=v.prototype=d.prototype=Object.create(g);function E(t){["next","throw","return"].forEach((function(e){f(t,e,(function(t){return this._invoke(e,t)}))}))}function b(t,e){function r(o,i,a,c){var u=h(t[o],t,i);if("throw"!==u.type){var f=u.arg,s=f.value;return s&&"object"==typeof s&&n.call(s,"__await")?e.resolve(s.__await).then((function(t){r("next",t,a,c)}),(function(t){r("throw",t,a,c)})):e.resolve(s).then((function(t){f.value=t,a(f)}),(function(t){return r("throw",t,a,c)}))}c(u.arg)}var i;o(this,"_invoke",{value:function(t,n){function o(){return new e((function(e,o){r(t,n,e,o)}))}return i=i?i.then(o,o):o()}})}function x(t,e,r){var n="suspendedStart";return function(o,i){if("executing"===n)throw Error("Generator is already running");if("completed"===n){if("throw"===o)throw i;return _()}for(r.method=o,r.arg=i;;){var a=r.delegate;if(a){var c=L(a,r);if(c){if(c===l)continue;return c}}if("next"===r.method)r.sent=r._sent=r.arg;else if("throw"===r.method){if("suspendedStart"===n)throw n="completed",r.arg;r.dispatchException(r.arg)}else"return"===r.method&&r.abrupt("return",r.arg);n="executing";var u=h(t,e,r);if("normal"===u.type){if(n=r.done?"completed":"suspendedYield",u.arg===l)continue;return{value:u.arg,done:r.done}}"throw"===u.type&&(n="completed",r.method="throw",r.arg=u.arg)}}}function L(t,e){var r=e.method,n=t.iterator[r];if(void 0===n)return e.delegate=null,"throw"===r&&t.iterator.return&&(e.method="return",e.arg=void 0,L(t,e),"throw"===e.method)||"return"!==r&&(e.method="throw",e.arg=new TypeError("The iterator does not provide a '"+r+"' method")),l;var o=h(n,t.iterator,e.arg);if("throw"===o.type)return e.method="throw",e.arg=o.arg,e.delegate=null,l;var i=o.arg;return i?i.done?(e[t.resultName]=i.value,e.next=t.nextLoc,"return"!==e.method&&(e.method="next",e.arg=void 0),e.delegate=null,l):i:(e.method="throw",e.arg=new TypeError("iterator result is not an object"),e.delegate=null,l)}function O(t){var e={tryLoc:t[0]};1 in t&&(e.catchLoc=t[1]),2 in t&&(e.finallyLoc=t[2],e.afterLoc=t[3]),this.tryEntries.push(e)}function P(t){var e=t.completion||{};e.type="normal",delete e.arg,t.completion=e}function C(t){this.tryEntries=[{tryLoc:"root"}],t.forEach(O,this),this.reset(!0)}function G(t){if(t){var e=t[a];if(e)return e.call(t);if("function"==typeof t.next)return t;if(!isNaN(t.length)){var r=-1,o=function e(){for(;++r<t.length;)if(n.call(t,r))return e.value=t[r],e.done=!1,e;return e.value=void 0,e.done=!0,e};return o.next=o}}return{next:_}}function _(){return{value:void 0,done:!0}}return p.prototype=v,o(w,"constructor",{value:v,configurable:!0}),o(v,"constructor",{value:p,configurable:!0}),p.displayName=f(v,u,"GeneratorFunction"),t.isGeneratorFunction=function(t){var e="function"==typeof t&&t.constructor;return!!e&&(e===p||"GeneratorFunction"===(e.displayName||e.name))},t.mark=function(t){return Object.setPrototypeOf?Object.setPrototypeOf(t,v):(t.__proto__=v,f(t,u,"GeneratorFunction")),t.prototype=Object.create(w),t},t.awrap=function(t){return{__await:t}},E(b.prototype),f(b.prototype,c,(function(){return this})),t.AsyncIterator=b,t.async=function(e,r,n,o,i){void 0===i&&(i=Promise);var a=new b(s(e,r,n,o),i);return t.isGeneratorFunction(r)?a:a.next().then((function(t){return t.done?t.value:a.next()}))},E(w),f(w,u,"Generator"),f(w,a,(function(){return this})),f(w,"toString",(function(){return"[object Generator]"})),t.keys=function(t){var e=Object(t),r=[];for(var n in e)r.push(n);return r.reverse(),function t(){for(;r.length;){var n=r.pop();if(n in e)return t.value=n,t.done=!1,t}return t.done=!0,t}},t.values=G,C.prototype={constructor:C,reset:function(t){if(this.prev=0,this.next=0,this.sent=this._sent=void 0,this.done=!1,this.delegate=null,this.method="next",this.arg=void 0,this.tryEntries.forEach(P),!t)for(var e in this)"t"===e.charAt(0)&&n.call(this,e)&&!isNaN(+e.slice(1))&&(this[e]=void 0)},stop:function(){this.done=!0;var t=this.tryEntries[0].completion;if("throw"===t.type)throw t.arg;return this.rval},dispatchException:function(t){if(this.done)throw t;var e=this;function r(r,n){return a.type="throw",a.arg=t,e.next=r,n&&(e.method="next",e.arg=void 0),!!n}for(var o=this.tryEntries.length-1;o>=0;--o){var i=this.tryEntries[o],a=i.completion;if("root"===i.tryLoc)return r("end");if(this.prev>=i.tryLoc){var c=n.call(i,"catchLoc"),u=n.call(i,"finallyLoc");if(c&&u){if(i.catchLoc>this.prev)return r(i.catchLoc,!0);if(i.finallyLoc>this.prev)return r(i.finallyLoc)}else if(c){if(i.catchLoc>this.prev)return r(i.catchLoc,!0)}else{if(!u)throw Error("try statement without catch or finally");if(i.finallyLoc>this.prev)return r(i.finallyLoc)}}}},abrupt:function(t,e){for(var r=this.tryEntries.length-1;r>=0;--r){var o=this.tryEntries[r];if(this.prev>=o.tryLoc&&n.call(o,"finallyLoc")&&o.finallyLoc>this.prev){var i=o;break}}i&&("break"===t||"continue"===t)&&e>=i.tryLoc&&i.finallyLoc>=e&&(i=null);var a=i?i.completion:{};return a.type=t,a.arg=e,i?(this.method="next",this.next=i.finallyLoc,l):this.complete(a)},complete:function(t,e){if("throw"===t.type)throw t.arg;return"break"===t.type||"continue"===t.type?this.next=t.arg:"return"===t.type?(this.rval=this.arg=t.arg,this.method="return",this.next="end"):"normal"===t.type&&e&&(this.next=e),l},finish:function(t){for(var e=this.tryEntries.length-1;e>=0;--e){var r=this.tryEntries[e];if(r.finallyLoc===t)return this.complete(r.completion,r.afterLoc),P(r),l}},catch:function(t){for(var e=this.tryEntries.length-1;e>=0;--e){var r=this.tryEntries[e];if(r.tryLoc===t){var n=r.completion;if("throw"===n.type){var o=n.arg;P(r)}return o}}throw Error("illegal catch attempt")},delegateYield:function(t,e,r){return this.delegate={iterator:G(t),resultName:e,nextLoc:r},"next"===this.method&&(this.arg=void 0),l}},t}function n(t,e,r,n,o,i,a){try{var c=t[i](a),u=c.value}catch(t){return void r(t)}c.done?e(u):Promise.resolve(u).then(n,o)}function o(t){return function(){var e=this,r=arguments;return new Promise((function(o,i){var a=t.apply(e,r);function c(t){n(a,o,i,c,u,"next",t)}function u(t){n(a,o,i,c,u,"throw",t)}c(void 0)}))}}function i(t,e){return i=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(t,e){return t.__proto__=e,t},i(t,e)}var a="undefined"!=typeof Float32Array?Float32Array:Array;Math.hypot||(Math.hypot=function(){for(var t=0,e=arguments.length;e--;)t+=arguments[e]*arguments[e];return Math.sqrt(t)});var c={}.toString,u=function(t){return e="String",c.call(t)==="[object "+e+"]";var e},f=function(){function t(t){this.canvasConfig=void 0,this.imageCache={},this.gradientCache={},this.patternCache={},this.canvasConfig=t}var r=t.prototype;return r.getImageSync=function(t,e){return this.imageCache[t]?e&&e():this.getOrCreateImage(t).then((function(){e&&e()})),this.imageCache[t]},r.getOrCreateImage=function(t){var r=this;if(this.imageCache[t])return Promise.resolve(this.imageCache[t]);var n=this.canvasConfig.createImage;return new Promise((function(o,i){var a;n?a=n(t):e.isBrowser&&(a=new window.Image),a&&(a.onload=function(){o(a)},a.onerror=function(t){i(t)},a.crossOrigin="Anonymous",a.src=t,r.imageCache[t]=a)}))},r.getOrCreatePatternSync=function(t,r,n,o,i){var c=this.generatePatternKey(t);if(c&&this.patternCache[c])return this.patternCache[c];var f,s=t.image,h=t.repetition,l=t.transform,d=!1;u(s)?f=this.getImageSync(s,i):n?(f=n,d=!0):f=s;var p,v,g=f&&r.createPattern(f,h);g&&(p=l?e.parsedTransformToMat4(e.parseTransform(l)):function(t){return t[0]=1,t[1]=0,t[2]=0,t[3]=0,t[4]=0,t[5]=1,t[6]=0,t[7]=0,t[8]=0,t[9]=0,t[10]=1,t[11]=0,t[12]=0,t[13]=0,t[14]=0,t[15]=1,t}((v=new a(16),a!=Float32Array&&(v[1]=0,v[2]=0,v[3]=0,v[4]=0,v[6]=0,v[7]=0,v[8]=0,v[9]=0,v[11]=0,v[12]=0,v[13]=0,v[14]=0),v[0]=1,v[5]=1,v[10]=1,v[15]=1,v)),d&&function(t,e,r){var n=r[0],o=r[1],i=r[2];t[0]=e[0]*n,t[1]=e[1]*n,t[2]=e[2]*n,t[3]=e[3]*n,t[4]=e[4]*o,t[5]=e[5]*o,t[6]=e[6]*o,t[7]=e[7]*o,t[8]=e[8]*i,t[9]=e[9]*i,t[10]=e[10]*i,t[11]=e[11]*i,t[12]=e[12],t[13]=e[13],t[14]=e[14],t[15]=e[15]}(p,p,[1/o,1/o,1]),g.setTransform({a:p[0],b:p[1],c:p[4],d:p[5],e:p[12],f:p[13]}));return c&&g&&(this.patternCache[c]=g),g},r.getOrCreateGradient=function(t,r){var n=this.generateGradientKey(t),o=t.type,i=t.steps,a=t.width,c=t.height,u=t.cx,f=t.cy,s=t.size;if(this.gradientCache[n])return this.gradientCache[n];var h=null;if(o===e.GradientType.LinearGradient){var l=e.computeLinearGradient(a,c,t.angle);h=r.createLinearGradient(l.x1,l.y1,l.x2,l.y2)}else if(o===e.GradientType.RadialGradient){var d=e.computeRadialGradient(a,c,u,f,s),p=d.x,v=d.y;h=r.createRadialGradient(p,v,0,p,v,d.r)}return h&&(i.forEach((function(t){var r,n=t.offset;n.unit===e.UnitType.kPercentage&&(null===(r=h)||void 0===r||r.addColorStop(n.value/100,""+t.color))})),this.gradientCache[n]=h),this.gradientCache[n]},r.generateGradientKey=function(t){var e=t.angle,r=t.cx,n=t.cy,o=t.size;return"gradient-"+t.type+"-"+((null==e?void 0:""+e)||0)+"-"+((null==r?void 0:""+r)||0)+"-"+((null==n?void 0:""+n)||0)+"-"+((null==o?void 0:""+o)||0)+"-"+t.width+"-"+t.height+"-"+t.steps.map((function(t){return""+t.offset+t.color})).join("-")},r.generatePatternKey=function(t){var r=t.image,n=t.repetition;return u(r)?"pattern-"+r+"-"+n:r instanceof e.Rect?"pattern-"+r.entity+"-"+n:void 0},t}(),s=function(){function t(){}return t.prototype.apply=function(n){var i=n.renderingService,a=n.imagePool,c=n.renderingContext.root.ownerDocument.defaultView,f=function(t){var r=t.target;if(r.nodeName===e.Shape.IMAGE){var n=r.attributes.img;u(n)&&a.getImageSync(n,(function(){r.renderable.dirty=!0,i.dirtify()}))}},s=function(t){var r=t.target,n=t.newValue;r.nodeName===e.Shape.IMAGE&&"img"===t.attrName&&u(n)&&a.getOrCreateImage(n).then((function(){r.renderable.dirty=!0,i.dirtify()}))};i.hooks.init.tapPromise(t.tag,o(r().mark((function t(){return r().wrap((function(t){for(;;)switch(t.prev=t.next){case 0:c.addEventListener(e.ElementEvent.MOUNTED,f),c.addEventListener(e.ElementEvent.ATTR_MODIFIED,s);case 2:case"end":return t.stop()}}),t)})))),i.hooks.destroy.tap(t.tag,(function(){c.removeEventListener(e.ElementEvent.MOUNTED,f),c.removeEventListener(e.ElementEvent.ATTR_MODIFIED,s)}))},t}();s.tag="LoadImage";var h=function(t){var e,r;function n(){for(var e,r=arguments.length,n=Array(r),o=0;r>o;o++)n[o]=arguments[o];return(e=t.call.apply(t,[this].concat(n))||this).name="image-loader",e}(e=n).prototype=Object.create((r=t).prototype),e.prototype.constructor=e,i(e,r);var o=n.prototype;return o.init=function(){this.context.imagePool=new f(this.context.config),this.addRenderingPlugin(new s)},o.destroy=function(){this.removeAllRenderingPlugins()},n}(e.AbstractRendererPlugin);t.ImagePool=f,t.Plugin=h,Object.defineProperty(t,"__esModule",{value:!0})}));

4

package.json
{
"name": "@antv/g-plugin-image-loader",
"version": "1.1.33",
"version": "1.1.34",
"description": "A G plugin for loading image",

@@ -45,3 +45,3 @@ "keywords": [

},
"gitHead": "a4ea86f17b561d0483129ca2022586fcd9e42b7b"
"gitHead": "c3c09705bf97040bbec01d94f55c27cc6f14d230"
}
SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc