Browse Source

添加蒙版画法

haojianlong 5 years ago
parent
commit
645f23eb64
8 changed files with 144 additions and 121 deletions
  1. 1 0
      .gitignore
  2. 13 13
      package-lock.json
  3. 4 4
      package.json
  4. 23 7
      src/divideFloorScene.ts
  5. 58 59
      src/items/UserMark.ts
  6. 7 1
      src/items/SpaceItem.ts
  7. 37 26
      src/items/ZoneItem.ts
  8. 1 11
      src/types/Zone.ts

+ 1 - 0
.gitignore

@@ -5,3 +5,4 @@ node_modules
 package-lock.json
 lib
 api
+docs

+ 13 - 13
package-lock.json

@@ -1,6 +1,6 @@
 {
     "name": "cad-engine",
-    "version": "2.0.145",
+    "version": "2.0.151",
     "lockfileVersion": 1,
     "requires": true,
     "dependencies": {
@@ -25,25 +25,25 @@
             }
         },
         "@sybotan-web/base": {
-            "version": "2.1.1",
-            "resolved": "http://dev.dp.sagacloud.cn:8082/repository/npm-saga/@sybotan-web/base/-/base-2.1.1.tgz",
-            "integrity": "sha512-aXtrgDJIILMIYGbe4Dku/kXll/rZZJ1pOsDeB/Di9qAc6GPUJbxSehyXBTE1ndddYlLN6fw/Y1aUxdqu01IYdQ=="
+            "version": "2.1.2",
+            "resolved": "http://dev.dp.sagacloud.cn:8082/repository/npm-saga/@sybotan-web/base/-/base-2.1.2.tgz",
+            "integrity": "sha512-sBFWAn/cqOT9P4r+CSgj381QbLp9XavDkKNRRm9iQZbMv2+/AkYcXcmDhI7wJIJNwz8kR6wjRvMBeUEpFIvqnA=="
         },
         "@sybotan-web/draw": {
-            "version": "2.1.28",
-            "resolved": "http://dev.dp.sagacloud.cn:8082/repository/npm-saga/@sybotan-web/draw/-/draw-2.1.28.tgz",
-            "integrity": "sha512-paBmqETMgvqpoy8jgFwcNrKBkQb200U/WLRJMWSh3Es9ImncoqfwGLmD/RovGOEpm5pcv6r+ibOi/Vrmgq8oyA==",
+            "version": "2.1.39",
+            "resolved": "http://dev.dp.sagacloud.cn:8082/repository/npm-saga/@sybotan-web/draw/-/draw-2.1.39.tgz",
+            "integrity": "sha512-P7HMsYKM3dNITIpZPUJPkeH9Vsor2v/Yt+cMyUdpqKj3brZRk+8yadBtTlxCzkWc6CU3wZVD66xwENGbae4J3A==",
             "requires": {
-                "@sybotan-web/base": "^2.1.1"
+                "@sybotan-web/base": "^2.1.2"
             }
         },
         "@sybotan-web/graphy": {
-            "version": "2.1.5",
-            "resolved": "http://dev.dp.sagacloud.cn:8082/repository/npm-saga/@sybotan-web/graphy/-/graphy-2.1.5.tgz",
-            "integrity": "sha512-+RG63losDkTHrRkgPl+6jelO4Z3P7nxyTwML3XkgV6c5fcrDcTwrX5qGMaRTtGy804Whic/wlSfrv0Ot0py0GQ==",
+            "version": "2.1.13",
+            "resolved": "http://dev.dp.sagacloud.cn:8082/repository/npm-saga/@sybotan-web/graphy/-/graphy-2.1.13.tgz",
+            "integrity": "sha512-yb230gF0BsTx86ZmZf3w0plHVNwghABwK6h1F2Sh+UwlAjzSVqk8YHQ8YMcQPPpc+lCY3NDsBJlDMY0hIZkTJQ==",
             "requires": {
-                "@sybotan-web/base": "^2.1.1",
-                "@sybotan-web/draw": "^2.1.10"
+                "@sybotan-web/base": "^2.1.2",
+                "@sybotan-web/draw": "^2.1.39"
             }
         },
         "@types/eslint-visitor-keys": {

+ 4 - 4
package.json

@@ -1,6 +1,6 @@
 {
     "name": "cad-engine",
-    "version": "2.0.146",
+    "version": "2.0.165",
     "description": "上格云 CAD图形引擎。",
     "main": "lib/index.js",
     "types": "lib/index.d.js",
@@ -31,9 +31,9 @@
         "typescript": "^3.5.3"
     },
     "dependencies": {
-        "@sybotan-web/base": "2.1.1",
-        "@sybotan-web/draw": "2.1.28",
-        "@sybotan-web/graphy": "2.1.5",
+        "@sybotan-web/base": "2.1.2",
+        "@sybotan-web/draw": "2.1.39",
+        "@sybotan-web/graphy": "2.1.13",
         "axios": "^0.18.0",
         "pako": "^1.0.10"
     }

+ 23 - 7
src/divideFloorScene.ts

@@ -21,7 +21,7 @@
 import { FloorScene } from "./FloorScene";
 import { SMouseEvent } from "@sybotan-web/graphy/lib";
 import { SColor, SPoint, SRect } from "@sybotan-web/draw/lib";
-import { UserMark } from "./items/UserMark";
+import { SceneMarkItem } from "./items/SceneMarkItem";
 
 /**
  * 划分业务空间
@@ -50,14 +50,14 @@ export class DivideFloorScene extends FloorScene {
         super();
     } // Constructor
 
-    /** 清除切割    */
-    clearUserMark(): void {
+    /** 清除蒙版    */
+    clearSceneMark(): void {
         if (this.grabItem) {
             this.removeItem(this.grabItem);
             this.grabItem = null;
             this.isMarking = false;
         }
-    } // Function clearUserMark()
+    } // Function clearSceneMark()
 
     /**
      * 点击事件
@@ -66,18 +66,34 @@ export class DivideFloorScene extends FloorScene {
      * @return  boolean
      */
     onMouseDown(event: SMouseEvent): boolean {
+        console.log(arguments)
         if (this.isMarking) {
             if (this.grabItem) {
                 this.grabItem.onMouseDown(event);
             } else {
                 let point = new SPoint(event.x, event.y);
-                let userM = new UserMark(null, point);
-                this.addItem(userM);
-                this.grabItem = userM;
+                let sceneMark = new SceneMarkItem(null, point);
+                this.addItem(sceneMark);
+                this.grabItem = sceneMark;
             }
         } else {
             super.onMouseDown(event);
         }
         return false;
     } // Function onClick()
+
+    /***
+     * 键盘按下事件
+     *
+     * @param      event   保存事件参数
+     */
+    onKeyUp(event: KeyboardEvent): void {
+        if (this.isMarking) {
+            if (this.grabItem) {
+                this.grabItem.onKeyUp(event);
+            }
+        } else {
+            super.onKeyUp(event);
+        }
+    }
 } // Class DivideFloorScene

