Procházet zdrojové kódy

新增防火分区和石材铺装

YaolongHan před 4 roky
rodič
revize
3b869d5416

+ 13 - 3
package-lock.json

@@ -1069,6 +1069,16 @@
       "integrity": "sha512-/BJJlKVsW8bRO8gxN57qJ5AwHQXno+AbGE0G9FqLPlmpaW9SPLe8rV3EQ7QavVG1VPGdoSGJ1UIqNp4KVBujpg==",
       "requires": {
         "@saga-web/graph": "2.1.82"
+      },
+      "dependencies": {
+        "@saga-web/graph": {
+          "version": "2.1.82",
+          "resolved": "http://192.168.200.80:8081/repository/npm-saga/@saga-web/graph/-/graph-2.1.82.tgz",
+          "integrity": "sha512-JyX74MLDZdRK4hbbwV7d5YJaaQJ84FCTqeJFlBOaXS0prXUmlGdB8HikQuQAyK15smosdw0ILYUNTn3wjGkgQw==",
+          "requires": {
+            "@saga-web/draw": "2.1.94"
+          }
+        }
       }
     },
     "@saga-web/draw": {
@@ -1107,9 +1117,9 @@
       }
     },
     "@saga-web/graph": {
-      "version": "2.1.82",
-      "resolved": "http://192.168.200.80:8081/repository/npm-saga/@saga-web/graph/-/graph-2.1.82.tgz",
-      "integrity": "sha512-JyX74MLDZdRK4hbbwV7d5YJaaQJ84FCTqeJFlBOaXS0prXUmlGdB8HikQuQAyK15smosdw0ILYUNTn3wjGkgQw==",
+      "version": "2.1.84",
+      "resolved": "http://192.168.200.80:8081/repository/npm-saga/@saga-web/graph/-/graph-2.1.84.tgz",
+      "integrity": "sha512-7RwFNoVQcjrmWmzZhOrSUkvCeBfJsf7i0HElXvouN8ooy9R3KP1xcJnDGZ2MP9i9udmw09JEbjMVHrLhXZrEsQ==",
       "requires": {
         "@saga-web/draw": "2.1.94"
       }

+ 8 - 2
src/components/baseEditer.vue

@@ -305,7 +305,7 @@ export default {
       });
       // 修改当前得状态是否为编辑状态
       bus.$on("OpenEditStatus", () => {
-  ` `        // 获取焦点item (必须选中且仅选中一个)
+        ` `; // 获取焦点item (必须选中且仅选中一个)
         if (
           this.chiceItemList &&
           this.chiceItemList.length &&
@@ -319,12 +319,18 @@ export default {
           }
         }
       });
+      //修改图例说明
+      bus.$on("changeitemExplain", val => {
+        this.scene.upadatitemExplain(val);
+      });
     },
     // 读取数据
     readGroup() {
       const data = {
         categoryId: this.urlMsg.categoryId,
-        projectId: this.urlMsg.projectId
+        projectId: this.urlMsg.projectId,
+        BuildingID: this.urlMsg.BuildingID, // 建筑ID
+        FloorID: this.urlMsg.FloorID // 楼层id
       };
       return readGroup(data);
     }

+ 60 - 18
src/components/edit/attr_select.vue

@@ -102,8 +102,8 @@
     </div>
 
     <!--针对“设备/位置/管线/分区”属性示例-->
-    <div class="attr-select">
-      <div v-if="type =='Image'||type == 'Line'">
+    <div class="attr-select" v-show="type =='Image'|| type == 'Line' || type == 'Zone'">
+      <div v-if="type =='Image'|| type == 'Line'">
         <div class="row-tit" v-if="true">颜色</div>
         <div class="row" v-if="true">
           <swatches @input="changefillColor" :swatches="swatchess" v-model="fillColor" inline></swatches>
@@ -121,7 +121,7 @@
             <a-input-number v-model="fontSize" :min="1" @change="changeFont" style="width: 168px" />
           </div>
           <div class="color-choice">
