Pārlūkot izejas kodu

itemOrder扩大100倍;增加鼠标移入鼠标样式cursor;蜂鸟解析器增加返回楼层list;选择器增加图层操作;graphview增加存图设置大小

haojianlong 5 gadi atpakaļ
vecāks
revīzija
d6037b6f66

+ 2 - 2
saga-web-big/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@saga-web/big",
-    "version": "1.0.78",
+    "version": "1.0.82",
     "description": "上格云建筑信息化库",
     "main": "lib/index.js",
     "types": "lib/index.d.js",
@@ -42,6 +42,6 @@
         "typescript": "^3.9.3"
     },
     "dependencies": {
-        "@saga-web/graph": "2.1.108"
+        "@saga-web/graph": "2.1.110"
     }
 }

+ 19 - 19
saga-web-big/src/config/ItemOrder.ts

@@ -25,41 +25,41 @@
  */
 export class ItemOrder {
     /** 空间层级 */
-    static spaceOrder = 2;
+    static spaceOrder = 200;
     /** 业务空间层级 */
-    static zoneOrder = 8;
+    static zoneOrder = 800;
     /** 类空间层级 */
-    static likeSpaceOrder = 10;
+    static likeSpaceOrder = 1000;
     /** 柱子层级 */
-    static columnOrder = 12;
+    static columnOrder = 1200;
     /** 墙层级 */
-    static wallOrder = 16;
+    static wallOrder = 1600;
     /** 虚拟墙层级 */
-    static virtualWallOrder = 20;
+    static virtualWallOrder = 2000;
     /** 门层级 */
-    static doorOrder = 24;
+    static doorOrder = 2400;
     /** 窗户层级 */
-    static windowOrder = 28;
+    static windowOrder = 2800;
     /** 多边形层级 */
-    static polygonOrder = 40;
+    static polygonOrder = 4000;
     /** 直线层级 */
-    static lineOrder = 50;
+    static lineOrder = 5000;
     /** 折线层级 */
-    static polylineOrder = 60;
+    static polylineOrder = 6000;
     /** 图片层级 */
-    static imageOrder = 70;
+    static imageOrder = 7000;
     /** 文本层级 */
-    static textOrder = 80;
+    static textOrder = 8000;
     /** 位置标签对象层级 */
-    static markOrder = 99;
+    static markOrder = 9900;
     /** 遮罩层级    */
-    static shadeOrder = 120;
+    static shadeOrder = 12000;
     /** 框选矩形对象层级 */
-    static rectSelectOrder = 99999;
+    static rectSelectOrder = 9999900;
     /** 高亮对象层级 */
-    static highLightOrder = 9999;
+    static highLightOrder = 999900;
     /** 业务空间关系点位层级 */
-    static RelationOrder = 9999;
+    static RelationOrder = 999900;
     /** 蒙版层级 */
-    static sceneMarkOrder = 99999;
+    static sceneMarkOrder = 9999900;
 } // Interface ItemOrder

+ 1 - 1
saga-web-draw/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@saga-web/draw",
-    "version": "2.1.100",
+    "version": "2.1.101",
     "description": "上格云绘制引擎。",
     "main": "lib/index.js",
     "types": "lib/index.d.js",

+ 4 - 0
saga-web-draw/src/SCanvasView.ts

@@ -84,6 +84,10 @@ export class SCanvasView extends SObject {
     private _beforeLength = 0;
     /** 缩放后二指间距离 */
     private _afterLength = 0;
+    /** 鼠标样式    */
+    set cursor(v: string) {
+        this.canvasView.style.cursor = v;
+    } // Set cursor
 
     ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
     //

+ 2 - 2
saga-web-fengmap/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@saga-web/feng-map",
-    "version": "1.0.23",
+    "version": "1.0.24",
     "description": "上格云Web平面图。",
     "main": "lib/index.js",
     "types": "lib/index.d.js",
@@ -32,7 +32,7 @@
         "typescript": "^3.9.3"
     },
     "dependencies": {
-        "@saga-web/big": "1.0.75",
+        "@saga-web/big": "1.0.81",
         "axios": "^0.18.0"
     }
 }