+ 58 - 59
src/items/UserMark.ts

@@ -19,63 +19,54 @@
  */
 
 import { SGraphyItem, SMouseEvent } from "@sybotan-web/graphy/lib";
-import { SColor, SPainter, SPoint, SRect } from "@sybotan-web/draw/lib";
+import {
+    SColor,
+    SPainter,
+    SPath2D,
+    SPoint,
+    SRect
+} from "@sybotan-web/draw/lib";
 
 /**
- * 用户标记item
+ * 蒙版item
  *
  * @author  郝建龙
  */
-export class UserMark extends SGraphyItem {
-    /** 标记宽度    */
-    private width: number = 20;
-    /** 标记高度    */
-    private height: number = 20;
+export class SceneMarkItem extends SGraphyItem {
     /** 轮廓线坐标  */
     outLine: SPoint[] = [];
     /** 是否闭合    */
     closeFlag = false;
+    /** 鼠标移动点  */
+    private lastPoint = new SPoint();
+    /** 蒙版       */
+    private mask = new SPath2D();
 
     /**
      * 构造函数
      *
      * @param parent    指向父对象
-     * @param data      标记数据
+     * @param data      蒙版起点数据
      */
     constructor(parent: SGraphyItem | null, data: SPoint) {
         super(parent);
         this.outLine.push(data);
+        this.lastPoint = data;
+        this.zOrder = Number.MAX_SAFE_INTEGER;
     } // Constructor
 
     /**
-     * Item对象边界区域
-     *
-     * @return	SRect
-     */
-    boundingRect(): SRect {
-        return new SRect(0, 0, this.width, this.height);
-    } // Function boundingRect()
-
-    /**
      * 鼠标按下事件
      *
      * @param	event         事件参数
      * @return	boolean
      */
     onMouseDown(event: SMouseEvent): boolean {
-        if (!this.closeFlag) {
-            console.log("mouseDown");
-            let newPoint = this.outLine[this.outLine.length - 1];
-            if (
-                newPoint.x == this.outLine[0].x &&
-                newPoint.y == this.outLine[0].y
-            ) {
-                this.closeFlag = true;
-            } else {
-                newPoint = new SPoint(event.x, event.y);
-                console.log(newPoint);
-                this.outLine.push(newPoint);
-            }
+        if (!this.closeFlag && event.buttons == 1) {
+            let p = new SPoint(event.x, event.y);
+            this.lastPoint.x = p.x;
+            this.lastPoint.y = p.y;
+            this.outLine.push(p);
         }
         return true;
     } // Function onMouseDown()
@@ -87,29 +78,38 @@ export class UserMark extends SGraphyItem {
      * @return	boolean
      */
     onMouseMove(event: SMouseEvent): boolean {
-        console.log("mouseMove");
         if (!this.closeFlag) {
-            let first, newLast;
-            if (this.outLine.length > 1) {
-                this.outLine.pop();
-                first = this.outLine[0];
-            }
-            newLast = new SPoint(event.x, event.y);
-            if (this.outLine.length > 2 && first) {
-                if (
-                    event.x + 20 >= first.x &&
-                    event.x - 20 <= first.x &&
-                    event.y + 20 >= first.y &&
-                    event.y - 20 <= first.y
-                ) {
-                    newLast = first;
-                }
-            }
-            this.outLine.push(newLast);
+            this.lastPoint = new SPoint(event.x, event.y);
         }
         return true;
     } // Function onMouseMove()
 
+    /***
+     * 键盘按键弹起事件
+     *
+     * @param	event         事件参数
+     */
+    onKeyUp(event: KeyboardEvent): void {
+        if (event.keyCode == 13 && this.outLine.length >= 3) {
+            this.createMask();
+        }
+    } // Function onKeydown()
+
+    /**
+     * 创建蒙版
+     *
+     */
+    createMask(): void {
+        this.closeFlag = true;
+        this.mask = new SPath2D();
+        this.mask.moveTo(Number.MIN_SAFE_INTEGER, Number.MIN_SAFE_INTEGER);
+        this.mask.lineTo(Number.MAX_SAFE_INTEGER, Number.MIN_SAFE_INTEGER);
+        this.mask.lineTo(Number.MAX_SAFE_INTEGER, Number.MAX_SAFE_INTEGER);
+        this.mask.lineTo(Number.MIN_SAFE_INTEGER, Number.MAX_SAFE_INTEGER);
+        this.mask.lineTo(Number.MIN_SAFE_INTEGER, Number.MIN_SAFE_INTEGER);
+        this.mask.polygon(this.outLine);
+    } // Function createMask()
+
     /**
      * Item绘制操作
      *
@@ -117,18 +117,17 @@ export class UserMark extends SGraphyItem {
      * @param   rect          绘制区域
      */
     onDraw(painter: SPainter, rect?: SRect): void {
-        if (this.visible) {
+        if (this.closeFlag) {
+            painter.pen.color = SColor.Transparent;
+            painter.brush.color = new SColor("#FFFF0080");
+            painter.drawPath(this.mask);
+        } else {
             painter.pen.color = new SColor("#ff0000");
-            painter.pen.lineWidth = 2;
-            if (this.closeFlag) {
-                painter.brush.color = new SColor("#ff0000");
-            } else {
-                painter.brush.color = new SColor("#ffffff80");
-            }
-            this.outLine.map(t => {
-                painter.drawRect(t.x - 4, t.y - 4, 8, 8);
-            });
             painter.drawPolyline(this.outLine);
+            painter.drawLine(
+                this.outLine[this.outLine.length - 1],
+                this.lastPoint
+            );
         }
     } // Function onDraw()
-} // Class UserMark
+} // Class SceneMarkItem

+ 7 - 1
src/items/SpaceItem.ts

@@ -19,7 +19,13 @@
  */
 
 import { SGraphyItem, SMouseEvent } from "@sybotan-web/graphy/lib";
-import {SColor, SPainter, SPath2D, SPoint, SRect} from "@sybotan-web/draw/lib";
+import {
+    SColor,
+    SPainter,
+    SPath2D,
+    SPoint,
+    SRect
+} from "@sybotan-web/draw/lib";
 import { Space } from "../types/Space";
 import { Opt } from "../types/Opt";
 

+ 37 - 26
src/items/ZoneItem.ts

@@ -19,7 +19,13 @@
  */
 
 import { SGraphyItem, SMouseEvent } from "@sybotan-web/graphy/lib";
-import { SColor, SPainter, SPoint, SRect } from "@sybotan-web/draw/lib";
+import {
+    SColor,
+    SPainter,
+    SPath2D,
+    SPoint,
+    SRect
+} from "@sybotan-web/draw/lib";
 import { Space } from "../types/Space";
 import { Opt } from "../types/Opt";
 import { Zone } from "../types/Zone";
@@ -33,7 +39,7 @@ export class ZoneItem extends SGraphyItem {
     /** 空间所有数据  */
     data: Zone;
     /** 空间轮廓线坐标list  */
-    private readonly pointArr: SPoint[][] = [];
+    private readonly pointArr: SPoint[][][] = [];
     /** X坐标最小值  */
     private minX = 0;
     /** X坐标最大值  */
@@ -42,6 +48,8 @@ export class ZoneItem extends SGraphyItem {
     private minY = 0;
     /** Y坐标最大值  */
     private maxY = 0;
+    /** path    */
+    private pathList: SPath2D[] = [];
 
     /**
      * 构造函数
@@ -49,34 +57,40 @@ export class ZoneItem extends SGraphyItem {
      * @param parent    指向父对象
      * @param data      空间数据
      */
-    constructor(parent: SGraphyItem | null, data: Space) {
+    constructor(parent: SGraphyItem | null, data: Zone) {
         super(parent);
         this.data = data;
         if (this.data.OutLine.length) {
             let tempArr = this.data.OutLine;
-            this.minX = tempArr[0][0].X;
+            this.minX = tempArr[0][0][0].X;
             this.maxX = this.minX;
-            this.minY = -tempArr[0][0].Y;
+            this.minY = -tempArr[0][0][0].Y;
             this.maxY = this.minY;
             // 处理轮廓点数组,同时计算最大最小值
             this.pointArr = tempArr.map(t => {
+                let spath = new SPath2D();
                 let tempArr = t.map(it => {
-                    let x = it.X,
-                        y = -it.Y;
-                    if (x < this.minX) {
-                        this.minX = x;
-                    }
-                    if (y < this.minY) {
-                        this.minY = y;
-                    }
-                    if (x > this.maxX) {
-                        this.maxX = x;
-                    }
-                    if (y > this.maxY) {
-                        this.maxY = y;
-                    }
-                    return new SPoint(x, y);
+                    let array = it.map(item => {
+                        let x = item.X,
+                            y = -item.Y;
+                        if (x < this.minX) {
+                            this.minX = x;
+                        }
+                        if (y < this.minY) {
+                            this.minY = y;
+                        }
+                        if (x > this.maxX) {
+                            this.maxX = x;
+                        }
+                        if (y > this.maxY) {
+                            this.maxY = y;
+                        }
+                        return new SPoint(x, y);
+                    });
+                    spath.addPolygon(array);
+                    return array;
                 });
+                this.pathList.push(spath);
                 return tempArr;
             });
         }
@@ -106,7 +120,7 @@ export class ZoneItem extends SGraphyItem {
         if (this.data.OutLine.length) {
             let nCross = 0,
                 point = [x, y],
-                APoints = this.data.OutLine[0],
+                APoints = this.data.OutLine[0][0],
                 length = APoints.length,
                 p1,
                 p2,
@@ -149,12 +163,9 @@ export class ZoneItem extends SGraphyItem {
         if (this.visible) {
             painter.pen.color = SColor.Transparent;
             painter.brush.color = Opt.spaceColor;
-            // if (this.pointArr.length > 1) {
-            //     painter.brush.color = new SColor("#00ff0080");
-            // }
             painter.pen.lineWidth = 200;
-            this.pointArr.map(t => {
-                painter.drawPolygon(t);
+            this.pathList.map(t => {
+                painter.drawPath(t);
             });
         }
     } // Function onDraw()

+ 1 - 11
src/types/Zone.ts

@@ -27,18 +27,8 @@ import { Place } from "./Place";
  * @author  郝建龙
  */
 export interface Zone {
-    /** 轮廓线段    */
-    BoundarySegments: string[];
-    /** 位置  */
-    Location: Place;
-    /** 模型id(外键)    */
-    ModelId: string;
     /** 名称  */
     Name: string;
     /** 轮廓线  */
-    OutLine: Point[][];
-    /** 对应Revit模型id */
-    SourceId: string;
-    /** 补充信息    */
-    Tag: string;
+    OutLine: Point[][][];
 } // Interface Space