xctc-utils 1.6.67 → 1.6.69

package/dist/canvas/index.js

@@ -1,39 +1,28 @@
 "use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
 Object.defineProperty(exports, "__esModule", { value: true });
-var config_1 = require("../config");
-var utils_1 = require("../utils");
-var is_1 = require("../is");
-var has_1 = require("../is/has");
-var register_1 = require("../handle/register");
-var drop_1 = require("../event/drop");
-var mouse_down_1 = require("../event/mouse-down");
-var mouse_move_1 = require("../event/mouse-move");
-var mouse_up_1 = require("../event/mouse-up");
-var mouse_wheel_1 = require("../event/mouse-wheel");
-var index_1 = require("../handle/index");
-var drop_2 = require("../event/drop");
-var create_1 = require("../handle/create");
-var query_1 = require("../handle/query");
-var update_1 = require("../handle/update");
-var changed_1 = require("../event/changed");
-var index_2 = require("../event/index");
+const config_1 = require("../config");
+const utils_1 = require("../utils");
+const is_1 = require("../is");
+const has_1 = require("../is/has");
+const register_1 = require("../handle/register");
+const drop_1 = require("../event/drop");
+const mouse_down_1 = require("../event/mouse-down");
+const mouse_move_1 = require("../event/mouse-move");
+const mouse_up_1 = require("../event/mouse-up");
+const mouse_wheel_1 = require("../event/mouse-wheel");
+const index_1 = require("../handle/index");
+const drop_2 = require("../event/drop");
+const create_1 = require("../handle/create");
+const query_1 = require("../handle/query");
+const update_1 = require("../handle/update");
+const changed_1 = require("../event/changed");
+const index_2 = require("../event/index");
 // 初始化画布创建时需要的参数-默认值
