Ver código fonte

显示隐藏文字

haojianlong 4 anos atrás
pai
commit
775453b11e

+ 4 - 1
src/components/floorMap/canvasFun.vue

@@ -12,7 +12,7 @@
                     </el-dropdown-menu>
                 </el-dropdown>
             </div>
-            <div class='small-block'>
+            <div class='small-block' @click="showText">
                 <i>
                     <img src='../../assets/imgs/er.png' alt />
                 </i>
@@ -91,6 +91,9 @@ export default {
                 this.sliderVal = this.maxScale
             }
             this.scale(this.sliderVal)
+        },
+        showText() {
+            this.$emit('showText')
         }
     }
 }

+ 6 - 2
src/components/floorMap/index.vue

@@ -5,7 +5,7 @@
     <canvas :id="`canvas${id}`" :width="canvasWidth" :height="canvasHeight" tabindex="0"></canvas>
     <!-- 地图底部操作按钮 -->
     <div class="strip-bottom">
-      <canvasFun @fit="fit" @savePng="savePng" @saveSvg="saveSvg" @saveJson="saveJson" @scale="scale" ref="canvasFun"></canvasFun>
+      <canvasFun @fit="fit" @savePng="savePng" @saveSvg="saveSvg" @saveJson="saveJson" @scale="scale" @showText="showText" ref="canvasFun"></canvasFun>
     </div>
     <room-box ref="boxRoom"></room-box>
   </div>
@@ -200,13 +200,17 @@ export default {
         return;
       }
       let scale = this.view.scale;
-      console.log(val / scale, this.canvasWidth / 2, this.canvasHeight / 2);
       this.view.scaleByPoint(
         val / scale,
         this.canvasWidth / 2,
         this.canvasHeight / 2
       );
     },
