动画模块

Author: zhaokai

src/service/2DPlot/Draw/DrawPoint2D.js

@@ -8,13 +8,14 @@
 import  DrawObject  from "../../PlotBase/Draw/DrawObject";
 import  Point  from "../../PlotUtilBase/Geometry/Point";
 import  {PlotObjectFactory}  from "../Shapes/PlotObjectFactory";
+import {addExtendLayersPlot} from "../../3DPlot/Utils/PlotUtil";
 
 export default class DrawPoint2D extends DrawObject {
-  constructor(fabricCanvas, symbol, options) {
+  constructor(plotLayer, symbol, options) {
     super();
-    this.m_fabricCanvas = fabricCanvas;
+    this._plotLayer = plotLayer;
     this.m_symbol = symbol;
-    this.m_coordSys = this.m_fabricCanvas.getCoordSys();
+    this.m_coordSys = this._plotLayer.getCoordSys();
     this.onMouseUp = this.innerOnMouseUp.bind(this);
     //绘制完成回调函数
     const {addedPlot} = options;
@@ -23,13 +24,14 @@ export default class DrawPoint2D extends DrawObject {
 
   addHooks() {
     super.addHooks();
-    this.m_fabricCanvas.on("mouse:up", this.onMouseUp);
-    this.m_fabricCanvas.interactive = false;
+    this._plotLayer.on("mouse:up", this.onMouseUp);
+    this._plotLayer.interactive = false;
   }
 
   removeHooks() {
-    this.m_fabricCanvas.interactive = false;
-    this.m_fabricCanvas.off("mouse:up", this.onMouseUp);
+    this._plotLayer.interactive = false;
+    this._plotLayer._isDrawing = false;
+    this._plotLayer.off("mouse:up", this.onMouseUp);
     super.removeHooks();
   }
 
@@ -39,17 +41,18 @@ export default class DrawPoint2D extends DrawObject {
     this.m_symbol.getElement().then((element)=>{
       const object = PlotObjectFactory.createInstance(this.m_symbol.type, {
         element:element ,
-        canvas: this.m_fabricCanvas,
+        canvas: this._plotLayer,
       });
 
       object.setPnts([new Point(pnt[0],pnt[1])]);
-  
-      this.m_fabricCanvas.add(object);
-      this.m_fabricCanvas.requestRenderAll();
+      this._plotLayer._isDrawing = true;
+      this._plotLayer.addPlot(object);
+      this._plotLayer.requestRenderAll();
       this.fireFinishEvent({ plotObj2D: object });
       if(this._addedPlot){
         this._addedPlot(object);
       }
+      addExtendLayersPlot(this._plotLayer._linkTool, object);
       this.disable();
     })
 

src/service/2DPlot/Draw/DrawPolyline2D.js

@@ -7,15 +7,16 @@
  */
 import DrawObject from '../../PlotBase/Draw/DrawObject';
 import Point from '../../PlotUtilBase/Geometry/Point';
-import { PlotObjectFactory } from '../Shapes/PlotObjectFactory';
+import {PlotObjectFactory} from '../Shapes/PlotObjectFactory';
+import {addExtendLayersPlot} from "../../3DPlot/Utils/PlotUtil";
 
 const _ = require('lodash');
 export default class DrawPolyline2D extends DrawObject {
-    constructor(fabricCanvas, symbol, options) {
+    constructor(plotLayer, symbol, options) {
         super();
-        this.m_fabricCanvas = fabricCanvas;
+        this._plotLayer = plotLayer;
         this.m_symbol = symbol;
-        this.m_coordSys = this.m_fabricCanvas.getCoordSys();
+        this.m_coordSys = this._plotLayer.getCoordSys();
         this.m_object = null;
         this.m_coords = [[0, 0]];
         this.onMouseUp = this.innerOnMouseUp.bind(this);
@@ -27,16 +28,17 @@ export default class DrawPolyline2D extends DrawObject {
 
     addHooks() {
         super.addHooks();
-        this.m_fabricCanvas.on('mouse:move', this.onMouseMove);
-        this.m_fabricCanvas.on('mouse:up', this.onMouseUp);
-        this.m_fabricCanvas.interactive = false;
+        this._plotLayer.on('mouse:move', this.onMouseMove);
+        this._plotLayer.on('mouse:up', this.onMouseUp);
+        this._plotLayer.interactive = false;
     }
 
     removeHooks() {
         this.m_object = null;
-        this.m_fabricCanvas.interactive = true;
-        this.m_fabricCanvas.off('mouse:move', this.onMouseMove);
-        this.m_fabricCanvas.off('mouse:up', this.onMouseUp);
+        this._plotLayer.interactive = true;
+        this._plotLayer.off('mouse:move', this.onMouseMove);
+        this._plotLayer.off('mouse:up', this.onMouseUp);
+        this._plotLayer._isDrawing = false;
         super.removeHooks();
     }
 
@@ -45,19 +47,20 @@ export default class DrawPolyline2D extends DrawObject {
         this.m_coords[this.m_coords.length - 1] = new Point(pnt[0], pnt[1]);
         if (this.m_coords.length >= 2 && this.m_object) {
             this.m_object.setPnts(this.m_coords);
-            this.m_fabricCanvas.requestRenderAll();
+            this._plotLayer.requestRenderAll();
         }
     }
+
     innerOnMouseUp(event) {
         if (!this.m_startDrawing) this.m_startDrawing = true;
 
         const pnt = this.m_coordSys.pointToData([event.pointer.x, event.pointer.y]);
         const lastPnt = this.m_coords.length > 2 ? this.m_coords[this.m_coords.length - 2] : null;
 
         if (lastPnt && Math.abs(pnt[0] - lastPnt.x) < 1e-4 && Math.abs(pnt[1] - lastPnt.y) < 1e-4) {
-            this.fireFinishEvent({ plotObj2D: this.m_object });
+            this.fireFinishEvent({plotObj2D: this.m_object});
             this.m_startDrawing = false;
-            if(this._addedPlot){
+            if (this._addedPlot) {
                 this._addedPlot(this.m_object);
             }
             this.disable();
@@ -68,13 +71,15 @@ export default class DrawPolyline2D extends DrawObject {
                 this.m_symbol.getElement().then((element) => {
                     this.m_object = PlotObjectFactory.createInstance(this.m_symbol.type, {
                         element: element,
-                        canvas: this.m_fabricCanvas
+                        canvas: this._plotLayer
                     });
-                    this.m_fabricCanvas.add(this.m_object);
+                    this._plotLayer.addPlot(this.m_object);
+                    this._plotLayer._isDrawing = true;
+                    addExtendLayersPlot(this._plotLayer._linkTool, this.m_object);
                 });
             }
         }
 
-        this.m_fabricCanvas.requestRenderAll();
+        this._plotLayer.requestRenderAll();
     }
 }