动效

Author: zhaokai

src/service/2DPlot/PlotCanvas.js

@@ -4,7 +4,7 @@
  * @Author: zk
  * @Date: 2022-05-13 10:34:57
  * @LastEditors: zk
- * @LastEditTime: 2022-05-26 11:42:37
+ * @LastEditTime: 2022-05-30 14:50:31
  */
 
 import { DrawPlotObjectFactory2D } from './Draw/DrawPlotObjectFactory2D';
@@ -183,7 +183,7 @@ export default class PlotCanvas {
     remove(plotObj) {
         const i = this.m_plotObjects.indexOf(plotObj);
         if (i > -1) {
-            this.m_plotObjects.splice(i, 0);
+            this.m_plotObjects.splice(i,1);
         }
         if (this._fabricCanvas) {
             this._fabricCanvas.remove(plotObj);

src/service/2DPlot/PlotCanvasGroup.js

@@ -4,12 +4,14 @@
  * @Author: zk
  * @Date: 2022-05-13 11:01:10
  * @LastEditors: zk
- * @LastEditTime: 2022-05-27 10:56:43
+ * @LastEditTime: 2022-05-30 16:22:23
  */
 
 import { fabric } from 'fabric';
 import PlotCanvas from './PlotCanvas';
-import PlotUtilLine from './Shapes/PlotUtilLine';
+import DrawTool from '../PlotBase/Draw/DrawTool';
+import SymbolManager from '../PlotBase/SymbolManager/SymbolManager';
+import { PlotObjectFactory } from './Shapes/PlotObjectFactory';
 
 export const PlotCanvasGroup = fabric.util.createClass(fabric.Canvas, {
     selection: false,
@@ -23,8 +25,11 @@ export const PlotCanvasGroup = fabric.util.createClass(fabric.Canvas, {
     initialize: function (el, options) {
         if (!PlotCanvasGroup.instance) {
             this.callSuper('initialize', el, options);
-            this._plotCanvasLayers = [];
             PlotCanvasGroup.instance = this;
+            // 工具图层
+            this._utilPlotCanvas = new PlotCanvas();
+            this._plotCanvasLayers = [];
+            this.addLayer(this._utilPlotCanvas);
         } else {
             return PlotCanvasGroup.instance;
         }
@@ -207,9 +212,6 @@ export const PlotCanvasGroup = fabric.util.createClass(fabric.Canvas, {
         let t = null;
         for (let i = 0; i < this._objects.length; i++) {
             const object = this._objects[i];
-            if(!object.isExtendPlotObject){
-                continue
-            }
             const elem = object.getElement();
             if (elem && elem.getFeatureId() === uid) {
                 t = object;
@@ -223,17 +225,6 @@ export const PlotCanvasGroup = fabric.util.createClass(fabric.Canvas, {
             layer.initCoords();
         });
     },
-    addUtilPath(coords, options) {
-        const plot = new PlotUtilLine({
-            coords,
-            canvas:this
-        })
-        this.add(plot);
-        return plot;
-    },
-    removeUtilPath(utilPlotObject) {
-        this.remove(utilPlotObject);
-    },
     /**
      * @function: Module:PlotCanvasGroup.prototype._renderObjects
      * @description: 渲染标绘对象代码
@@ -261,6 +252,22 @@ export const PlotCanvasGroup = fabric.util.createClass(fabric.Canvas, {
 
             flag && object && object.render(ctx);
         }
+    },
+    drawUtilPlotObject(id, options) {
+        const symbol = SymbolManager.instance;
+        const leaf = symbol.getLeafByID(id);
+        return leaf.getElement().then((element) => {
+            const plotObj = PlotObjectFactory.createInstance(element.type, {
+                element,
+                positions: options.positions,
+                canvas: this._utilPlotCanvas
+            });
+            this._utilPlotCanvas.add(plotObj);
+            return plotObj;
+        });
+    },
+    removeDrawUtilPlotObject(plotObject){
+        this._utilPlotCanvas.remove(plotObject)  
     }
 });
 

src/service/2DPlot/Shapes/PlotObject.js

@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2021-07-05 11:32:52
- * @LastEditTime: 2022-05-27 10:53:09
+ * @LastEditTime: 2022-05-30 16:23:28
  * @LastEditors: zk
  * @Description: In User Settings Edit
  * @FilePath: \MapGISPlot\src\js\Shapes\PlotObject.js
@@ -18,8 +18,6 @@ const PlotObject = fabric.util.createClass(fabric.Object, {
         this._elem.positions = options.positions || [];
         this.m_coordsPx = [];
         this._elem.propsUpdateSignal.add(this._elemPropsUpdateHandler, this);
-        
-        this.isExtendPlotObject=true
     },
     _elemPropsUpdateHandler(event) {
         this.set('dirty', true);

src/service/2DPlot/Shapes/PlotUtilLine.js

@@ -3,7 +3,7 @@
  * @Author: zk
  * @Date: 2022-03-23 10:02:49
  * @LastEditors: zk
- * @LastEditTime: 2022-05-26 15:09:13
+ * @LastEditTime: 2022-05-30 14:04:17
  */
 import { AnimationUtil } from '../utils/AnimationUtil';
 import { easingFunc } from '../utils/Easing';
@@ -30,9 +30,8 @@ export default class PlotBaseAnimation {
         // 图层组函数
         this.handRefresh = options.handRefresh || function () {};
         this.getPlotObjectById = options.getPlotObjectById || function (uid) {};
-        this.addUtilPath= options.addUtilPath || function (){}
-        this.removeUtilPath= options.removeUtilPath || function(){
-        }
+        this.drawUtilPlotObject = options.drawUtilPlotObject ? options.drawUtilPlotObject : function () {};
+        this.removeDrawUtilPlotObject=options.removeDrawUtilPlotObject?options.removeDrawUtilPlotObject:function(){};
         // 时段记录
         this.timeSpace = 0;
         // 播放历史

src/service/PlotBase/Animation/AnimationTypes/PlotBaseAnimation.js

@@ -3,7 +3,7 @@
  * @Author: zk
  * @Date: 2022-03-23 10:02:49
  * @LastEditors: zk
- * @LastEditTime: 2022-05-25 11:31:15
+ * @LastEditTime: 2022-05-27 17:30:23
  */
 import Point from '../../../../../PlotUtilBase/Geometry/Point';
 import PlotBaseAnimation from '../../PlotBaseAnimation';