+ 7 - 2
saga-web-fengmap/src/parser/SFengParser.ts

@@ -211,8 +211,10 @@ export class SFengParser extends SParser {
         120009,
         120010
     ];
-    /** 当前地图的楼层list */
+    /** 当前地图的楼层list(gname to gid映射关系)   */
     gnameToGid = {};
+    /** 当前地图的楼层list */
+    floorList = [];
     /** 当前底图的主题数据   */
     mapTheme: any;
     /** 底图版本号   */
@@ -348,13 +350,16 @@ export class SFengParser extends SParser {
             if (this.mapId != mapId) {
                 this.mapId = mapId;
                 this.gnameToGid = {};
+                this.floorList = [];
                 // @ts-ignore
                 this.fmap.listGroups.forEach(t => {
                     // @ts-ignore
                     this.gnameToGid[t.gname] = t.gid;
+                    // @ts-ignore
+                    this.floorList.push(t);
                 });
             }
-            _fn(this.gnameToGid);
+            _fn(this.gnameToGid, this.floorList);
         });
     } // Function loadMap()
 

+ 2 - 2
saga-web-graph/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@saga-web/graph",
-    "version": "2.1.108",
+    "version": "2.1.110",
     "description": "上格云二维图形引擎。",
     "main": "lib/index.js",
     "types": "lib/index.d.js",
@@ -40,7 +40,7 @@
         "typescript": "^3.5.3"
     },
     "dependencies": {
-        "@saga-web/draw": "2.1.100",
+        "@saga-web/draw": "2.1.101",
         "@types/uuid": "^8.0.0"
     }
 }

+ 6 - 1
saga-web-graph/src/SGraphItem.ts

@@ -143,6 +143,9 @@ export class SGraphItem extends SObject {
     /** 鼠标按下时位置 */
     private _mouseDownPos = new SPoint();
 
+    /** 鼠标样式    */
+    cursor: string = "default";
+
     ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
     // 函数
     /**
@@ -432,7 +435,9 @@ export class SGraphItem extends SObject {
                 return true;
             }
         }
-
+        if (this.scene && this.scene.view) {
+            this.scene.view.cursor = this.cursor;
+        }
         if (
             event.buttons & SMouseButton.LeftButton &&
             this.moveable &&

+ 188 - 0
saga-web-graph/src/SGraphSelectContainer.ts

@@ -1,6 +1,7 @@
 import { SGraphItem } from "./SGraphItem";
 import { SObject } from "@saga-web/base/lib";
 import { SGraphLayoutType } from "./enums/SGraphLayoutType";
+import { SOrderSetType } from "./enums/SOrderSetType";
 
 /**
  * 基本选择器
@@ -14,6 +15,8 @@ export class SGraphSelectContainer extends SObject {
     get count(): number {
         return this.itemList.length;
     }
+    /** 置顶zorder增加基数    */
+    private radix: number = 0.001;
 
     /**
      * 构造体
@@ -131,6 +134,34 @@ export class SGraphSelectContainer extends SObject {
     } // Function layout()
 
     /**
+     * 图层操作
+     *
+     * @param   type    操作类型
+     * */
+    setOrder(type: SOrderSetType): void {
+        if (this.itemList.length < 1) {
+            return;
+        }
+        switch (type) {
+            case SOrderSetType.Top:
+                this.setTop();
+                break;
+            case SOrderSetType.Bottom:
+                this.setBottom();
+                break;
+            case SOrderSetType.After:
+                this.setAfter();
+                break;
+            case SOrderSetType.Before:
+                this.setBefore();
+                break;
+            default:
+                console.log("图层操作类型不存在");
+                break;
+        }
+    } // Function setOrder()
+
+    /**
      * 左对齐
      *
      * */
@@ -380,4 +411,161 @@ export class SGraphSelectContainer extends SObject {
             }
         }
     } // Function alignHorizontal()