+    showText() {
+        this.topologyParser.zoneLegendList.forEach(t => {
+          t.showText = !t.showText;
+        })
+    },
     // 读取数据
     readGroup(FloorID) {
       const data = {

+ 2 - 3
src/lib/items/SFHFQZoneLegendItem.js

@@ -28,7 +28,6 @@ export class SFHFQZoneLegendItem extends SPolygonItem {
         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;
@@ -57,7 +56,7 @@ export class SFHFQZoneLegendItem extends SPolygonItem {
                 this.textItem.moveTo(data.Properties.TextPos.X, data.Properties.TextPos.Y);
             }
             if (data.Properties.color) {
-                this.color = data.Properties.color;
+                this.color = new SColor(data.Properties.color);
             }
             if (data.Properties.font) {
                 this.font = new SFont("sans-serif", data.Properties.font);
@@ -166,7 +165,7 @@ export class SFHFQZoneLegendItem extends SPolygonItem {
         });
         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;
+        this.data.Properties.color = this.color.value;
         return this.data;
     }
     onDraw(painter) {

+ 8 - 9
src/lib/items/SFHFQZoneLegendItem.ts

@@ -25,11 +25,11 @@ export class SFHFQZoneLegendItem extends SPolygonItem {
         this.textItem.text = v;
         this.update();
     }
-    get color(): string {
+    get color(): SColor {
         return this.textItem.color;
     }
-    set color(v: string) {
-        this.textItem.color = v
+    set color(v: SColor) {
+        this.textItem.color = v;
     }
     get font(): SFont {
         return this.textItem.font
@@ -111,7 +111,6 @@ export class SFHFQZoneLegendItem extends SPolygonItem {
         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[];
@@ -133,13 +132,13 @@ export class SFHFQZoneLegendItem extends SPolygonItem {
                 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))
+                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
+                this.color = new SColor(data.Properties.color);
             }
             if (data.Properties.font) {
                 this.font = new SFont("sans-serif", data.Properties.font);
@@ -173,9 +172,9 @@ export class SFHFQZoneLegendItem extends SPolygonItem {
                 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;
+        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.value;
         return this.data;
     }
 

+ 3 - 3
src/lib/items/SImageLegendItem.js

@@ -1,6 +1,6 @@
 import { SIconTextItem } from '@saga-web/big/lib/items/SIconTextItem';
 import { ItemOrder } from '@saga-web/big/lib';
-import { SFont } from '@saga-web/draw/lib';
+import { SFont, SColor } from '@saga-web/draw/lib';
 /**
  * 图例节点Item(图标类型)
  *
@@ -45,7 +45,7 @@ export class SImageLegendItem extends SIconTextItem {
             this.font = new SFont("sans-serif", data.Properties.font);
         }
         if (data.Properties && data.Properties.color) {
-            this.color = data.Properties.color;
+            this.color = new SColor(data.Properties.color);
         }
     }
     get num() {
@@ -72,7 +72,7 @@ export class SImageLegendItem extends SIconTextItem {
         this.data.Properties.sWidth = this.sWidth;
         this.data.Properties.sHeight = this.sHeight;
         this.data.Properties.font = this.font.size;
-        this.data.Properties.color = this.color;
+        this.data.Properties.color = this.color.value;
         return this.data;
     }
 } // Class SImageLegendItem

+ 3 - 3
src/lib/items/SImageLegendItem.ts

@@ -3,7 +3,7 @@ import { SGraphItem } from "@saga-web/graph/lib";
 import { SIconTextItem } from '@saga-web/big/lib/items/SIconTextItem';
 import { Legend } from '../types/Legend';
 import { ItemOrder } from '@saga-web/big/lib';
-import { SFont } from '@saga-web/draw/lib';
+import { SFont, SColor } from '@saga-web/draw/lib';
 /**
  * 图例节点Item(图标类型)
  *
@@ -66,7 +66,7 @@ export class SImageLegendItem extends SIconTextItem {
             this.font = new SFont("sans-serif", data.Properties.font);
         }
         if (data.Properties && data.Properties.color) {
-            this.color = data.Properties.color;
+            this.color = new SColor(data.Properties.color);
         }
     }
 
@@ -78,7 +78,7 @@ export class SImageLegendItem extends SIconTextItem {
         this.data.Properties.sWidth = this.sWidth;
         this.data.Properties.sHeight = this.sHeight;
         this.data.Properties.font = this.font.size;
-        this.data.Properties.color = this.color;
+        this.data.Properties.color = this.color.value;
 
         return this.data;
     }

+ 0 - 36
src/lib/items/SImageMarkerItem.js

@@ -1,36 +0,0 @@
-import { SImageItem } from "@saga-web/graph/lib";
-import { ItemOrder } from '@saga-web/big/lib';
-/**
- * 标识对象Item(图标类型)
- *
- * * @author  张宇(taohuzy@163.com)
- */
-export class SImageMarkerItem extends SImageItem {
-    /**
-     * 构造函数
-     *
-     * @param parent    指向父对象
-     * @param data      标识对象数据
-     */
-    constructor(parent, data) {
-        super(parent);
-        this.zOrder = ItemOrder.imageOrder;
-        this.data = data;
-        this.id = data.ID;
-        this.name = data.Name;
-        this.moveTo(data.Pos.X, data.Pos.Y);
-        if (data.Size) {
-            this.width = data.Size.Width;
-            this.height = data.Size.Height;
-        }
-        if (data.Properties && data.Properties.Url) {
-            this.url = data.Properties.Url;
-        }
-    } // Constructor
-    toData() {
-        this.data.Pos = { X: this.x, Y: this.y };
-        this.data.Size = { Width: this.width, Height: this.height };
-        this.data.Properties.Url = this.url;
-        return this.data;
-    }
-} // Class SImageMarkerItem

+ 0 - 47
src/lib/items/SLineLegendItem.js

@@ -1,47 +0,0 @@
-import { SPoint } from "@saga-web/draw/lib";
-import { SPolylineItem } from '@saga-web/big/lib';
-/**
- * 图例节点Item(线类型)
- *
- * * @author  张宇(taohuzy@163.com)
- */
-export class SLineLegendItem extends SPolylineItem {
-    /**
-     * 构造函数
-     *
-     * @param parent    指向父对象
-     * @param data      图例节点对象数据
-     */
-    constructor(parent, data) {
-        super(parent, []);
-        this.data = data;
-        this.id = data.ID;
-        this.name = data.Name;
-        this.moveTo(data.Pos.X, data.Pos.Y);
-        if (data.Properties && data.Properties.Line) {
-            let setPointList;
-            setPointList = data.Properties.Line.map(i => {
-                return new SPoint(i.x, i.y);
-            });
-            this.pointList = setPointList;
-        }
-        if (data.Properties && data.Properties.LineWidth) {
-            this.lineWidth = data.Properties.LineWidth;
-        }
-        if (data.Properties && data.Properties.StrokeColor) {
-            this.strokeColor = data.Properties.StrokeColor;
-        }
-    }
-    toData() {
-        this.data.Pos = { X: this.x, Y: this.y };
-        this.data.Properties.Line = this.pointList.map(pos => {
-            return {
-                X: pos.x,
-                Y: pos.y
-            };
-        });
-        this.data.Properties.LineWidth = this.lineWidth;
-        this.data.Properties.StrokeColor = this.strokeColor;
-        return this.data;
-    }
-} // Class SLineLegendItem

+ 2 - 2
src/lib/items/SLineMarkerItem.js

@@ -36,7 +36,7 @@ export class SLineMarkerItem extends SLineItem {
             this.lineStyle = data.Properties.LineStyle;
         }
         if (data.Properties && data.Properties.StrokeColor) {
-            this.strokeColor = data.Properties.StrokeColor;
+            this.strokeColor = new SColor(data.Properties.StrokeColor);
         }
     } // Constructor
     get maskFlag() {
@@ -58,7 +58,7 @@ export class SLineMarkerItem extends SLineItem {
             };
         });
         this.data.Properties.LineWidth = this.lineWidth;
-        this.data.Properties.StrokeColor = this.strokeColor;
+        this.data.Properties.StrokeColor = this.strokeColor.value;
         this.data.Properties.LineStyle = this.lineStyle;
         return this.data;
     }

+ 2 - 2
src/lib/items/SLineMarkerItem.ts

@@ -53,7 +53,7 @@ export class SLineMarkerItem extends SLineItem {
             this.lineStyle = data.Properties.LineStyle;
         }
         if (data.Properties && data.Properties.StrokeColor) {
-            this.strokeColor = data.Properties.StrokeColor;
+            this.strokeColor = new SColor(data.Properties.StrokeColor);
         }
     } // Constructor
 
@@ -66,7 +66,7 @@ export class SLineMarkerItem extends SLineItem {
             }
         });
         this.data.Properties.LineWidth = this.lineWidth;
