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

Comparing version 1.1.12 to 1.1.13

dist/ImagePool.d.ts

@@ -1,3 +0,3 @@
-import type { LinearGradient, Pattern, RadialGradient } from '@antv/g';
-import { GradientType } from '@antv/g';
+import type { LinearGradient, Pattern, RadialGradient } from '@antv/g-lite';
+import { CanvasConfig, GradientType } from '@antv/g-lite';
 export declare type GradientParams = (LinearGradient | RadialGradient) & {
@@ -9,6 +9,7 @@ width: number;
 export declare class ImagePool {
+    private canvasConfig;
     private imageCache;
     private gradientCache;
     private patternCache;
-    private canvasConfig;
+    constructor(canvasConfig: CanvasConfig);
     getImageSync(src: string, callback?: () => void): HTMLImageElement;
@@ -15,0 +16,0 @@ getOrCreateImage(src: string): Promise<HTMLImageElement>;

dist/index.d.ts

@@ -1,2 +0,2 @@
-import { AbstractRendererPlugin } from '@antv/g';
+import { AbstractRendererPlugin } from '@antv/g-lite';
 import { ImagePool } from './ImagePool';
@@ -3,0 +3,0 @@ export { ImagePool };

dist/index.esm.js

@@ -1,3 +0,3 @@
-import { isBrowser, isString, GradientType, computeLinearGradient, computeRadialGradient, inject, CanvasConfig, singleton, RenderingContext, RenderingPluginContribution, ElementEvent, Shape, Module, AbstractRendererPlugin } from '@antv/g';
-import { __decorate, __metadata } from 'tslib';
+import { isBrowser, GradientType, computeLinearGradient, computeRadialGradient, singleton, inject, CanvasConfig, RenderingPluginContribution, RenderingContext, ElementEvent, Shape, Module, AbstractRendererPlugin } from '@antv/g-lite';
+import { __spreadArrays, __decorate, __param } from 'tslib';
 
@@ -400,8 +400,125 @@ function _regeneratorRuntime() {
 
+var toString = {}.toString;
+var isType = function (value, type) { return toString.call(value) === '[object ' + type + ']'; };
+
+/**
+ * 是否为函数
+ * @param  {*} fn 对象
+ * @return {Boolean}  是否函数
+ */
+var isFunction = (function (value) {
+    return isType(value, 'Function');
+});
+
+var isArray = (function (value) {
+    return Array.isArray ?
+        Array.isArray(value) :
+        isType(value, 'Array');
+});
+
+var isObject = (function (value) {
+    /**
+     * isObject({}) => true
+     * isObject([1, 2, 3]) => true
+     * isObject(Function) => true
+     * isObject(null) => false
+     */
+    var type = typeof value;
+    return value !== null && type === 'object' || type === 'function';
+});
+
+function each(elements, func) {
+    if (!elements) {
+        return;
+    }
+    var rst;
+    if (isArray(elements)) {
+        for (var i = 0, len = elements.length; i < len; i++) {
+            rst = func(elements[i], i);
+            if (rst === false) {
+                break;
+            }
+        }
+    }
+    else if (isObject(elements)) {
+        for (var k in elements) {
+            if (elements.hasOwnProperty(k)) {
+                rst = func(elements[k], k);
+                if (rst === false) {
+                    break;
+                }
+            }
+        }
+    }
+}
+
+var isString = (function (str) {
+    return isType(str, 'String');
+});
+
+// @ts-ignore
+var values = Object.values ? function (obj) { return Object.values(obj); } : function (obj) {
+    var result = [];
+    each(obj, function (value, key) {
+        if (!(isFunction(obj) && key === 'prototype')) {
+            result.push(value);
+        }
+    });
+    return result;
+};
+
+/**
+ * _.memoize(calColor);
+ * _.memoize(calColor, (...args) => args[0]);
+ * @param f
+ * @param resolver
+ */
+var memoize = (function (f, resolver) {
+    if (!isFunction(f)) {
+        throw new TypeError('Expected a function');
+    }
+    var memoized = function () {
+        var args = [];
+        for (var _i = 0; _i < arguments.length; _i++) {
+            args[_i] = arguments[_i];
+        }
+        // 使用方法构造 key，如果不存在 resolver，则直接取第一个参数作为 key
+        var key = resolver ? resolver.apply(this, args) : args[0];
+        var cache = memoized.cache;
+        if (cache.has(key)) {
+            return cache.get(key);
+        }
+        var result = f.apply(this, args);
+        // 缓存起来
+        cache.set(key, result);
+        return result;
+    };
+    memoized.cache = new Map();
+    return memoized;
+});
+
+var ctx;
+/**
+ * 计算文本的宽度
+ */
+memoize(function (text, font) {
+    if (font === void 0) { font = {}; }
+    var fontSize = font.fontSize, fontFamily = font.fontFamily, fontWeight = font.fontWeight, fontStyle = font.fontStyle, fontVariant = font.fontVariant;
+    if (!ctx) {
+        ctx = document.createElement('canvas').getContext('2d');
+    }
+    ctx.font = [fontStyle, fontVariant, fontWeight, fontSize + "px", fontFamily].join(' ');
+    return ctx.measureText(isString(text) ? text : '').width;
+}, function (text, font) {
+    if (font === void 0) { font = {}; }
+    return __spreadArrays([text], values(font)).join('');
+});
+
 var ImagePool = /*#__PURE__*/function () {
-  function ImagePool() {
+  function ImagePool(canvasConfig) {
+    this.canvasConfig = void 0;
     this.imageCache = {};
     this.gradientCache = {};
     this.patternCache = {};
-    this.canvasConfig = void 0;
+    this.canvasConfig = canvasConfig;
   }
@@ -564,6 +681,4 @@
 
-__decorate([inject(CanvasConfig), __metadata("design:type", Object)], ImagePool.prototype, "canvasConfig", void 0);
+ImagePool = __decorate([singleton(), __param(0, inject(CanvasConfig))], ImagePool);
 
-ImagePool = __decorate([singleton()], ImagePool);
-
 var _class;
@@ -573,5 +688,7 @@
 var LoadImagePlugin = LoadImagePlugin_1 = (_class = /*#__PURE__*/function () {
-  function LoadImagePlugin() {
+  function LoadImagePlugin(imagePool, renderingContext) {
     this.imagePool = void 0;
     this.renderingContext = void 0;
+    this.imagePool = imagePool;
+    this.renderingContext = renderingContext;
   }
@@ -645,10 +762,5 @@
 }(), _class.tag = 'LoadImage', _class);
-
-__decorate([inject(ImagePool), __metadata("design:type", ImagePool)], LoadImagePlugin.prototype, "imagePool", void 0);
-
-__decorate([inject(RenderingContext), __metadata("design:type", Object)], LoadImagePlugin.prototype, "renderingContext", void 0);
-
 LoadImagePlugin = LoadImagePlugin_1 = __decorate([singleton({
   contrib: RenderingPluginContribution
-})], LoadImagePlugin);
+}), __param(0, inject(ImagePool)), __param(1, inject(RenderingContext))], LoadImagePlugin);
 
@@ -655,0 +767,0 @@ var containerModule = Module(function (register) {

dist/index.js

@@ -5,3 +5,3 @@ 'use strict';
 
-var g = require('@antv/g');
+var gLite = require('@antv/g-lite');
 var tslib = require('tslib');
@@ -405,8 +405,125 @@
 
+var toString = {}.toString;
+var isType = function (value, type) { return toString.call(value) === '[object ' + type + ']'; };
+
+/**
+ * 是否为函数
+ * @param  {*} fn 对象
+ * @return {Boolean}  是否函数
+ */
+var isFunction = (function (value) {
+    return isType(value, 'Function');
+});
+
+var isArray = (function (value) {
+    return Array.isArray ?
+        Array.isArray(value) :
+        isType(value, 'Array');
+});
+
+var isObject = (function (value) {
+    /**
+     * isObject({}) => true
+     * isObject([1, 2, 3]) => true
+     * isObject(Function) => true
+     * isObject(null) => false
+     */
+    var type = typeof value;
+    return value !== null && type === 'object' || type === 'function';
+});
+
+function each(elements, func) {
+    if (!elements) {
+        return;
+    }
+    var rst;
+    if (isArray(elements)) {
+        for (var i = 0, len = elements.length; i < len; i++) {
+            rst = func(elements[i], i);
+            if (rst === false) {
+                break;
+            }
+        }
+    }
+    else if (isObject(elements)) {
+        for (var k in elements) {
+            if (elements.hasOwnProperty(k)) {
+                rst = func(elements[k], k);
+                if (rst === false) {
+                    break;
+                }
+            }
+        }
+    }
+}
+
+var isString = (function (str) {
+    return isType(str, 'String');
+});
+
+// @ts-ignore
+var values = Object.values ? function (obj) { return Object.values(obj); } : function (obj) {
+    var result = [];
+    each(obj, function (value, key) {
+        if (!(isFunction(obj) && key === 'prototype')) {
+            result.push(value);
+        }
+    });
+    return result;
+};
+
+/**
+ * _.memoize(calColor);
+ * _.memoize(calColor, (...args) => args[0]);
+ * @param f
+ * @param resolver
+ */
+var memoize = (function (f, resolver) {
+    if (!isFunction(f)) {
+        throw new TypeError('Expected a function');
+    }
+    var memoized = function () {
+        var args = [];
+        for (var _i = 0; _i < arguments.length; _i++) {
+            args[_i] = arguments[_i];
+        }
+        // 使用方法构造 key，如果不存在 resolver，则直接取第一个参数作为 key
+        var key = resolver ? resolver.apply(this, args) : args[0];
+        var cache = memoized.cache;
+        if (cache.has(key)) {
+            return cache.get(key);
+        }
+        var result = f.apply(this, args);
+        // 缓存起来
+        cache.set(key, result);
+        return result;
+    };
+    memoized.cache = new Map();
+    return memoized;
+});
+
+var ctx;
+/**
+ * 计算文本的宽度
+ */
+memoize(function (text, font) {
+    if (font === void 0) { font = {}; }
+    var fontSize = font.fontSize, fontFamily = font.fontFamily, fontWeight = font.fontWeight, fontStyle = font.fontStyle, fontVariant = font.fontVariant;
+    if (!ctx) {
+        ctx = document.createElement('canvas').getContext('2d');
+    }
+    ctx.font = [fontStyle, fontVariant, fontWeight, fontSize + "px", fontFamily].join(' ');
+    return ctx.measureText(isString(text) ? text : '').width;
+}, function (text, font) {
+    if (font === void 0) { font = {}; }
+    return tslib.__spreadArrays([text], values(font)).join('');
+});
+
 exports.ImagePool = /*#__PURE__*/function () {
-  function ImagePool() {
+  function ImagePool(canvasConfig) {
+    this.canvasConfig = void 0;
     this.imageCache = {};
     this.gradientCache = {};
     this.patternCache = {};
-    this.canvasConfig = void 0;
+    this.canvasConfig = canvasConfig;
   }
@@ -446,3 +563,3 @@
         image = createImage(src);
-      } else if (g.isBrowser) {
+      } else if (gLite.isBrowser) {
         image = new window.Image();
@@ -478,3 +595,3 @@ }
 
-    if (g.isString(image)) {
+    if (isString(image)) {
       src = this.getImageSync(image, callback);
@@ -512,4 +629,4 @@ } else {
 
-    if (type === g.GradientType.LinearGradient) {
-      var _computeLinearGradien = g.computeLinearGradient(width, height, angle),
+    if (type === gLite.GradientType.LinearGradient) {
+      var _computeLinearGradien = gLite.computeLinearGradient(width, height, angle),
           x1 = _computeLinearGradien.x1,
@@ -522,4 +639,4 @@ y1 = _computeLinearGradien.y1,
       gradient = context.createLinearGradient(x1, y1, x2, y2);
-    } else if (type === g.GradientType.RadialGradient) {
-      var _computeRadialGradien = g.computeRadialGradient(width, height, cx, cy),
+    } else if (type === gLite.GradientType.RadialGradient) {
+      var _computeRadialGradien = gLite.computeRadialGradient(width, height, cx, cy),
           x = _computeRadialGradien.x,
@@ -565,3 +682,3 @@ y = _computeRadialGradien.y,
 
-    if (g.isString(image)) {
+    if (isString(image)) {
       return "pattern-" + image + "-" + repetition;
@@ -574,6 +691,4 @@ }
 
-tslib.__decorate([g.inject(g.CanvasConfig), tslib.__metadata("design:type", Object)], exports.ImagePool.prototype, "canvasConfig", void 0);
+exports.ImagePool = tslib.__decorate([gLite.singleton(), tslib.__param(0, gLite.inject(gLite.CanvasConfig))], exports.ImagePool);
 
-exports.ImagePool = tslib.__decorate([g.singleton()], exports.ImagePool);
-
 var _class;
@@ -583,5 +698,7 @@
 var LoadImagePlugin = LoadImagePlugin_1 = (_class = /*#__PURE__*/function () {
-  function LoadImagePlugin() {
+  function LoadImagePlugin(imagePool, renderingContext) {
     this.imagePool = void 0;
     this.renderingContext = void 0;
+    this.imagePool = imagePool;
+    this.renderingContext = renderingContext;
   }
@@ -599,6 +716,6 @@
 
-      if (nodeName === g.Shape.IMAGE) {
+      if (nodeName === gLite.Shape.IMAGE) {
         var img = attributes.img;
 
-        if (g.isString(img)) {
+        if (isString(img)) {
           _this.imagePool.getImageSync(img, function () {
@@ -618,5 +735,5 @@ // set dirty rectangle flag
 
-      if (object.nodeName === g.Shape.IMAGE) {
+      if (object.nodeName === gLite.Shape.IMAGE) {
         if (attrName === 'img') {
-          if (g.isString(newValue)) {
+          if (isString(newValue)) {
             _this.imagePool.getOrCreateImage(newValue).then(function () {
@@ -637,5 +754,5 @@ // set dirty rectangle flag
             case 0:
-              _this.renderingContext.root.addEventListener(g.ElementEvent.MOUNTED, handleMounted);
+              _this.renderingContext.root.addEventListener(gLite.ElementEvent.MOUNTED, handleMounted);
 
-              _this.renderingContext.root.addEventListener(g.ElementEvent.ATTR_MODIFIED, handleAttributeChanged);
+              _this.renderingContext.root.addEventListener(gLite.ElementEvent.ATTR_MODIFIED, handleAttributeChanged);
 
@@ -650,5 +767,5 @@ case 2:
     renderingService.hooks.destroy.tap(LoadImagePlugin_1.tag, function () {
-      _this.renderingContext.root.removeEventListener(g.ElementEvent.MOUNTED, handleMounted);
+      _this.renderingContext.root.removeEventListener(gLite.ElementEvent.MOUNTED, handleMounted);
 
-      _this.renderingContext.root.removeEventListener(g.ElementEvent.ATTR_MODIFIED, handleAttributeChanged);
+      _this.renderingContext.root.removeEventListener(gLite.ElementEvent.ATTR_MODIFIED, handleAttributeChanged);
     });
@@ -659,12 +776,7 @@ };
 }(), _class.tag = 'LoadImage', _class);
+LoadImagePlugin = LoadImagePlugin_1 = tslib.__decorate([gLite.singleton({
+  contrib: gLite.RenderingPluginContribution
+}), tslib.__param(0, gLite.inject(exports.ImagePool)), tslib.__param(1, gLite.inject(gLite.RenderingContext))], LoadImagePlugin);
 
-tslib.__decorate([g.inject(exports.ImagePool), tslib.__metadata("design:type", exports.ImagePool)], LoadImagePlugin.prototype, "imagePool", void 0);
-
-tslib.__decorate([g.inject(g.RenderingContext), tslib.__metadata("design:type", Object)], LoadImagePlugin.prototype, "renderingContext", void 0);
-
-LoadImagePlugin = LoadImagePlugin_1 = tslib.__decorate([g.singleton({
-  contrib: g.RenderingPluginContribution
-})], LoadImagePlugin);
-
-var containerModule = g.Module(function (register) {
+var containerModule = gLite.Module(function (register) {
   register(exports.ImagePool);
@@ -699,4 +811,4 @@ register(LoadImagePlugin);
   return Plugin;
-}(g.AbstractRendererPlugin);
+}(gLite.AbstractRendererPlugin);
 
 exports.Plugin = Plugin;

dist/index.umd.js

 (function (global, factory) {
-  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@antv/g')) :
-  typeof define === 'function' && define.amd ? define(['exports', '@antv/g'], factory) :
+  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@antv/g-lite')) :
+  typeof define === 'function' && define.amd ? define(['exports', '@antv/g-lite'], factory) :
   (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.G = global.G || {}, global.G.ImageLoader = {}), global.window.G));
-}(this, (function (exports, g) { 'use strict';
+}(this, (function (exports, gLite) { 'use strict';
 
@@ -425,12 +425,138 @@ function _regeneratorRuntime() {
 
-  function __metadata(metadataKey, metadataValue) {
-      if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(metadataKey, metadataValue);
+  function __param(paramIndex, decorator) {
+      return function (target, key) { decorator(target, key, paramIndex); }
   }
 
+  /** @deprecated */
+  function __spreadArrays() {
+      for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length;
+      for (var r = Array(s), k = 0, i = 0; i < il; i++)
+          for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++)
+              r[k] = a[j];
+      return r;
+  }
+
+  var toString = {}.toString;
+  var isType = function (value, type) { return toString.call(value) === '[object ' + type + ']'; };
+
+  /**
+   * 是否为函数
+   * @param  {*} fn 对象
+   * @return {Boolean}  是否函数
+   */
+  var isFunction = (function (value) {
+      return isType(value, 'Function');
+  });
+
+  var isArray = (function (value) {
+      return Array.isArray ?
+          Array.isArray(value) :
+          isType(value, 'Array');
+  });
+
+  var isObject = (function (value) {
+      /**
+       * isObject({}) => true
+       * isObject([1, 2, 3]) => true
+       * isObject(Function) => true
+       * isObject(null) => false
+       */
+      var type = typeof value;
+      return value !== null && type === 'object' || type === 'function';
+  });
+
+  function each(elements, func) {
+      if (!elements) {
+          return;
+      }
+      var rst;
+      if (isArray(elements)) {
+          for (var i = 0, len = elements.length; i < len; i++) {
+              rst = func(elements[i], i);
+              if (rst === false) {
+                  break;
+              }
+          }
+      }
+      else if (isObject(elements)) {
+          for (var k in elements) {
+              if (elements.hasOwnProperty(k)) {
+                  rst = func(elements[k], k);
+                  if (rst === false) {
+                      break;
+                  }
+              }
+          }
+      }
+  }
+
+  var isString = (function (str) {
+      return isType(str, 'String');
+  });
+
+  // @ts-ignore
+  var values = Object.values ? function (obj) { return Object.values(obj); } : function (obj) {
+      var result = [];
+      each(obj, function (value, key) {
+          if (!(isFunction(obj) && key === 'prototype')) {
+              result.push(value);
+          }
+      });
+      return result;
+  };
+
+  /**
+   * _.memoize(calColor);
+   * _.memoize(calColor, (...args) => args[0]);
+   * @param f
+   * @param resolver
+   */
+  var memoize = (function (f, resolver) {
+      if (!isFunction(f)) {
+          throw new TypeError('Expected a function');
+      }
+      var memoized = function () {
+          var args = [];
+          for (var _i = 0; _i < arguments.length; _i++) {
+              args[_i] = arguments[_i];
+          }
+          // 使用方法构造 key，如果不存在 resolver，则直接取第一个参数作为 key
+          var key = resolver ? resolver.apply(this, args) : args[0];
+          var cache = memoized.cache;
+          if (cache.has(key)) {
+              return cache.get(key);
+          }
+          var result = f.apply(this, args);
+          // 缓存起来
+          cache.set(key, result);
+          return result;
+      };
+      memoized.cache = new Map();
+      return memoized;
+  });
+
+  var ctx;
+  /**
+   * 计算文本的宽度
+   */
+  memoize(function (text, font) {
+      if (font === void 0) { font = {}; }
+      var fontSize = font.fontSize, fontFamily = font.fontFamily, fontWeight = font.fontWeight, fontStyle = font.fontStyle, fontVariant = font.fontVariant;
+      if (!ctx) {
+          ctx = document.createElement('canvas').getContext('2d');
+      }
+      ctx.font = [fontStyle, fontVariant, fontWeight, fontSize + "px", fontFamily].join(' ');
+      return ctx.measureText(isString(text) ? text : '').width;
+  }, function (text, font) {
+      if (font === void 0) { font = {}; }
+      return __spreadArrays([text], values(font)).join('');
+  });
+
   exports.ImagePool = /*#__PURE__*/function () {
-    function ImagePool() {
+    function ImagePool(canvasConfig) {
+      this.canvasConfig = void 0;
       this.imageCache = {};
       this.gradientCache = {};
       this.patternCache = {};
-      this.canvasConfig = void 0;
+      this.canvasConfig = canvasConfig;
     }
@@ -470,3 +596,3 @@
           image = createImage(src);
-        } else if (g.isBrowser) {
+        } else if (gLite.isBrowser) {
           image = new window.Image();
@@ -502,3 +628,3 @@ }
 
-      if (g.isString(image)) {
+      if (isString(image)) {
         src = this.getImageSync(image, callback);
@@ -536,4 +662,4 @@ } else {
 
-      if (type === g.GradientType.LinearGradient) {
-        var _computeLinearGradien = g.computeLinearGradient(width, height, angle),
+      if (type === gLite.GradientType.LinearGradient) {
+        var _computeLinearGradien = gLite.computeLinearGradient(width, height, angle),
             x1 = _computeLinearGradien.x1,
@@ -546,4 +672,4 @@ y1 = _computeLinearGradien.y1,
         gradient = context.createLinearGradient(x1, y1, x2, y2);
-      } else if (type === g.GradientType.RadialGradient) {
-        var _computeRadialGradien = g.computeRadialGradient(width, height, cx, cy),
+      } else if (type === gLite.GradientType.RadialGradient) {
+        var _computeRadialGradien = gLite.computeRadialGradient(width, height, cx, cy),
             x = _computeRadialGradien.x,
@@ -589,3 +715,3 @@ y = _computeRadialGradien.y,
 
-      if (g.isString(image)) {
+      if (isString(image)) {
         return "pattern-" + image + "-" + repetition;
@@ -598,6 +724,4 @@ }
 
-  __decorate([g.inject(g.CanvasConfig), __metadata("design:type", Object)], exports.ImagePool.prototype, "canvasConfig", void 0);
+  exports.ImagePool = __decorate([gLite.singleton(), __param(0, gLite.inject(gLite.CanvasConfig))], exports.ImagePool);
 
-  exports.ImagePool = __decorate([g.singleton()], exports.ImagePool);
-
   var _class;
@@ -607,5 +731,7 @@
   var LoadImagePlugin = LoadImagePlugin_1 = (_class = /*#__PURE__*/function () {
-    function LoadImagePlugin() {
+    function LoadImagePlugin(imagePool, renderingContext) {
       this.imagePool = void 0;
       this.renderingContext = void 0;
+      this.imagePool = imagePool;
+      this.renderingContext = renderingContext;
     }
@@ -623,6 +749,6 @@
 
-        if (nodeName === g.Shape.IMAGE) {
+        if (nodeName === gLite.Shape.IMAGE) {
           var img = attributes.img;
 
-          if (g.isString(img)) {
+          if (isString(img)) {
             _this.imagePool.getImageSync(img, function () {
@@ -642,5 +768,5 @@ // set dirty rectangle flag
 
-        if (object.nodeName === g.Shape.IMAGE) {
+        if (object.nodeName === gLite.Shape.IMAGE) {
           if (attrName === 'img') {
-            if (g.isString(newValue)) {
+            if (isString(newValue)) {
               _this.imagePool.getOrCreateImage(newValue).then(function () {
@@ -661,5 +787,5 @@ // set dirty rectangle flag
               case 0:
-                _this.renderingContext.root.addEventListener(g.ElementEvent.MOUNTED, handleMounted);
+                _this.renderingContext.root.addEventListener(gLite.ElementEvent.MOUNTED, handleMounted);
 
-                _this.renderingContext.root.addEventListener(g.ElementEvent.ATTR_MODIFIED, handleAttributeChanged);
+                _this.renderingContext.root.addEventListener(gLite.ElementEvent.ATTR_MODIFIED, handleAttributeChanged);
 
@@ -674,5 +800,5 @@ case 2:
       renderingService.hooks.destroy.tap(LoadImagePlugin_1.tag, function () {
-        _this.renderingContext.root.removeEventListener(g.ElementEvent.MOUNTED, handleMounted);
+        _this.renderingContext.root.removeEventListener(gLite.ElementEvent.MOUNTED, handleMounted);
 
-        _this.renderingContext.root.removeEventListener(g.ElementEvent.ATTR_MODIFIED, handleAttributeChanged);
+        _this.renderingContext.root.removeEventListener(gLite.ElementEvent.ATTR_MODIFIED, handleAttributeChanged);
       });
@@ -683,12 +809,7 @@ };
   }(), _class.tag = 'LoadImage', _class);
+  LoadImagePlugin = LoadImagePlugin_1 = __decorate([gLite.singleton({
+    contrib: gLite.RenderingPluginContribution
+  }), __param(0, gLite.inject(exports.ImagePool)), __param(1, gLite.inject(gLite.RenderingContext))], LoadImagePlugin);
 
-  __decorate([g.inject(exports.ImagePool), __metadata("design:type", exports.ImagePool)], LoadImagePlugin.prototype, "imagePool", void 0);
-
-  __decorate([g.inject(g.RenderingContext), __metadata("design:type", Object)], LoadImagePlugin.prototype, "renderingContext", void 0);
-
-  LoadImagePlugin = LoadImagePlugin_1 = __decorate([g.singleton({
-    contrib: g.RenderingPluginContribution
-  })], LoadImagePlugin);
-
-  var containerModule = g.Module(function (register) {
+  var containerModule = gLite.Module(function (register) {
     register(exports.ImagePool);
@@ -723,3 +844,3 @@ register(LoadImagePlugin);
     return Plugin;
-  }(g.AbstractRendererPlugin);
+  }(gLite.AbstractRendererPlugin);
 
@@ -726,0 +847,0 @@ exports.Plugin = Plugin;

dist/index.umd.min.js

@@ -1,3 +0,3 @@
-!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("@antv/g")):"function"==typeof define&&define.amd?define(["exports","@antv/g"],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(){
+!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(){
 /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */
-r=function(){return t};var t={},e=Object.prototype,n=e.hasOwnProperty,o="function"==typeof Symbol?Symbol:{},i=o.iterator||"@@iterator",a=o.asyncIterator||"@@asyncIterator",c=o.toStringTag||"@@toStringTag";function u(t,e,r){return Object.defineProperty(t,e,{value:r,enumerable:!0,configurable:!0,writable:!0}),t[e]}try{u({},"")}catch(t){u=function(t,e,r){return t[e]=r}}function f(t,e,r,n){var o=Object.create((e&&e.prototype instanceof l?e:l).prototype),i=new C(n||[]);return o._invoke=function(t,e,r){var n="suspendedStart";return function(o,i){if("executing"===n)throw new Error("Generator is already running");if("completed"===n){if("throw"===o)throw i;return O()}for(r.method=o,r.arg=i;;){var a=r.delegate;if(a){var c=b(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)}}}(t,r,i),o}function s(t,e,r){try{return{type:"normal",arg:t.call(e,r)}}catch(t){return{type:"throw",arg:t}}}t.wrap=f;var h={};function l(){}function d(){}function p(){}var g={};u(g,i,(function(){return this}));var v=Object.getPrototypeOf,y=v&&v(v(P([])));y&&y!==e&&n.call(y,i)&&(g=y);var m=p.prototype=l.prototype=Object.create(g);function w(t){["next","throw","return"].forEach((function(e){u(t,e,(function(t){return this._invoke(e,t)}))}))}function x(t,e){function r(o,i,a,c){var u=s(t[o],t,i);if("throw"!==u.type){var f=u.arg,h=f.value;return h&&"object"==typeof h&&n.call(h,"__await")?e.resolve(h.__await).then((function(t){r("next",t,a,c)}),(function(t){r("throw",t,a,c)})):e.resolve(h).then((function(t){f.value=t,a(f)}),(function(t){return r("throw",t,a,c)}))}c(u.arg)}var o;this._invoke=function(t,n){function i(){return new e((function(e,o){r(t,n,e,o)}))}return o=o?o.then(i,i):i()}}function b(t,e){var r=t.iterator[e.method];if(void 0===r){if(e.delegate=null,"throw"===e.method){if(t.iterator.return&&(e.method="return",e.arg=void 0,b(t,e),"throw"===e.method))return h;e.method="throw",e.arg=new TypeError("The iterator does not provide a 'throw' method")}return h}var n=s(r,t.iterator,e.arg);if("throw"===n.type)return e.method="throw",e.arg=n.arg,e.delegate=null,h;var o=n.arg;return o?o.done?(e[t.resultName]=o.value,e.next=t.nextLoc,"return"!==e.method&&(e.method="next",e.arg=void 0),e.delegate=null,h):o:(e.method="throw",e.arg=new TypeError("iterator result is not an object"),e.delegate=null,h)}function E(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 L(t){var e=t.completion||{};e.type="normal",delete e.arg,t.completion=e}function C(t){this.tryEntries=[{tryLoc:"root"}],t.forEach(E,this),this.reset(!0)}function P(t){if(t){var e=t[i];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:O}}function O(){return{value:void 0,done:!0}}return d.prototype=p,u(m,"constructor",p),u(p,"constructor",d),d.displayName=u(p,c,"GeneratorFunction"),t.isGeneratorFunction=function(t){var e="function"==typeof t&&t.constructor;return!!e&&(e===d||"GeneratorFunction"===(e.displayName||e.name))},t.mark=function(t){return Object.setPrototypeOf?Object.setPrototypeOf(t,p):(t.__proto__=p,u(t,c,"GeneratorFunction")),t.prototype=Object.create(m),t},t.awrap=function(t){return{__await:t}},w(x.prototype),u(x.prototype,a,(function(){return this})),t.AsyncIterator=x,t.async=function(e,r,n,o,i){void 0===i&&(i=Promise);var a=new x(f(e,r,n,o),i);return t.isGeneratorFunction(r)?a:a.next().then((function(t){return t.done?t.value:a.next()}))},w(m),u(m,c,"Generator"),u(m,i,(function(){return this})),u(m,"toString",(function(){return"[object Generator]"})),t.keys=function(t){var e=[];for(var r in t)e.push(r);return e.reverse(),function r(){for(;e.length;){var n=e.pop();if(n in t)return r.value=n,r.done=!1,r}return r.done=!0,r}},t.values=P,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(L),!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 new 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),L(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;L(r)}return o}}throw new Error("illegal catch attempt")},delegateYield:function(t,e,r){return this.delegate={iterator:P(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){return i=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(t,e){return t.__proto__=e,t},i(t,e)}function a(t,e,r,n){var o,i=arguments.length,a=3>i?e:null===n?n=Object.getOwnPropertyDescriptor(e,r):n;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(t,e,r,n);else for(var c=t.length-1;c>=0;c--)(o=t[c])&&(a=(3>i?o(a):i>3?o(e,r,a):o(e,r))||a);return i>3&&a&&Object.defineProperty(e,r,a),a}function c(t,e){if("object"==typeof Reflect&&"function"==typeof Reflect.metadata)return Reflect.metadata(t,e)}var u,f;t.ImagePool=function(){function t(){this.imageCache={},this.gradientCache={},this.patternCache={},this.canvasConfig=void 0}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){var o=this.generatePatternKey(t);if(o&&this.patternCache[o])return this.patternCache[o];var i,a=t.image,c=t.repetition,u=(i=e.isString(a)?this.getImageSync(a,n):a)&&r.createPattern(i,c);return o&&u&&(this.patternCache[o]=u),u},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;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 l=e.computeRadialGradient(a,c,u,f),d=l.x,p=l.y;s=r.createRadialGradient(d,p,0,d,p,l.r)}return s&&(i.forEach((function(t){var e;null===(e=s)||void 0===e||e.addColorStop(t[0],t[1])})),this.gradientCache[n]=s),this.gradientCache[n]},r.generateGradientKey=function(t){return"gradient-"+t.type+"-"+(t.angle||0)+"-"+(t.cx||0)+"-"+(t.cy||0)+"-"+t.width+"-"+t.height+"-"+t.steps.map((function(t){return t.join("")})).join("-")},r.generatePatternKey=function(t){var r=t.image,n=t.repetition;if(e.isString(r))return"pattern-"+r+"-"+n},t}(),a([e.inject(e.CanvasConfig),c("design:type",Object)],t.ImagePool.prototype,"canvasConfig",void 0),t.ImagePool=a([e.singleton()],t.ImagePool);var s=(u=function(){function t(){this.imagePool=void 0,this.renderingContext=void 0}return t.prototype.apply=function(t){var n=this,i=function(r){var o=r.target;if(o.nodeName===e.Shape.IMAGE){var i=o.attributes.img;e.isString(i)&&n.imagePool.getImageSync(i,(function(){o.renderable.dirty=!0,t.dirtify()}))}},a=function(r){var o=r.target,i=r.newValue;o.nodeName===e.Shape.IMAGE&&"img"===r.attrName&&e.isString(i)&&n.imagePool.getOrCreateImage(i).then((function(){o.renderable.dirty=!0,t.dirtify()}))};t.hooks.init.tapPromise(f.tag,o(r().mark((function t(){return r().wrap((function(t){for(;;)switch(t.prev=t.next){case 0:n.renderingContext.root.addEventListener(e.ElementEvent.MOUNTED,i),n.renderingContext.root.addEventListener(e.ElementEvent.ATTR_MODIFIED,a);case 2:case"end":return t.stop()}}),t)})))),t.hooks.destroy.tap(f.tag,(function(){n.renderingContext.root.removeEventListener(e.ElementEvent.MOUNTED,i),n.renderingContext.root.removeEventListener(e.ElementEvent.ATTR_MODIFIED,a)}))},t}(),u.tag="LoadImage",f=u);a([e.inject(t.ImagePool),c("design:type",t.ImagePool)],s.prototype,"imagePool",void 0),a([e.inject(e.RenderingContext),c("design:type",Object)],s.prototype,"renderingContext",void 0),s=f=a([e.singleton({contrib:e.RenderingPluginContribution})],s);var h=e.Module((function(e){e(t.ImagePool),e(s)})),l=function(t){var e,r;function n(){for(var e,r=arguments.length,n=new 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}r=t,(e=n).prototype=Object.create(r.prototype),e.prototype.constructor=e,i(e,r);var o=n.prototype;return o.init=function(){this.container.load(h,!0)},o.destroy=function(){this.container.unload(h)},n}(e.AbstractRendererPlugin);t.Plugin=l,Object.defineProperty(t,"__esModule",{value:!0})}));
+r=function(){return t};var t={},e=Object.prototype,n=e.hasOwnProperty,o="function"==typeof Symbol?Symbol:{},i=o.iterator||"@@iterator",a=o.asyncIterator||"@@asyncIterator",c=o.toStringTag||"@@toStringTag";function u(t,e,r){return Object.defineProperty(t,e,{value:r,enumerable:!0,configurable:!0,writable:!0}),t[e]}try{u({},"")}catch(t){u=function(t,e,r){return t[e]=r}}function f(t,e,r,n){var o=Object.create((e&&e.prototype instanceof l?e:l).prototype),i=new C(n||[]);return o._invoke=function(t,e,r){var n="suspendedStart";return function(o,i){if("executing"===n)throw new Error("Generator is already running");if("completed"===n){if("throw"===o)throw i;return P()}for(r.method=o,r.arg=i;;){var a=r.delegate;if(a){var c=E(a,r);if(c){if(c===s)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===s)continue;return{value:u.arg,done:r.done}}"throw"===u.type&&(n="completed",r.method="throw",r.arg=u.arg)}}}(t,r,i),o}function h(t,e,r){try{return{type:"normal",arg:t.call(e,r)}}catch(t){return{type:"throw",arg:t}}}t.wrap=f;var s={};function l(){}function p(){}function d(){}var v={};u(v,i,(function(){return this}));var g=Object.getPrototypeOf,y=g&&g(g(O([])));y&&y!==e&&n.call(y,i)&&(v=y);var m=d.prototype=l.prototype=Object.create(v);function w(t){["next","throw","return"].forEach((function(e){u(t,e,(function(t){return this._invoke(e,t)}))}))}function x(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 o;this._invoke=function(t,n){function i(){return new e((function(e,o){r(t,n,e,o)}))}return o=o?o.then(i,i):i()}}function E(t,e){var r=t.iterator[e.method];if(void 0===r){if(e.delegate=null,"throw"===e.method){if(t.iterator.return&&(e.method="return",e.arg=void 0,E(t,e),"throw"===e.method))return s;e.method="throw",e.arg=new TypeError("The iterator does not provide a 'throw' method")}return s}var n=h(r,t.iterator,e.arg);if("throw"===n.type)return e.method="throw",e.arg=n.arg,e.delegate=null,s;var o=n.arg;return o?o.done?(e[t.resultName]=o.value,e.next=t.nextLoc,"return"!==e.method&&(e.method="next",e.arg=void 0),e.delegate=null,s):o:(e.method="throw",e.arg=new TypeError("iterator result is not an object"),e.delegate=null,s)}function b(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 L(t){var e=t.completion||{};e.type="normal",delete e.arg,t.completion=e}function C(t){this.tryEntries=[{tryLoc:"root"}],t.forEach(b,this),this.reset(!0)}function O(t){if(t){var e=t[i];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:P}}function P(){return{value:void 0,done:!0}}return p.prototype=d,u(m,"constructor",d),u(d,"constructor",p),p.displayName=u(d,c,"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,d):(t.__proto__=d,u(t,c,"GeneratorFunction")),t.prototype=Object.create(m),t},t.awrap=function(t){return{__await:t}},w(x.prototype),u(x.prototype,a,(function(){return this})),t.AsyncIterator=x,t.async=function(e,r,n,o,i){void 0===i&&(i=Promise);var a=new x(f(e,r,n,o),i);return t.isGeneratorFunction(r)?a:a.next().then((function(t){return t.done?t.value:a.next()}))},w(m),u(m,c,"Generator"),u(m,i,(function(){return this})),u(m,"toString",(function(){return"[object Generator]"})),t.keys=function(t){var e=[];for(var r in t)e.push(r);return e.reverse(),function r(){for(;e.length;){var n=e.pop();if(n in t)return r.value=n,r.done=!1,r}return r.done=!0,r}},t.values=O,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(L),!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 new 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,s):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),s},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),L(r),s}},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;L(r)}return o}}throw new Error("illegal catch attempt")},delegateYield:function(t,e,r){return this.delegate={iterator:O(t),resultName:e,nextLoc:r},"next"===this.method&&(this.arg=void 0),s}},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)}function a(t,e,r,n){var o,i=arguments.length,a=3>i?e:null===n?n=Object.getOwnPropertyDescriptor(e,r):n;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(t,e,r,n);else for(var c=t.length-1;c>=0;c--)(o=t[c])&&(a=(3>i?o(a):i>3?o(e,r,a):o(e,r))||a);return i>3&&a&&Object.defineProperty(e,r,a),a}function c(t,e){return function(r,n){e(r,n,t)}}var u={}.toString,f=function(t,e){return u.call(t)==="[object "+e+"]"},h=function(t){return f(t,"Function")};function s(t,e){var r;if(t)if(r=t,Array.isArray?Array.isArray(r):f(r,"Array"))for(var n=0,o=t.length;o>n&&!1!==e(t[n],n);n++);else if(function(t){var e=typeof t;return null!==t&&"object"===e||"function"===e}(t))for(var i in t)if(t.hasOwnProperty(i)&&!1===e(t[i],i))break}var l,p,d,v=function(t){return f(t,"String")},g=Object.values?function(t){return Object.values(t)}:function(t){var e=[];return s(t,(function(r,n){h(t)&&"prototype"===n||e.push(r)})),e};!function(t,e){if(!h(t))throw new TypeError("Expected a function");var r=function(){for(var n=[],o=0;arguments.length>o;o++)n[o]=arguments[o];var i=e?e.apply(this,n):n[0],a=r.cache;if(a.has(i))return a.get(i);var c=t.apply(this,n);return a.set(i,c),c};r.cache=new Map}((function(t,e){void 0===e&&(e={});var r=e.fontSize,n=e.fontFamily,o=e.fontWeight,i=e.fontStyle,a=e.fontVariant;return l||(l=document.createElement("canvas").getContext("2d")),l.font=[i,a,o,r+"px",n].join(" "),l.measureText(v(t)?t:"").width}),(function(t,e){return void 0===e&&(e={}),function(){for(var t=0,e=0,r=arguments.length;r>e;e++)t+=arguments[e].length;var n=Array(t),o=0;for(e=0;r>e;e++)for(var i=arguments[e],a=0,c=i.length;c>a;a++,o++)n[o]=i[a];return n}([t],g(e)).join("")})),t.ImagePool=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,e,r){var n=this.generatePatternKey(t);if(n&&this.patternCache[n])return this.patternCache[n];var o,i=t.image,a=t.repetition,c=(o=v(i)?this.getImageSync(i,r):i)&&e.createPattern(o,a);return n&&c&&(this.patternCache[n]=c),c},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;if(this.gradientCache[n])return this.gradientCache[n];var h=null;if(o===e.GradientType.LinearGradient){var s=e.computeLinearGradient(a,c,t.angle);h=r.createLinearGradient(s.x1,s.y1,s.x2,s.y2)}else if(o===e.GradientType.RadialGradient){var l=e.computeRadialGradient(a,c,u,f),p=l.x,d=l.y;h=r.createRadialGradient(p,d,0,p,d,l.r)}return h&&(i.forEach((function(t){var e;null===(e=h)||void 0===e||e.addColorStop(t[0],t[1])})),this.gradientCache[n]=h),this.gradientCache[n]},r.generateGradientKey=function(t){return"gradient-"+t.type+"-"+(t.angle||0)+"-"+(t.cx||0)+"-"+(t.cy||0)+"-"+t.width+"-"+t.height+"-"+t.steps.map((function(t){return t.join("")})).join("-")},r.generatePatternKey=function(t){var e=t.image,r=t.repetition;if(v(e))return"pattern-"+e+"-"+r},t}(),t.ImagePool=a([e.singleton(),c(0,e.inject(e.CanvasConfig))],t.ImagePool);var y=(p=function(){function t(t,e){this.imagePool=void 0,this.renderingContext=void 0,this.imagePool=t,this.renderingContext=e}return t.prototype.apply=function(t){var n=this,i=function(r){var o=r.target;if(o.nodeName===e.Shape.IMAGE){var i=o.attributes.img;v(i)&&n.imagePool.getImageSync(i,(function(){o.renderable.dirty=!0,t.dirtify()}))}},a=function(r){var o=r.target,i=r.newValue;o.nodeName===e.Shape.IMAGE&&"img"===r.attrName&&v(i)&&n.imagePool.getOrCreateImage(i).then((function(){o.renderable.dirty=!0,t.dirtify()}))};t.hooks.init.tapPromise(d.tag,o(r().mark((function t(){return r().wrap((function(t){for(;;)switch(t.prev=t.next){case 0:n.renderingContext.root.addEventListener(e.ElementEvent.MOUNTED,i),n.renderingContext.root.addEventListener(e.ElementEvent.ATTR_MODIFIED,a);case 2:case"end":return t.stop()}}),t)})))),t.hooks.destroy.tap(d.tag,(function(){n.renderingContext.root.removeEventListener(e.ElementEvent.MOUNTED,i),n.renderingContext.root.removeEventListener(e.ElementEvent.ATTR_MODIFIED,a)}))},t}(),p.tag="LoadImage",d=p);y=d=a([e.singleton({contrib:e.RenderingPluginContribution}),c(0,e.inject(t.ImagePool)),c(1,e.inject(e.RenderingContext))],y);var m=e.Module((function(e){e(t.ImagePool),e(y)})),w=function(t){var e,r;function n(){for(var e,r=arguments.length,n=new 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}r=t,(e=n).prototype=Object.create(r.prototype),e.prototype.constructor=e,i(e,r);var o=n.prototype;return o.init=function(){this.container.load(m,!0)},o.destroy=function(){this.container.unload(m)},n}(e.AbstractRendererPlugin);t.Plugin=w,Object.defineProperty(t,"__esModule",{value:!0})}));

dist/LoadImagePlugin.d.ts

@@ -1,8 +0,11 @@
-import type { RenderingPlugin, RenderingService } from '@antv/g';
+import type { RenderingPlugin, RenderingService } from '@antv/g-lite';
+import { RenderingContext } from '@antv/g-lite';
+import { ImagePool } from './ImagePool';
 export declare class LoadImagePlugin implements RenderingPlugin {
-    static tag: string;
     private imagePool;
     private renderingContext;
+    static tag: string;
+    constructor(imagePool: ImagePool, renderingContext: RenderingContext);
     apply(renderingService: RenderingService): void;
 }
 //# sourceMappingURL=LoadImagePlugin.d.ts.map

package.json

 {
   "name": "@antv/g-plugin-image-loader",
-  "version": "1.1.12",
+  "version": "1.1.13",
   "description": "A G plugin for loading image",
@@ -36,3 +36,3 @@ "keywords": [
   "peerDependencies": {
-    "@antv/g": "^5.0.1"
+    "@antv/g-lite": "^1.0.0"
   },
@@ -42,3 +42,3 @@ "publishConfig": {
   },
-  "gitHead": "32c0eab45e1b2350b9d1b12895b05e90e1fc7971"
+  "gitHead": "d2a0433cdcc3f58ba90513d1054dd824ab1491a5"
 }

No alert changes

Improved metrics

Total package byte prevSize

100556

increased by12.59%

Lines of code

2125

increased by18.85%

No dependency changes