+
+    // 修改层级操作步骤:
+    // 排序(保持相对层级不变)
+    // children里边要取 整数部分相同的 点:children是已经排好序的
+    // 然后再取最大值
+    /**
+     * 置顶
+     *
+     * */
+    private setTop(): void {
+        const arr: SGraphItem[] = this.sortItemList(this.itemList, true);
+        // 按顺序zOrder增加
+        arr.forEach(it => {
+            let max = it.zOrder;
+            if (it.parent) {
+                it.parent.children.forEach(item => {
+                    if (
+                        Number(max.toFixed()) == Number(item.zOrder.toFixed())
+                    ) {
+                        if (item.zOrder > max) {
+                            max = item.zOrder;
+                        }
+                    }
+                });
+                it.zOrder = max + this.radix;
+            }
+        });
+    } // Function setTop()
+
+    /**
+     * 置底
+     *
+     * */
+    private setBottom(): void {
+        const arr: SGraphItem[] = this.sortItemList(this.itemList, false);
+        // 按顺序zOrder增加
+        arr.forEach(it => {
+            let min = it.zOrder;
+            if (it.parent) {
+                it.parent.children.forEach(item => {
+                    if (
+                        Number(min.toFixed()) == Number(item.zOrder.toFixed())
+                    ) {
+                        if (item.zOrder < min) {
+                            min = item.zOrder;
+                        }
+                    }
+                });
+                it.zOrder = min - this.radix;
+            }
+        });
+    } // Function setBottom()
+
+    /**
+     * 下移一层zorder减小
+     *
+     * */
+    private setBefore(): void {
+        const arr: SGraphItem[] = this.sortItemList(this.itemList, false);
+        arr.forEach(it => {
+            if (it.parent) {
+                const min = it.zOrder;
+                let temp = it.parent.children
+                    .map(child => {
+                        if (
+                            Number(child.zOrder.toFixed()) ==
+                            Number(min.toFixed())
+                        ) {
+                            return child.zOrder;
+                        }
+                    })
+                    .filter(c => c);
+                temp = [...new Set(temp)];
+                // 当前层有多个
+                const index = temp.indexOf(it.zOrder);
+                if (index <= 1) {
+                    // 当前item 索引为1时 将当前item放至第一个前边
+                    // @ts-ignore
+                    it.zOrder = temp[0] - this.radix;
+                } else if (index > 1) {
+                    // 当前item 索引大于等于2,将当前item放至前两个中间
+                    // @ts-ignore
+                    it.zOrder = (temp[index - 1] + temp[index - 2]) / 2;
+                }
+            }
+        });
+    } // Function setAfter()
+
+    /**
+     * 上移一层zorder增加
+     *
+     * */
+    private setAfter(): void {
+        const arr: SGraphItem[] = this.sortItemList(this.itemList, false);
+        arr.forEach(it => {
+            if (it.parent) {
+                const max = it.zOrder;
+                let temp = it.parent.children
+                    .map(child => {
+                        if (
+                            Number(child.zOrder.toFixed()) ==
+                            Number(max.toFixed())
+                        ) {
+                            return child.zOrder;
+                        }
+                    })
+                    .filter(c => c);
+                temp = [...new Set(temp)].reverse();
+                // 当前层有多个
+                const index = temp.indexOf(it.zOrder);
+                if (index <= 1) {
+                    // 当前item 索引为1时 将当前item放至第一个前边
+                    // @ts-ignore
+                    it.zOrder = temp[0] + this.radix;
+                } else if (index > 1) {
+                    // 当前item 索引大于等于2,将当前item放至前两个中间
+                    // @ts-ignore
+                    it.zOrder = (temp[index - 1] + temp[index - 2]) / 2;
+                }
+            }
+        });
+    } // Function setBefore()
+
+    /**
+     * 数组排序
+     *
+     * @param   arr     排序前的数组
+     * @param   flag    正序or逆序
+     * @return  list    排序后的数组
+     * */
+    sortItemList(arr: SGraphItem[], flag: boolean = true): SGraphItem[] {
+        const list: SGraphItem[] = arr.map(t => t);
+        list.sort(this.compare("zOrder", flag));
+        return list;
+    } // Function sortItemList()
+
+    /**
+     * 按照某个属性排序
+     *
+     * @param   prop    属性
+     * @param   flag    默认正序
+     * */
+    private compare(prop: string, flag: boolean) {
+        const f = flag ? 1 : -1;
+        // eslint-disable-next-line @typescript-eslint/explicit-function-return-type
+        return (a: any, b: any) => {
+            a = a[prop];
+            b = b[prop];
+            if (a < b) {
+                return f * -1;
+            }
+            if (a > b) {
+                return f * 1;
+            }
+            return 0;
+        };
+    } // Function compare()
 } // Class SGraphSelectContainer