-            <swatches v-model="color" @close="changeFontColor" popover-x="left" />
+            <swatches v-model="fontColor" @close="changeFontColor" popover-x="left" />
           </div>
         </div>
         <!-- 当为设备状态时 -->
@@ -150,7 +150,7 @@
         </div>
       </div>
       <div v-else>
-        <div v-if="false">
+        <div v-if="SubType=='FHFQ'">
           <!-- 防火分区 -->
           <div class="row-tit">颜色</div>
           <div class="row">
@@ -158,7 +158,11 @@
           </div>
           <div class="row">
             <div class="row-tit">名称显示</div>
-            <a-button type="link" class="edit-option-btn"  @click="OpenEditStatus">{{editStatus[type]}}</a-button>
+            <a-button
+              type="link"
+              class="edit-option-btn"
+              @click="OpenEditStatus"
+            >{{editStatus[type]}}</a-button>
           </div>
           <div class="row">
             <a-input v-model="lengedName" @change="changeLengedName" />
@@ -174,37 +178,65 @@
               />
             </div>
             <div class="color-choice">
-              <swatches v-model="color" @close="changeFontColor" popover-x="left" />
+              <swatches v-model="fontColor" @close="changeFontColor" popover-x="left" />
             </div>
           </div>
         </div>
-        <div v-else>
+        <div v-if="SubType=='SCPZ'">
           <!-- 石材铺装 -->
           <div class="row">
             <div class="row-tit">图例说明</div>
-            <a-button type="link" class="edit-option-btn"  @click="OpenEditStatus">编辑区域</a-button>
+            <a-button type="link" class="edit-option-btn" @click="OpenEditStatus">编辑区域</a-button>
           </div>
           <div class="row">
-            <a-textarea :auto-size="{ minRows: 4, maxRows: 6 }" />
+            <a-textarea @change="changeitemExplain" v-model="itemExplain" :auto-size="{ minRows: 4, maxRows: 6 }" />
           </div>
           <div class="row">
             <div class="row-tit">描边</div>
             <div class="grid-content">
               <a-input-number
-                v-model="fontSize"
+                v-model="lineWidth"
                 :min="1"
-                @change="changeFont"
+                @change="changeLineWidth"
                 style="width: 168px"
               />
             </div>
             <div class="color-choice">
-              <swatches v-model="color" @close="changeFontColor" popover-x="left" />
+              <swatches v-model="borderColor" @close="changeBorderColor" popover-x="left" />
             </div>
           </div>
           <div class="row">
             <div class="row-tit">填充</div>
             <div class="color-choice">
-              <swatches v-model="color" @close="changeFontColor" popover-x="left" />
+              <swatches v-model="fillColor" @close="changefillColor" popover-x="left" />
+            </div>
+          </div>
+        </div>
+        <div v-if="!SubType">
+          <!-- 普通分区 -->
+          <div class="row">
+            <div class="row-tit">名称显示</div>
+            <a-button
+              type="link"
+              class="edit-option-btn"
+              @click="OpenEditStatus"
+            >{{editStatus[type]}}</a-button>
+          </div>
+          <div class="row">
+            <a-input v-model="lengedName" @change="changeLengedName" />
+          </div>
+          <div class="row">
+            <div class="row-tit">字号</div>
+            <div class="grid-content">
+              <a-input-number
+                v-model="fontSize"
+                :min="1"
+                @change="changeFont"
+                style="width: 168px"
+              />
+            </div>
+            <div class="color-choice">
+              <swatches v-model="fontColor" @close="changeFontColor" popover-x="left" />
             </div>
           </div>
         </div>