-        this.data.Properties.StrokeColor = this.strokeColor;
+        this.data.Properties.StrokeColor = this.strokeColor.value;
         this.data.Properties.LineStyle = this.lineStyle;
         return this.data;
     }

+ 0 - 22
src/lib/items/SNoneLegendItem.js

@@ -1,22 +0,0 @@
-import { SGraphItem } from "@saga-web/graph/lib";
-/**
- * 图例节点Item(非图例类型)
- *
- * * @author  张宇(taohuzy@163.com)
- */
-export class SNoneLegendItem extends SGraphItem {
-    /**
-     * 构造函数
-     *
-     * @param parent    指向父对象
-     * @param data      图例节点对象数据
-     */
-    constructor(parent, data) {
-        super(parent);
-        this.data = data;
-        this.id = data.ID;
-    }
-    toData() {
-        return this.data;
-    }
-} // Class SNoneLegendItem

+ 2 - 3
src/lib/items/SSCPZZoneLegendItem.js

@@ -28,7 +28,6 @@ export class SSCPZZoneLegendItem extends SPolygonItem {
         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;
@@ -57,7 +56,7 @@ export class SSCPZZoneLegendItem extends SPolygonItem {
                 this.textItem.moveTo(data.Properties.TextPos.X, data.Properties.TextPos.Y);
             }
             if (data.Properties.color) {
-                this.color = data.Properties.color;
+                this.color = new SColor(data.Properties.color);
             }
             if (data.Properties.font) {
                 this.font = new SFont("sans-serif", data.Properties.font);
@@ -173,7 +172,7 @@ export class SSCPZZoneLegendItem extends SPolygonItem {
         });
         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;
+        this.data.Properties.color = this.color.value;
         return this.data;
     }
     onDraw(painter) {

+ 7 - 8
src/lib/items/SSCPZZoneLegendItem.ts

@@ -25,11 +25,11 @@ export class SSCPZZoneLegendItem extends SPolygonItem {
         this.textItem.text = v;
         this.update();
     }
-    get color(): string {
+    get color(): SColor {
         return this.textItem.color;
     }
-    set color(v: string) {
-        this.textItem.color = v
+    set color(v: SColor) {
+        this.textItem.color = v;
     }
     get font(): SFont {
         return this.textItem.font
@@ -119,7 +119,6 @@ export class SSCPZZoneLegendItem extends SPolygonItem {
         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[];
@@ -147,7 +146,7 @@ export class SSCPZZoneLegendItem extends SPolygonItem {
                 this.textItem.moveTo(data.Properties.TextPos.X, data.Properties.TextPos.Y);
             }
             if (data.Properties.color) {
-                this.color = data.Properties.color
+                this.color = new SColor(data.Properties.color);
             }
             if (data.Properties.font) {
                 this.font = new SFont("sans-serif", data.Properties.font);
@@ -181,9 +180,9 @@ export class SSCPZZoneLegendItem extends SPolygonItem {
                 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;
+        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.value;
         return this.data;
     }
 

+ 0 - 50
src/lib/items/STextMarkerItem.js

@@ -1,50 +0,0 @@
-import { STextItem } from "@saga-web/graph/lib";
-import { SColor, SFont } from "@saga-web/draw";
-import { ItemOrder } from '@saga-web/big/lib';
-/**
- * 标识对象Item(文本类型)
- *
- * * @author  张宇(taohuzy@163.com)
- */
-export class STextMarkerItem extends STextItem {
-    /**
-     * 构造函数
-     *
-     * @param parent    指向父对象
-     * @param data      标识对象数据
-     */
-    constructor(parent, data) {
-        super(parent);
-        this.zOrder = ItemOrder.textOrder;
-        this.data = data;
-        this.id = data.ID;
-        this.name = data.Name;
-        this.moveTo(data.Pos.X, data.Pos.Y);
-        if (data.Size) {
-            this.width = data.Size.Width;
-            this.height = data.Size.Height;
-        }
-        if (data.Properties && data.Properties.Text) {
-            this.text = data.Properties.Text;
-        }
-        if (data.Properties && data.Properties.Color) {
-            this.color = new SColor(data.Properties.Color);
-        }
-        if (data.Properties && data.Properties.Font) {
-            this.font = new SFont("sans-serif", data.Properties.Font);
-            ;
-        }
-        if (data.Properties && data.Properties.BackgroundColor) {
-            this.backgroundColor = new SColor(data.Properties.BackgroundColor);
-        }
-    } // Constructor
-    toData() {
-        this.data.Pos = { X: this.x, Y: this.y };
-        this.data.Size = { Width: this.width, Height: this.height };
-        this.data.Properties.Text = this.text;
-        this.data.Properties.Color = this.color.value;
-        this.data.Properties.Font = this.font.size;
-        this.data.Properties.BackgroundColor = this.backgroundColor.value;
-        return this.data;
-    }
-} // Class STextMarkerItem

+ 2 - 3
src/lib/items/SZoneLegendItem.js

@@ -27,7 +27,6 @@ export class SZoneLegendItem extends SPolygonItem {
         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;
@@ -57,7 +56,7 @@ export class SZoneLegendItem extends SPolygonItem {
                 this.textItem.moveTo(data.Properties.TextPos.X, data.Properties.TextPos.Y);
             }
             if (data.Properties.color) {
-                this.color = data.Properties.color;
+                this.color = new SColor(data.Properties.color);
             }
             if (data.Properties.font) {
                 this.font = new SFont("sans-serif", data.Properties.font);
@@ -166,7 +165,7 @@ export class SZoneLegendItem extends SPolygonItem {
         });
         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;
+        this.data.Properties.color = this.color.value;
         return this.data;
     }
     onDraw(painter) {

+ 9 - 10
src/lib/items/SZoneLegendItem.ts

@@ -24,17 +24,17 @@ export class SZoneLegendItem extends SPolygonItem {
         this.textItem.text = v;
         this.update();
     }
-    get color(): string {
+    get color(): SColor {
         return this.textItem.color;
     }
-    set color(v: string) {
-        this.textItem.color = v
+    set color(v: SColor) {
+        this.textItem.color = v;
     }
     get font(): SFont {
-        return this.textItem.font
+        return this.textItem.font;
     }
     set font(v: SFont) {
-        this.textItem.font = v
+        this.textItem.font = v;
     }
 
     get status(): SItemStatus {
@@ -110,7 +110,6 @@ export class SZoneLegendItem extends SPolygonItem {
         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[];
@@ -139,7 +138,7 @@ export class SZoneLegendItem extends SPolygonItem {
                 this.textItem.moveTo(data.Properties.TextPos.X, data.Properties.TextPos.Y);
             }
             if (data.Properties.color) {
-                this.color = data.Properties.color
+                this.color = new SColor(data.Properties.color);
             }
             if (data.Properties.font) {
                 this.font = new SFont("sans-serif", data.Properties.font);
@@ -173,9 +172,9 @@ export class SZoneLegendItem extends SPolygonItem {
                 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;
+        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.value;
         return this.data;
     }
 

+ 2 - 2
src/lib/items/TipelineItem.js

@@ -49,7 +49,7 @@ export class TipelineItem extends SPolylineItem {
             this._anchor2ID = data.Anchor2ID;
         }
         if (data.Properties && data.Properties.Color) {
-            this.strokeColor = data.Properties.Color;
+            this.strokeColor = new SColor(data.Properties.Color);
         }
         // if(data.Properties && data.Properties.LineDash){
         //   this.LineDash = data.Properties.LineDash
@@ -140,7 +140,7 @@ export class TipelineItem extends SPolylineItem {
             this.data.PointList = pointList;
             this.data.Properties.LineWidth = this.lineWidth;
             // this.data.Properties.LineDash = this.LineDash;
-            this.data.Properties.Color = this.strokeColor;
+            this.data.Properties.Color = this.strokeColor.value;
         }
         return this.data;
     }

+ 2 - 2
src/lib/items/TipelineItem.ts

@@ -128,7 +128,7 @@ export class TipelineItem extends SPolylineItem {
       this._anchor2ID = data.Anchor2ID
     }
     if (data.Properties && data.Properties.Color) {
-      this.strokeColor = data.Properties.Color
+      this.strokeColor = new SColor(data.Properties.Color);
     }
     // if(data.Properties && data.Properties.LineDash){
     //   this.LineDash = data.Properties.LineDash
@@ -151,7 +151,7 @@ export class TipelineItem extends SPolylineItem {
       this.data.PointList = pointList;
       this.data.Properties.LineWidth = this.lineWidth;
       // this.data.Properties.LineDash = this.LineDash;
-      this.data.Properties.Color = this.strokeColor
+      this.data.Properties.Color = this.strokeColor.value;
     }
 
     return this.data