+ 45 - 0
saga-web-graph/src/SGraphView.ts

@@ -1,5 +1,6 @@
 import { SMouseEvent, SNetUtil } from "@saga-web/base/lib";
 import {
+    SCanvasPaintEngine,
     SCanvasView,
     SPainter,
     SPoint,
@@ -8,6 +9,8 @@ import {
 } from "@saga-web/draw/lib";
 import { SGraphScene } from "./SGraphScene";
 import { SGraphItem } from "./SGraphItem";
+import { v1 as uuidv1 } from "uuid";
+import { SColor } from "@saga-web/draw";
 
 /**
  * Graphy图形引擎视图类
@@ -30,6 +33,8 @@ export class SGraphView extends SCanvasView {
         }
         this.update();
     } // Set scene
+    /** 背景色 */
+    backgroundColor: SColor = SColor.Transparent;
 
     /**
      * 构造函数
@@ -217,6 +222,43 @@ export class SGraphView extends SCanvasView {
     } // Function mapToScene()
 
     /**
+     * 保存图像
+     *
+     * @param   name    名称
+     * @param   type    图像类型
+     * @param   width   要保存图形的宽
+     * @param   height  要保存图形的高
+     */
+    saveImageSize(
+        name: string,
+        type: string,
+        width: number,
+        height: number
+    ): void {
+        const can = document.createElement("CANVAS") as HTMLCanvasElement;
+        can.width = width;
+        can.height = height;
+        can.id = uuidv1();
+        const body = document.getElementsByTagName("body")[0];
+        body.appendChild(can);
+        let engine = new SCanvasPaintEngine(
+            can.getContext("2d") as CanvasRenderingContext2D
+        );
+        let painter = new SPainter(engine);
+        let vi = new SGraphView(can.id);
+        vi.scene = this.scene;
+        vi.fitSceneToView();
+        vi.backgroundColor = new SColor("#FFFFFF");
+        vi.onDraw(painter);
+        vi.saveImage(name, type);
+        // @ts-ignore
+        this.scene.view = this;
+        can.remove();
+        // @ts-ignore
+        vi = null;
+    } // Function saveImageSize()
+
+    /**
      * 绘制视图
      *
      * @param   painter     painter对象
@@ -254,6 +296,9 @@ export class SGraphView extends SCanvasView {
      * @param   painter     painter对象
      */
     protected drawBackground(painter: SPainter): void {
+        painter.brush.color = this.backgroundColor;
+        painter.pen.color = SColor.Transparent;
+        painter.drawRect(0, 0, this.width, this.height);
         // DO NOTHING
     } // Function drawBackground()
 

+ 15 - 0
saga-web-graph/src/enums/SOrderSetType.ts

@@ -0,0 +1,15 @@
+/**
+ * 图层操作
+ *
+ * @author  郝建龙
+ */
+export enum SOrderSetType {
+    /** 置顶  */
+    Top,
+    /** 置底    */
+    Bottom,
+    /** 上移一层    */
+    After,
+    /** 下移一层    */
+    Before
+} // Enum SOrderSetType

+ 3 - 1
saga-web-graph/src/index.ts

@@ -44,6 +44,7 @@ import { SAnchorItem } from "./items/SAnchorItem";
 import { STextItem } from "./items/STextItem";
 import { SImageShowType } from "./enums/SImageShowType";
 import { SLineStyle } from "./enums/SLineStyle";
+import { SOrderSetType } from "./enums/SOrderSetType";
 
 export {
     SGraphItem,
@@ -62,5 +63,6 @@ export {
     SAnchorItem,
     STextItem,
     SImageShowType,
-    SLineStyle
+    SLineStyle,
+    SOrderSetType
 };