@@ -324,13 +356,14 @@ export default {
       editStatus: {
         Image: "编辑设备",
         Line: "管道编辑",
-        Zone: "编辑区域",
+        Zone: "编辑区域"
       },
       swatchess: ["#69C5FC", "#656EDF", "#58AF6F", "#2D8FAA"],
       lengedName: "", // 图例名称
       imageNum: 1, //设备数量
       fillColor: "", //修改填充色 (主要针对防火风区以及石材铺装)
-      focusItem:null  //选中得item
+      SubType: "", //空间类型,区分石材铺装
+      itemExplain:'' //图例说明 只针对石材铺装
     };
   },
   methods: {
@@ -356,8 +389,8 @@ export default {
       bus.$emit("changeText", this.textMsg);
     },
     // 改变线的颜色
-    changeBorderColor(color) {
-      bus.$emit("changeBorderColor", color);
+    changeBorderColor() {
+      bus.$emit("changeBorderColor", this.borderColor);
     },
     // 改变字体颜色
     changeFontColor(color) {
@@ -411,13 +444,20 @@ export default {
       bus.$emit("changefillColor", this.fillColor);
     },
     //设置缩小item为编辑状态
-    OpenEditStatus(){
+    OpenEditStatus() {
       bus.$emit("OpenEditStatus");
+    },
+    // 编辑图例说明
+    changeitemExplain(){
+      bus.$emit("changeitemExplain",this.itemExplain);
     }
   },
   watch: {
     focusItemList: function(newval) {
       const Item = newval.itemList[0];
+      if (Item.data && Item.data.SubType) {
+        this.SubType = Item.data.SubType;
+      }
       if (newval.itemList.length == 1) {
         if (newval.itemType == "baseText") {
           this.textMsg = Item.text;
@@ -439,6 +479,8 @@ export default {
             this.fontSize = Item.font.size;
           } else if (newval.itemType == "Line") {
             this.color = Item.color;
+            this.fillColor = Item.fillColor;
+            this.borderColor = Item.strokeColor;
             this.lineWidth = Item.lineWidth;
           }
         }

+ 0 - 1
src/components/edit/left_toolbar.vue

@@ -298,7 +298,6 @@ export default {
         // 接口请求
         const arr = {
           GraphCategoryIds: this.categoryId,
-          // GraphCategoryIds: "NTXT",
           Type: item.type
         };
         queryGroup(arr).then(res => {

+ 40 - 13
src/components/mapClass/EditScence.ts

@@ -3,13 +3,15 @@ import { SGraphScene, SGraphLayoutType } from '@saga-web/graph/lib';
 import { SFloorParser, SLineItem, SPolylineItem, SItemStatus, ItemOrder } from "@saga-web/big";
 import { SGraphItem, SLineStyle, SImageItem, STextItem, SGraphPointListInsert, SGraphPointListDelete, SGraphPointListUpdate, SGraphAddCommand } from "@saga-web/graph/lib";
 import { SZoneLegendItem } from "@/lib/items/SZoneLegendItem";
+import { SSCPZZoneLegendItem } from "@/lib/items/SSCPZZoneLegendItem";
+import { SFHFQZoneLegendItem } from "@/lib/items/SFHFQZoneLegendItem";
 import { SImageLegendItem } from "@/lib/items/SImageLegendItem";
 import { TipelineItem } from "@/lib/items/TipelineItem";
 import { SImgTextItem } from "@/lib/items/SImgTextItem";
 import { SImageMarkerItem } from "@/lib/items/SImageMarkerItem"
 import { SPoint, SFont, SColor } from '@saga-web/draw/lib';
 import { Legend } from '@/lib/types/Legend';
-import { Relation } from '@/lib/types/Legend';
+import { Relation } from '@/lib/types/Relation';
 
 import { uuid } from "@/components/mapClass/until";
 import { STextMarkerItem } from '@/lib/items/STextMarkerItem';
@@ -78,13 +80,16 @@ export class EditScence extends SGraphScene {
 
         if (obj.itemList[0] instanceof STextMarkerItem) {
             itemType = 'baseText'
-            console.log('obj.itemList[0]', itemType, obj.itemList[0])
         } else if (obj.itemList[0] instanceof SImageMarkerItem) {
             itemType = 'baseImage'
         } else if (obj.itemList[0] instanceof SLineMarkerItem) {
             itemType = 'baseLine'
         } else if (obj.itemList[0] instanceof SZoneLegendItem) {
             itemType = 'Zone'
+        } else if (obj.itemList[0] instanceof SFHFQZoneLegendItem) {
+            itemType = 'Zone'
+        } else if (obj.itemList[0] instanceof SSCPZZoneLegendItem) {
+            itemType = 'Zone'
         } else if (obj.itemList[0] instanceof SImageLegendItem) {
             itemType = 'Image'
         } else if (obj.itemList[0] instanceof TipelineItem) {
@@ -194,6 +199,8 @@ export class EditScence extends SGraphScene {
      * 增加多边形item lenged
      */
     addPolygonItem(event: SMouseEvent): void {
+
+        const SubType = this._legend.SubType ? this._legend.SubType : ''
         const LegendData: Legend = {
             ID: uuid(),
             Name: this._legend.Name,
@@ -204,18 +211,25 @@ export class EditScence extends SGraphScene {
             Type: "Zone",
             Pos: { X: event.x, Y: event.y },
             OutLine: [{ X: event.x, Y: event.y }],
+            SubType: SubType,
             Properties: {
                 StrokeColor: this._legend.Color,
                 FillColor: this._legend.FillColor,
                 LineDash: this._legend.LineDash,
                 LineWidth: this._legend.LineWidth,
-                font:0,
-                color:'',
-                TextPos:{X:0,Y:0}
+                font: 0,
+                color: '',
+                TextPos: { X: 0, Y: 0 }
             },
         }
-
-        const Polylines = new SZoneLegendItem(null, LegendData);
+        let Polylines = null;
+        if (SubType == "SCPZ") {
+            Polylines = new SSCPZZoneLegendItem(null, LegendData);
+        } else if (SubType == "FHFQ") {
+            Polylines = new SFHFQZoneLegendItem(null, LegendData);
+        } else {
+            Polylines = new SZoneLegendItem(null, LegendData);
+        }
         Polylines.selectable = true;
         //设置状态
         Polylines.status = SItemStatus.Create;
@@ -308,10 +322,10 @@ export class EditScence extends SGraphScene {
             Properties: {
                 Url: '/serve/topology-wanda/Picture/query/' + this._legend.Url,
                 Num: 1, // 此num与信息工程化得num无关
-                sWidth:0,  //icon 的宽
-                sHeight:0,   //icon 的高
-                font:0,    //font
-                color:''  //字体颜色
+                sWidth: 0,  //icon 的宽
+                sHeight: 0,   //icon 的高
+                font: 0,    //font
+                color: ''  //字体颜色
             },
         }
         const item = new SImageLegendItem(null, LegendData);
@@ -391,8 +405,12 @@ export class EditScence extends SGraphScene {
      */
     updatedBorderColor(color: string): void {
         if (this.focusItem) {
-            let old = this.focusItem.strokeColor;
-            this.focusItem.strokeColor = color;
+            if (this.focusItem instanceof SZoneLegendItem || this.focusItem instanceof SSCPZZoneLegendItem || this.focusItem instanceof SFHFQZoneLegendItem) {
+                this.focusItem.strokeColor = new SColor(color)
+            } else {
+                // let old = this.focusItem.strokeColor;
+                this.focusItem.strokeColor = color;
+            }
             // this.undoStack.push(new SGraphPropertyCommand(this, this.focusItem, "color", old, color));
         }
     }
@@ -514,6 +532,15 @@ export class EditScence extends SGraphScene {
             this.focusItem.fillColor = new SColor(fillColor)
         }
     }
+    /**
+   * 更改图例说明数量
+   * @param num number item数量 (只对icon设备类)
+   */
+    upadatitemExplain(itemExplain: string): void {
+        if (this.focusItem) {
+            this.focusItem.itemExplain = itemExplain
+        }
+    }
 
     /**
      * 删除指定item

+ 2 - 1
src/components/mapClass/SPolygonItem.ts

@@ -83,7 +83,8 @@ export class SPolygonItem extends SGraphItem {
         return this._strokeColor
     };
     set strokeColor(v: SColor) {
-        this._strokeColor = v
+        this._strokeColor = v;
+        this.update()
     }
     /** 填充颜色 */
     _fillColor: SColor = new SColor("#1EE887");

+ 170 - 0
src/lib/items/SFHFQZoneLegendItem.ts

@@ -0,0 +1,170 @@
+
+import { SGraphItem } from "@saga-web/graph/lib";
+import { SPolygonItem } from "@/components/mapClass/SPolygonItem";
+import { Legend } from '../types/Legend';
+import { SPainter, SColor, SFont, SPoint } from "@saga-web/draw";
+import { STextItem } from '@saga-web/graph/lib';
+import { hexify } from "@/components/mapClass/until"
+import { SItemStatus, ItemOrder } from '@saga-web/big/lib';
+/**
+ *图例节点Item(区域类型 --防火分区)
+ *
+ * * @author  张宇(taohuzy@163.com)
+ */
+export class SFHFQZoneLegendItem extends SPolygonItem {
+    /** 图例节点对象数据 */
+    data: Legend;
+
+    /** text item   */
+    textItem: STextItem = new STextItem(this);
+
+    get text(): string {
+        return this.textItem.text;
+    }
+    set text(v: string) {
+        this.textItem.text = v;
+        this.update();
+    }
+    get color(): string {
+        return this.textItem.color;
+    }
+    set color(v: string) {
+        this.textItem.color = v
+    }
+    get font(): SFont {
+        return this.textItem.font
+    }
+    set font(v: SFont) {
+        this.textItem.font = v
+    }
+
+    get status(): SItemStatus {
+        return this._status;
+    }
+    // 编辑当前状态
+    set status(value: SItemStatus) {
+        this._status = value;
+        // 如果状态为show则需清栈
+        if (value == SItemStatus.Normal) {
+            // 切换显示状态显示文本
+            this.showText = true;
+            // 切换显示状态不可移动文本
+            this.textItem.moveable = false;
+
+            if (this.undoStack) {
+                this.undoStack.clear();
+            }
+        } else if (value == SItemStatus.Edit) {
+            // 切换编辑状态显示文本
+            this.showText = true;
+            // 切换编辑状态可移动文本
+            this.textItem.moveable = true;
+        } else if (value == SItemStatus.Create) {
+            // 切换创建状态不显示文本
+            this.showText = false;
+            // 切换创建状态不可移动文本
+            this.textItem.moveable = false;
+        }
+        this.update();
+    };
+
+    /** 是否显示文字  */
+    _showText: boolean = true;
+    get showText(): boolean {
+        return this._showText;
+    }
+    set showText(v: boolean) {
+        if (v === this._showText) {
+            return
+        }
+        this._showText = v;
+        if (v) {
+            this.textItem.show();
+        } else {
+            this.textItem.hide();
+        }
+    }
+
+
+    /**
+     * 构造函数
+     *
+     * @param parent    指向父对象
+     * @param data      图例节点对象数据
+     */
+    constructor(parent: SGraphItem | null, data: Legend) {
+        super(parent);
+        this.zOrder = ItemOrder.polygonOrder;
+        this.data = data;
+        this.id = data.ID;
+        this.name = data.Name;
+        this.text = data.Name;
+        this.font = new SFont("sans-serif", 2);
+        if (data) {
+            this.setPointList = [];
+            let setPointList: SPoint[];
+            if (data.OutLine) {
+                if (data.OutLine[0] instanceof SPoint) {
+                    this.setPointList = data.OutLine;
+                } else {
+                    setPointList = data.OutLine.map(i => {
+                        return (new SPoint(i.X, i.Y))
+                    })
+                    this.setPointList = setPointList;
+                }
+            }
+            // 设置线宽
+            if (data.Properties.LineWidth) {
+                this.lineWidth = data.Properties.LineWidth
+            }
+            if (data.Properties.StrokeColor) {
+                this.strokeColor = data.Properties.StrokeColor.includes('#') ? new SColor(data.Properties.StrokeColor) : new SColor(hexify(data.Properties.StrokeColor));
+            }
+            if (data.Properties.FillColor) {
+                this.fillColor = data.Properties.FillColor.includes('#') ? new SColor(data.Properties.FillColor) : new SColor(hexify(data.Properties.FillColor))
+            }
+            if (data.Properties.TextPos) {
+                this.textItem.moveTo(data.Properties.TextPos.X, data.Properties.TextPos.Y);
+            }
+            if (data.Properties.color) {
+                this.color = data.Properties.color
+            }
+            if (data.Properties.font) {
+                this.font =new SFont("sans-serif", data.Properties.font);
+            }
+            //    if( data.Properties.LineDash){
+            //     this.LineDash =this._legend.Properties.LineDash
+            //    }
+        }
+        // 监听多边形创建完成事件,并动态计算文本位置
+        this.connect("finishCreated",this, () => {
+            // 计算文本位置
+            let x: number = this.getPointList.reduce((pre, cur, index, arr) => {
+                                return pre + (cur.x / arr.length)
+                            }, 0),
+                y: number = this.getPointList.reduce((pre, cur, index, arr) => {
+                                return pre + (cur.y / arr.length)
+                            }, 0);
+            this.textItem.moveTo(x, y);
+        })
+    }
+
+    toData(): any {
+        this.data.Pos = {X: this.x, Y: this.y};
+        this.data.Name = this.text;
+        this.data.Properties.FillColor = this.fillColor.value;
+        this.data.Properties.StrokeColor = this.strokeColor.value;
+        this.data.Properties.LineWidth = this.lineWidth;
+        this.data.OutLine = this.getPointList.map(pos => {
+            return {
+                X: pos.x,
+                Y: pos.y
+            }
+        });
+        this.data.Properties.TextPos = {X: this.textItem.x, Y: this.textItem.y};
+        this.data.Properties.font =  this.font.size;
+        this.data.Properties.color =  this.color;
+        return this.data;
+    }
+
+} // Class SZoneLegendItem

+ 176 - 0
src/lib/items/SSCPZZoneLegendItem.ts

@@ -0,0 +1,176 @@
+
+import { SGraphItem } from "@saga-web/graph/lib";
+import { SPolygonItem } from "@/components/mapClass/SPolygonItem";
+import { Legend } from '../types/Legend';
+import { SPainter, SColor, SFont, SPoint } from "@saga-web/draw";
+import { STextItem } from '@saga-web/graph/lib';
+import { hexify } from "@/components/mapClass/until"
+import { SItemStatus, ItemOrder } from '@saga-web/big/lib';
+/**
+ * 图例节点Item(区域类型 --石材铺装)
+ *
+ * * @author  张宇(taohuzy@163.com)
+ */
+export class SSCPZZoneLegendItem extends SPolygonItem {
+    /** 图例节点对象数据 */
+    data: Legend;
+
+    /** text item   */
+    textItem: STextItem = new STextItem(this);
+
+    get text(): string {
+        return this.textItem.text;
+    }
+    set text(v: string) {
+        this.textItem.text = v;
+        this.update();
+    }
+    get color(): string {
+        return this.textItem.color;
+    }
+    set color(v: string) {
+        this.textItem.color = v
+    }
+    get font(): SFont {
+        return this.textItem.font
+    }
+    set font(v: SFont) {
+        this.textItem.font = v
+    }
+
+    get status(): SItemStatus {
+        return this._status;
+    }
+    // 编辑当前状态
+    set status(value: SItemStatus) {
+        this._status = value;
+        // 如果状态为show则需清栈
+        if (value == SItemStatus.Normal) {
+            // 切换显示状态显示文本
+            this.showText = true;
+            // 切换显示状态不可移动文本
+            this.textItem.moveable = false;
+
+            if (this.undoStack) {
+                this.undoStack.clear();
+            }
+        } else if (value == SItemStatus.Edit) {
+            // 切换编辑状态显示文本
+            this.showText = true;
+            // 切换编辑状态可移动文本
+            this.textItem.moveable = true;
+        } else if (value == SItemStatus.Create) {
+            // 切换创建状态不显示文本
+            this.showText = false;
+            // 切换创建状态不可移动文本
+            this.textItem.moveable = false;
+        }
+        this.update();
+    };
+
+    /** 是否显示文字  */
+    _showText: boolean = true;
+    get showText(): boolean {
+        return this._showText;
+    }
+    set showText(v: boolean) {
+        if (v === this._showText) {
+            return
+        }
+        this._showText = v;
+        if (v) {
+            this.textItem.show();
+        } else {
+            this.textItem.hide();
+        }
+    }
+    /** 图例说明  */
+    set itemExplain(v:string){
+      this.data.Properties.ItemExplain = v
+    }
+    get itemExplain():string{
+        return this.data.Properties.ItemExplain
+    }
+
+    /**
+     * 构造函数
+     *
+     * @param parent    指向父对象
+     * @param data      图例节点对象数据
+     */
+    constructor(parent: SGraphItem | null, data: Legend) {
+        super(parent);
+        this.zOrder = ItemOrder.polygonOrder;
+        this.data = data;
+        this.id = data.ID;
+        this.name = data.Name;
+        this.text = data.Name;
+        this.font = new SFont("sans-serif", 2);
+        if (data) {
+            this.setPointList = [];
+            let setPointList: SPoint[];
+            if (data.OutLine) {
+                if (data.OutLine[0] instanceof SPoint) {
+                    this.setPointList = data.OutLine;
+                } else {
+                    setPointList = data.OutLine.map(i => {
+                        return (new SPoint(i.X, i.Y))
+                    })
+                    this.setPointList = setPointList;
+                }
+            }
+            // 设置线宽
+            if (data.Properties.LineWidth) {
+                this.lineWidth = data.Properties.LineWidth
+            }
+            if (data.Properties.StrokeColor) {
+                this.strokeColor = data.Properties.StrokeColor.includes('#') ? new SColor(data.Properties.StrokeColor) : new SColor(hexify(data.Properties.StrokeColor));
+            }
+            if (data.Properties.FillColor) {
+                this.fillColor = data.Properties.FillColor.includes('#') ? new SColor(data.Properties.FillColor) : new SColor(hexify(data.Properties.FillColor))
+            }
+            if (data.Properties.TextPos) {
+                this.textItem.moveTo(data.Properties.TextPos.X, data.Properties.TextPos.Y);
+            }
+            if (data.Properties.color) {
+                this.color = data.Properties.color
+            }
+            if (data.Properties.font) {
+                this.font =new SFont("sans-serif", data.Properties.font);
+            }
+            //    if( data.Properties.LineDash){
+            //     this.LineDash =this._legend.Properties.LineDash
+            //    }
+        }
+        // 监听多边形创建完成事件,并动态计算文本位置
+        this.connect("finishCreated",this, () => {
+            // 计算文本位置
+            let x: number = this.getPointList.reduce((pre, cur, index, arr) => {
+                                return pre + (cur.x / arr.length)
+                            }, 0),
+                y: number = this.getPointList.reduce((pre, cur, index, arr) => {
+                                return pre + (cur.y / arr.length)
+                            }, 0);
+            this.textItem.moveTo(x, y);
+        })
+    }
+
+    toData(): any {
+        this.data.Pos = {X: this.x, Y: this.y};
+        this.data.Name = this.text;
+        this.data.Properties.FillColor = this.fillColor.value;
+        this.data.Properties.StrokeColor = this.strokeColor.value;
+        this.data.Properties.LineWidth = this.lineWidth;
+        this.data.OutLine = this.getPointList.map(pos => {
+            return {
+                X: pos.x,
+                Y: pos.y
+            }
+        });
+        this.data.Properties.TextPos = {X: this.textItem.x, Y: this.textItem.y};
+        this.data.Properties.font =  this.font.size;
+        this.data.Properties.color =  this.color;
+        return this.data;
+    }
+
+} // Class SZoneLegendItem

+ 2 - 0
src/lib/types/Legend.ts

@@ -58,4 +58,6 @@ export interface Legend {
     OutLine?: Point[];
     /** 由应用自己定义  */
     Properties?: any;
+     /** zone 区分防火分区和石材铺装  */
+    SubType?:string
 } // Interface Legend