-var defaultConfig = __assign({}, config_1.configDefaultValue.canvasDefaultValue);
-var CanvasHooks = /** @class */ (function () {
-    function CanvasHooks(config) {
+const defaultConfig = { ...config_1.configDefaultValue.canvasDefaultValue };
+class CanvasHooks {
+    constructor(config) {
         this.fabricSource = null;
-        this.fabricUrlSource = "https://cdn.jsdelivr.net/npm/fabric";
+        this.fabricUrlSource = "https://cdn.bootcss.com/fabric.js/4.0.0-beta.5/fabric.min.js";
         this.canvasDataSource = null;
         this.zoomDataSource = "100";
         this.canvasBackgroundImageTarget = null;
@@ -63,24 +52,26 @@ var CanvasHooks = /** @class */ (function () {
         this.mouseWheelStatus = false;
         this.defaultCreateDataListStatus = false;
         this.mouseCanvasInRangeStatus = false;
+        const url = this.fabricUrlSource;
         if (config === null || config === void 0 ? void 0 : config.init) {
-            // 是否默认加载画布
-            this.createCanvasFn();
+            (0, utils_1.loadScript)(url, () => {
+                // 是否默认加载画布
+                this.createCanvasFn();
+            });
+        }
+        else {
+            (0, utils_1.loadScript)(url);
         }
     }
-    Object.defineProperty(CanvasHooks.prototype, "canvasConfigData", {
-        get: function () {
-            return this.canvasConfig;
-        },
-        enumerable: false,
-        configurable: true
-    });
+    get canvasConfigData() {
+        return this.canvasConfig;
+    }
     // 创建画布
-    CanvasHooks.prototype.createCanvasFn = function (config) {
+    createCanvasFn(config) {
         var _a;
-        var _ = this;
+        const _ = this;
         _.renderCanvasStatus = 1;
-        var canvasId = "";
+        let canvasId = "";
         // config 配置数据必须有画布ID参数
         if ((0, is_1.isObject)(config) && !(0, has_1.hasProperty)(config, "id")) {
             console.error("createCanvasFn函数接收的参数必须包含画布对应的id");
@@ -94,124 +85,135 @@ var CanvasHooks = /** @class */ (function () {
             }
         }
         // 初始化画布渲染时的配置参数
-        var data = __assign(__assign({}, defaultConfig), _.canvasConfig);
+        const data = {
+            ...defaultConfig,
+            ..._.canvasConfig
+        };
         if (!(0, has_1.hasProperty)(_.canvasConfig, "width")) {
             data['width'] = _.elementSizeFn("canvasContainer").width;
         }
         if (!(0, has_1.hasProperty)(_.canvasConfig, "height")) {
             data['height'] = _.elementSizeFn("canvasContainer").height;
         }
-        var imgUrl = (data === null || data === void 0 ? void 0 : data.backgroundImgUrl) || "";
-        console.log("canvas--options", data);
+        const imgUrl = (data === null || data === void 0 ? void 0 : data.backgroundImgUrl) || "";
         canvasId = data.id;
-        var url = _.fabricUrlSource;
+        let url = _.fabricUrlSource;
         if ((_a = _.canvasConfig) === null || _a === void 0 ? void 0 : _a.fabricUrlSource) {
             url = _.canvasConfig.fabricUrlSource;
         }
         if (config === null || config === void 0 ? void 0 : config.fabricUrlSource) {
             url = config.fabricUrlSource;
         }
-        (0, utils_1.loadScript)(url, function () {
-            var win = window;
-            _.fabricSource = (win === null || win === void 0 ? void 0 : win.fabric) || {};
-            if (imgUrl) {
-                _.fabricSource.Image.fromURL(imgUrl, function (img) {
-                    _.renderCanvasStatus = 2;
-                    _.canvasBackgroundImageTarget = img;
-                    var _a = _.canvasConfig.actions, actions = _a === void 0 ? "" : _a;
-                    var zoomValue = (actions === null || actions === void 0 ? void 0 : actions.zoom) || 1;
-                    if (!_.canvasDataSource) {
-                        _.canvasDataSource = new _.fabricSource.Canvas(canvasId, __assign({}, data));
-                        if (zoomValue != 1) {
-                            _.canvasDataSource.setZoom(zoomValue);
-                        }
+        if (!(0, utils_1.isScriptLoaded)(url)) {
+            (0, utils_1.loadScript)(url, () => {
+                _.initCanvasDataFn(imgUrl, canvasId, data);
+            });
+        }
+        else {
+            _.initCanvasDataFn(imgUrl, canvasId, data);
+        }
+    }
+    initCanvasDataFn(imgUrl, canvasId, data) {
+        const _ = this;
+        const win = window;
+        _.fabricSource = (win === null || win === void 0 ? void 0 : win.fabric) || {};
+        if (imgUrl) {
+            _.fabricSource.Image.fromURL(imgUrl, function (img) {
+                _.renderCanvasStatus = 2;
+                _.canvasBackgroundImageTarget = img;
+                const { actions = "" } = _.canvasConfig;
+                const zoomValue = (actions === null || actions === void 0 ? void 0 : actions.zoom) || 1;
+                if (!_.canvasDataSource) {
+                    _.canvasDataSource = new _.fabricSource.Canvas(canvasId, { ...data });
+                    if (zoomValue != 1) {
+                        _.canvasDataSource.setZoom(zoomValue);
                     }
-                    var canvasWidth = _.canvasDataSource.getWidth();
-                    var canvasHeight = _.canvasDataSource.getHeight();
-                    var imgWidth = img.width;
-                    var imgHeight = img.height;
-                    var scaleX = 1;
-                    var scaleY = 1;
-                    if (canvasWidth && canvasHeight && imgWidth && imgHeight) {
-                        var imageAspectRatio = imgWidth / imgHeight;
-                        var canvasAspectRatio = canvasWidth / canvasHeight;
-                        if (imageAspectRatio > canvasAspectRatio) {
-                            // 图片更宽，基于高度缩放
-                            scaleY = canvasHeight / imgHeight;
-                            scaleX = scaleY * imageAspectRatio;
-                        }
-                        else {
-                            // 图片更高或宽高比相同，基于宽度缩放
-                            scaleX = canvasWidth / imgWidth;
-                            scaleY = scaleX / imageAspectRatio;
-                        }
+                }
+                const canvasWidth = _.canvasDataSource.getWidth();
+                const canvasHeight = _.canvasDataSource.getHeight();
+                const imgWidth = img.width;
+                const imgHeight = img.height;
+                let scaleX = 1;
+                let scaleY = 1;
+                if (canvasWidth && canvasHeight && imgWidth && imgHeight) {
+                    let imageAspectRatio = imgWidth / imgHeight;
+                    let canvasAspectRatio = canvasWidth / canvasHeight;
+                    if (imageAspectRatio > canvasAspectRatio) {
+                        // 图片更宽，基于高度缩放
+                        scaleY = canvasHeight / imgHeight;
+                        scaleX = scaleY * imageAspectRatio;
+                    }
+                    else {
+                        // 图片更高或宽高比相同，基于宽度缩放
+                        scaleX = canvasWidth / imgWidth;
+                        scaleY = scaleX / imageAspectRatio;
                     }
-                    console.log("原始比例：", { scaleX: scaleX, scaleY: scaleY, width: imgWidth, height: imgHeight });
-                    _.canvasDataSource.setBackgroundImage(img, _.canvasDataSource.renderAll.bind(_.canvasDataSource), {
-                        originX: 'left',
-                        originY: 'top',
-                        left: 0,
-                        top: 0,
-                        // scaleX: scaleX,
-                        // scaleY: scaleY,
-                        width: imgWidth,
-                        height: imgHeight,
-                    });
-                    _.renderCanvasStatus = 3;
-                    _.registerAllEventHandleFn();
-                    _.canvasDataSource.renderAll();
-                    callBack(_.canvasDataSource);
-                });
-            }
-            else {
-                if (!_.canvasDataSource) {
-                    _.canvasDataSource = new _.fabricSource.Canvas(canvasId, __assign({}, data));
-                    _.renderCanvasStatus = 3;
-                    _.registerAllEventHandleFn();
-                    _.canvasDataSource.renderAll();
-                    callBack(_.canvasDataSource);
                 }
+                console.log("原始比例：", { scaleX: scaleX, scaleY: scaleY, width: imgWidth, height: imgHeight });
+                _.canvasDataSource.setBackgroundImage(img, _.canvasDataSource.renderAll.bind(_.canvasDataSource), {
+                    originX: 'left',
+                    originY: 'top',
+                    left: 0,
+                    top: 0,
+                    // scaleX: scaleX,
+                    // scaleY: scaleY,
+                    width: imgWidth,
+                    height: imgHeight,
+                });
+                _.renderCanvasStatus = 3;
+                _.registerAllEventHandleFn();
+                _.canvasDataSource.renderAll();
+                callBack(_.canvasDataSource);
+            });
+        }
+        else {
+            if (!_.canvasDataSource) {
+                _.canvasDataSource = new _.fabricSource.Canvas(canvasId, { ...data });
+                _.renderCanvasStatus = 3;
+                _.registerAllEventHandleFn();
+                _.canvasDataSource.renderAll();
+                callBack(_.canvasDataSource);
             }
-            // 如果配置里面有回调函数，则将当前画布数据对象返回
-            function callBack(data) {
-                var _a;
-                var cb = ((_a = _.canvasConfig) === null || _a === void 0 ? void 0 : _a.cb) || "";
-                // 获取DOM元素
-                var targetElement = (0, utils_1.getDomFn)("canvasContainer");
-                // 添加事件监听器
-                document.addEventListener('mousemove', (0, index_2.checkMouseInElement)(targetElement));
-                if (cb instanceof Function) {
-                    cb(data);
-                }
+        }
+        // 如果配置里面有回调函数，则将当前画布数据对象返回
+        function callBack(data) {
+            var _a;
+            const cb = ((_a = _.canvasConfig) === null || _a === void 0 ? void 0 : _a.cb) || "";
+            // 获取DOM元素
+            const targetElement = (0, utils_1.getDomFn)("canvasContainer");
+            // 添加事件监听器
+            document.addEventListener('mousemove', (0, index_2.checkMouseInElement)(targetElement));
+            if (cb instanceof Function) {
+                cb(data);
             }
-        });
-    };
+        }
+    }
     // 销毁画布
-    CanvasHooks.prototype.disposeCanvasFn = function () {
+    disposeCanvasFn() {
         var _a, _b;
         if (this.canvasDataSource) {
-            var el = (_a = this.canvasDataSource) === null || _a === void 0 ? void 0 : _a.getElement();
+            const el = (_a = this.canvasDataSource) === null || _a === void 0 ? void 0 : _a.getElement();
             (_b = this.canvasDataSource) === null || _b === void 0 ? void 0 : _b.dispose();
             el === null || el === void 0 ? void 0 : el.remove(); // 删除canvasDataSource元素
             this.canvasDataSource = null;
         }
-    };
+    }
     // 关于画布相关配置数据
-    CanvasHooks.prototype.canvasConfigDataFn = function (config) {
+    canvasConfigDataFn(config) {
         /**
          *  rightButtonsDataSource 画布右键菜单列表数据
         */
         this.canvasHandleConfig = config || {};
-    };
+    }
     // 注册回调事件--页面生成画布实例的时候，调用该函数
-    CanvasHooks.prototype.registerCallBackEventFn = function (config) {
-        var _ = this;
-        var boundFunction = register_1.RegisterCanvasEventFn.bind(_, config);
+    registerCallBackEventFn(config) {
+        const _ = this;
+        const boundFunction = register_1.RegisterCanvasEventFn.bind(_, config);
         boundFunction();
-    };
+    }
     // 执行注册事件
-    CanvasHooks.prototype.registerAllEventHandleFn = function () {
-        var _ = this;
+    registerAllEventHandleFn() {
+        const _ = this;
         _.dragLastPosDataSource = {
             open: false,
             lastPosX: null,
@@ -239,14 +241,14 @@ var CanvasHooks = /** @class */ (function () {
             _.registerMouseUpEventFn(options);
         });
         // 注册滚动事件
-        _.canvasDataSource.on('mouse:wheel', function (options) {
+        _.canvasDataSource.on('mouse:wheel', (options) => {
             _.registerMouseWheelEventFn(options);
         });
-        _.canvasDataSource.on('drop', function (options) {
+        _.canvasDataSource.on('drop', (options) => {
             _.registerMouseDropEventFn(options);
         });
         //监听画布缩放状态
-        _.canvasDataSource.on('zoom:changed', function (options) {
+        _.canvasDataSource.on('zoom:changed', (options) => {
             _.registerCanvasZoomChangeEventFn(options);
         });
         _.canvasDataSource.on('contextmenu', function (options) {
@@ -258,206 +260,205 @@ var CanvasHooks = /** @class */ (function () {
         document.body.addEventListener('contextmenu', function (event) {
             event === null || event === void 0 ? void 0 : event.preventDefault();
         });
-    };
+    }
     // 注册画布发生缩放监听事件
-    CanvasHooks.prototype.registerCanvasZoomChangeEventFn = function () {
-        var _ = this;
-        var boundFunction = register_1.RegisterCanvasZoomChangeEventFn.bind(_);
+    registerCanvasZoomChangeEventFn() {
+        const _ = this;
+        const boundFunction = register_1.RegisterCanvasZoomChangeEventFn.bind(_);
         boundFunction();
-    };
+    }
     // 拖拽事件注册
-    CanvasHooks.prototype.registerMouseDropEventFn = function (options) {
-        var _ = this;
-        var boundFunction = drop_1.RegisterMouseDropEventFn.bind(_, options);
+    registerMouseDropEventFn(options) {
+        const _ = this;
+        const boundFunction = drop_1.RegisterMouseDropEventFn.bind(_, options);
         boundFunction();
-    };
+    }
     // 鼠标进入画布
-    CanvasHooks.prototype.registerMouseOverEventFn = function (options) {
-        var _ = this;
+    registerMouseOverEventFn(options) {
+        const _ = this;
         _.mouseCanvasInRangeStatus = true;
-    };
+    }
     // 鼠标移出画布
-    CanvasHooks.prototype.registerMouseOutEventFn = function (options) {
+    registerMouseOutEventFn(options) {
         // console.log("registerMouseOutEventFn");
-        var _ = this;
+        const _ = this;
         _.mouseCanvasInRangeStatus = false;
-    };
+    }
     // 注册鼠标按下事件
-    CanvasHooks.prototype.registerMouseDownEventFn = function (options) {
-        var _ = this;
-        var boundFunction = mouse_down_1.RegisterMouseDownEventFn.bind(_, options);
+    registerMouseDownEventFn(options) {
+        const _ = this;
+        const boundFunction = mouse_down_1.RegisterMouseDownEventFn.bind(_, options);
         boundFunction();
-    };
+    }
     // 注册鼠标移动事件
-    CanvasHooks.prototype.registerMouseMoveEventFn = function (options) {
-        var _ = this;
-        var boundFunction = mouse_move_1.RegisterMouseMoveEventFn.bind(_, options);
+    registerMouseMoveEventFn(options) {
+        const _ = this;
+        const boundFunction = mouse_move_1.RegisterMouseMoveEventFn.bind(_, options);
         boundFunction();
-    };
+    }
     // 注册鼠标抬起事件
-    CanvasHooks.prototype.registerMouseUpEventFn = function (options) {
-        var _ = this;
-        var boundFunction = mouse_up_1.RegisterMouseUpEventFn.bind(_, options);
+    registerMouseUpEventFn(options) {
+        const _ = this;
+        const boundFunction = mouse_up_1.RegisterMouseUpEventFn.bind(_, options);
         boundFunction();
-    };
+    }
     // 注册鼠标滚动事件
-    CanvasHooks.prototype.registerMouseWheelEventFn = function (options) {
-        var _ = this;
-        var boundFunction = mouse_wheel_1.RegisterMouseWheelEventFn.bind(_, options);
+    registerMouseWheelEventFn(options) {
+        const _ = this;
+        const boundFunction = mouse_wheel_1.RegisterMouseWheelEventFn.bind(_, options);
         boundFunction();
-    };
+    }
     // 滚动事件操作--画布缩放监听
-    CanvasHooks.prototype.registerZoomHandleFn = function (options) {
-        var _ = this;
-        var boundFunction = index_1.RegisterZoomHandleFn.bind(_, options);
+    registerZoomHandleFn(options) {
+        const _ = this;
+        const boundFunction = index_1.RegisterZoomHandleFn.bind(_, options);
         boundFunction();
-    };
+    }
     // 页面上发生拖拽时，拖拽完成后的数据存储函数
-    CanvasHooks.prototype.dragCreateElementDataFn = function (data) {
-        var _ = this;
-        var boundFunction = drop_2.DragCreateElementDataFn.bind(_, data);
+    dragCreateElementDataFn(data) {
+        const _ = this;
+        const boundFunction = drop_2.DragCreateElementDataFn.bind(_, data);
         boundFunction();
-    };
+    }
     // 拖拽进入画布元素创建
-    CanvasHooks.prototype.createDragElementFn = function () {
-        var _ = this;
-        var boundFunction = create_1.CreateDragElementFn.bind(_);
+    createDragElementFn() {
+        const _ = this;
+        const boundFunction = create_1.CreateDragElementFn.bind(_);
         boundFunction();
-    };
+    }
     // 默认加载一个列表数据到画布
-    CanvasHooks.prototype.initElement2CanvasFn = function (list) {
-        var _ = this;
-        var boundFunction = create_1.InitElement2CanvasFn.bind(_, list);
+    initElement2CanvasFn(list) {
+        const _ = this;
+        const boundFunction = create_1.InitElement2CanvasFn.bind(_, list);
         boundFunction();
-    };
-    CanvasHooks.prototype.getCreateElementStatusFn = function (index) {
-        var _ = this;
-        var list = _.defaultCreateDataList;
+    }
+    getCreateElementStatusFn(index) {
+        const _ = this;
+        const list = _.defaultCreateDataList;
         if (index >= 0 && (list === null || list === void 0 ? void 0 : list.length)) {
             if (index == list.length - 1) {
-                setTimeout(function () {
+                setTimeout(() => {
                     _.resetElementSizeFn();
                 }, 100);
             }
         }
-    };
+    }
     // 创建SVG到画布
-    CanvasHooks.prototype.createCanvasSvgElementFn = function (item, index) {
-        var _ = this;
-        var boundFunction = create_1.CreateCanvasSvgElementFn.bind(_, item, index);
+    createCanvasSvgElementFn(item, index) {
+        const _ = this;
+        const boundFunction = create_1.CreateCanvasSvgElementFn.bind(_, item, index);
         boundFunction();
-    };
+    }
     // 创建图片到画布
-    CanvasHooks.prototype.createCanvasImageElementFn = function (item, index) {
-        var _ = this;
-        var boundFunction = create_1.CreateCanvasImageElementFn.bind(_, item, index);
+    createCanvasImageElementFn(item, index) {
+        const _ = this;
+        const boundFunction = create_1.CreateCanvasImageElementFn.bind(_, item, index);
         boundFunction();
-    };
+    }
     // 获取到所有被框选的对象
-    CanvasHooks.prototype.getSelectionAllElementsFn = function () {
-        var _ = this;
-        var data = query_1.QuerySelectionAllElementsFn.bind(_);
+    getSelectionAllElementsFn() {
+        const _ = this;
+        const data = query_1.QuerySelectionAllElementsFn.bind(_);
         return data();
-    };
+    }
     // 获取到指定选择框内被框选的对象
-    CanvasHooks.prototype.getSelectionElementsFn = function (item) {
-        var _ = this;
-        var data = query_1.QuerySelectionElementsFn.bind(_, item);
+    getSelectionElementsFn(item) {
+        const _ = this;
+        const data = query_1.QuerySelectionElementsFn.bind(_, item);
         return data();
-    };
+    }
     // 创建自定义图像
-    CanvasHooks.prototype.createSelectionRectFn = function () {
-        var _ = this;
-        var boundFunction = create_1.CreateSelectionRectFn.bind(_);
+    createSelectionRectFn() {
+        const _ = this;
+        const boundFunction = create_1.CreateSelectionRectFn.bind(_);
         boundFunction();
-    };
+    }
     // 创建全选框
-    CanvasHooks.prototype.createAllSelectionRectFn = function () {
-        var _ = this;
-        var boundFunction = create_1.CreateAllSelectionRectFn.bind(_);
+    createAllSelectionRectFn() {
+        const _ = this;
+        const boundFunction = create_1.CreateAllSelectionRectFn.bind(_);
         boundFunction();
-    };
+    }
     // 删除全选对象选择框
-    CanvasHooks.prototype.removeAllSelectionRectFn = function () {
-        var _ = this;
-        var boundFunction = update_1.RemoveAllSelectionRectFn.bind(_);
+    removeAllSelectionRectFn() {
+        const _ = this;
+        const boundFunction = update_1.RemoveAllSelectionRectFn.bind(_);
         boundFunction();
-    };
+    }
     // 自定义选择框绘制数据更新
-    CanvasHooks.prototype.updateSelectionRectFn = function (options) {
-        var _ = this;
-        var boundFunction = update_1.UpdateSelectionRectFn.bind(_, options);
+    updateSelectionRectFn(options) {
+        const _ = this;
+        const boundFunction = update_1.UpdateSelectionRectFn.bind(_, options);
         boundFunction();
-    };
+    }
     // 自定义选择框绘制完成
-    CanvasHooks.prototype.createSelectionRectFinishFn = function () {
-        var _ = this;
-        var boundFunction = update_1.CreateSelectionRectFinishFn.bind(_);
+    createSelectionRectFinishFn() {
+        const _ = this;
+        const boundFunction = update_1.CreateSelectionRectFinishFn.bind(_);
         boundFunction();
-    };
-    CanvasHooks.prototype.init = function () {
-        var _ = this;
-    };
+    }
+    init() {
+        const _ = this;
+    }
     // 获取画布容器的宽高
-    CanvasHooks.prototype.elementSizeFn = function (id) {
-        var _ = this;
-        var data = query_1.QueryElementSizeFn.bind(_, id);
-        var result = data() || {};
+    elementSizeFn(id) {
+        const _ = this;
+        const data = query_1.QueryElementSizeFn.bind(_, id);
+        const result = data() || {};
         console.log("elementSizeFn--result==", result);
         return result;
-    };
+    }
     // 右键菜单管理
-    CanvasHooks.prototype.createRightClickMenuFn = function (options) {
-        var _ = this;
-        var boundFunction = create_1.CreateRightClickMenuFn.bind(_, options);
+    createRightClickMenuFn(options) {
+        const _ = this;
+        const boundFunction = create_1.CreateRightClickMenuFn.bind(_, options);
         boundFunction();
-    };
-    CanvasHooks.prototype.hiddenRightClickMenuFn = function () {
-        var _ = this;
-        var boundFunction = update_1.HiddenRightClickMenuFn.bind(_);
+    }
+    hiddenRightClickMenuFn() {
+        const _ = this;
+        const boundFunction = update_1.HiddenRightClickMenuFn.bind(_);
         boundFunction();
-    };
+    }
     // 在画布上动态创建对象
-    CanvasHooks.prototype.createElementFn = function (domVal, id, index) {
-        var _ = this;
-        var data = create_1.CreateElementFn.bind(_, domVal, id, index);
+    createElementFn(domVal, id, index) {
+        const _ = this;
+        const data = create_1.CreateElementFn.bind(_, domVal, id, index);
         return data();
-    };
+    }
     // 执行返回上一步操作
-    CanvasHooks.prototype.previousStepFn = function () {
-        var _ = this;
-        var boundFunction = changed_1.PreviousStepFn.bind(_);
+    previousStepFn() {
+        const _ = this;
+        const boundFunction = changed_1.PreviousStepFn.bind(_);
         boundFunction();
-    };
+    }
     // 移除画布上指定对象
-    CanvasHooks.prototype.removeElementFn = function (id) {
-        var _ = this;
-        var boundFunction = update_1.RemoveElementFn.bind(_, id);
+    removeElementFn(id) {
+        const _ = this;
+        const boundFunction = update_1.RemoveElementFn.bind(_, id);
         boundFunction();
-    };
+    }
     // 清空画布上所有对象
-    CanvasHooks.prototype.removeAllElementFn = function () {
-        var _ = this;
-        var boundFunction = update_1.RemoveAllElementFn.bind(_);
+    removeAllElementFn() {
+        const _ = this;
+        const boundFunction = update_1.RemoveAllElementFn.bind(_);
         boundFunction();
-    };
+    }
     // 对于画布出现缩放的情况，加载进入的数据会产生偏移处理
     // 问题未解决，备注
-    CanvasHooks.prototype.resetElementSizeFn = function () {
-        var _ = this;
-        var boundFunction = changed_1.ResetElementSizeFn.bind(_);
+    resetElementSizeFn() {
+        const _ = this;
+        const boundFunction = changed_1.ResetElementSizeFn.bind(_);
         boundFunction();
-    };
-    CanvasHooks.prototype.setCanvasBaseConfigFn = function (zoom) {
-        var _ = this;
-        var boundFunction = index_1.SetCanvasBaseConfigFn.bind(_, zoom);
+    }
+    setCanvasBaseConfigFn(zoom) {
+        const _ = this;
+        const boundFunction = index_1.SetCanvasBaseConfigFn.bind(_, zoom);
         boundFunction();
-    };
-    CanvasHooks.prototype.getCanvasActionDataFn = function () {
-        var _ = this;
-        var data = query_1.QueryCanvasActionDataFn.bind(_);
+    }
+    getCanvasActionDataFn() {
+        const _ = this;
+        const data = query_1.QueryCanvasActionDataFn.bind(_);
         return data();
-    };
-    return CanvasHooks;
-}());
+    }
+}
 exports.default = CanvasHooks;