Browse Source

add draw images

haojianlong 5 years ago
parent
commit
27327aa563

+ 14 - 1
src/assets/graphy/SGraphy/dataType.ts

@@ -47,6 +47,7 @@ interface dataInterface {
     SpaceList: dataSpaceItem[], //空间
     VirtualWallList: dataItem[], //虚拟墙
     WallList: dataItem[],    //墙
+    images: ImgItemInterface[],  //图片
 }
 //获取绑定空间的接口
 interface businessDataInterface {
@@ -62,4 +63,16 @@ interface PolygonItemInterface {
     space: dataSpaceItem,       //传入的item 参数
     businessType?: string
 }
-export { dataItemPath, dataItem, dataSpaceItem, dataInterface, businessDataInterface, PolygonItemInterface }
+// 图片传入的参数接口
+interface ImgItemInterface {
+    parent: SGraphyPolygonItem | null //父类
+    X: number;
+    Y: number;
+    width: number;
+    height: number;
+    img: string;
+    id?: string;
+    name: string;
+}
+
+export { dataItemPath, dataItem, dataSpaceItem, dataInterface, businessDataInterface, PolygonItemInterface, ImgItemInterface }

+ 12 - 0
src/assets/graphy/SGraphy/mainScene.js

@@ -12,6 +12,7 @@ var __extends = (this && this.__extends) || (function () {
     };
 })();
 import SGraphyPolygonItem from './newItems/SGraphyPolygonItem.js';
+import SGraphyImgItem from './newItems/SGraphyImgItem.js';
 import { SGraphyScene } from "@sybotan-web/graphy";
 import Axios from 'axios';
 import pako from "./until/pako.js";
@@ -147,6 +148,8 @@ var mainScene = /** @class */ (function (_super) {
         // let wall:
         this.addSpaceList(space); //绘制空间
         this.addWallList(); //绘制墙
+        var images = data.images;
+        this.addImageList(images);
     };
     /**
      * 添加所有空间到scene 中
@@ -186,6 +189,15 @@ var mainScene = /** @class */ (function (_super) {
     // 绘制虚拟墙
     mainScene.prototype.addVrtualWallList = function () {
     };
+    // 绘制图片
+    mainScene.prototype.addImageList = function (imageList) {
+        var _this_1 = this;
+        if (imageList && imageList.length) {
+            imageList.map(function (t) {
+                _this_1.addItem(new SGraphyImgItem(null, t.X, t.Y, t.width, t.height));
+            });
+        }
+    };
     /**
      * 产生item实例
      */

+ 25 - 14
src/assets/graphy/SGraphy/mainScene.ts

@@ -1,9 +1,10 @@
 
 import { SRect, SSize, SPoint } from "@sybotan-web/base";
-import  SGraphyPolygonItem from './newItems/SGraphyPolygonItem.js'
+import SGraphyPolygonItem from './newItems/SGraphyPolygonItem.js'
+import SGraphyImgItem from './newItems/SGraphyImgItem.js'
 import { SGraphyScene, SMouseEvent } from "@sybotan-web/graphy";
 import { SPen, SPainter, SColor } from "@sybotan-web/draw";
-import { dataItemPath, dataItem, dataSpaceItem, dataInterface, PolygonItemInterface } from './dataType'   //传入参数的参数接口类型
+import { dataItemPath, dataItem, dataSpaceItem, dataInterface, PolygonItemInterface, ImgItemInterface } from './dataType'   //传入参数的参数接口类型
 import Axios from 'axios';
 import pako from "./until/pako.js"
 import tools from "./until/tool.js"
@@ -77,26 +78,26 @@ export default class mainScene extends SGraphyScene {
                 // contentType: "charset=utf-8"
             }).then(res => {
                 var blob = res.data;
-                this.zipToJson(blob).then((jsonData:any)=>{
+                this.zipToJson(blob).then((jsonData: any) => {
                     that.addAllItemList(jsonData)
                     relove()
-                }).catch((error:any)=>{
+                }).catch((error: any) => {
                     console.log(error)
                 });
                 // console.log(reader)
-            }).catch(res=>{
+            }).catch(res => {
                 console.log(res)
             })
         })
 
     }
     // 压缩包变为json格式数据
-    zipToJson(blob:any):any{
-           let data = null;
-           var reader = new FileReader();
-           reader.readAsBinaryString(blob);
-           let _this = this;
-           return new Promise((resolve)=>{
+    zipToJson(blob: any): any {
+        let data = null;
+        var reader = new FileReader();
+        reader.readAsBinaryString(blob);
+        let _this = this;
+        return new Promise((resolve) => {
             reader.onload = function (readerEvt: any) {
                 var binaryString = readerEvt.target.result;
                 //解压数据
@@ -120,7 +121,7 @@ export default class mainScene extends SGraphyScene {
                 }
                 resolve(data)
             };
-           })
+        })
     }
     // 以下是绘制方法
 
@@ -132,6 +133,8 @@ export default class mainScene extends SGraphyScene {
         // let wall:
         this.addSpaceList(space) //绘制空间
         this.addWallList()       //绘制墙
+        let images: ImgItemInterface[] = data.images
+        this.addImageList(images)
     }
 
     /**
@@ -146,7 +149,7 @@ export default class mainScene extends SGraphyScene {
                         {
                             parent: null,
                             space: space[i],
-                            businessType:'space'
+                            businessType: 'space'
                         }));
                 }
             }
@@ -156,7 +159,7 @@ export default class mainScene extends SGraphyScene {
                         {
                             parent: null,
                             space: space[i],
-                            businessType:'space'
+                            businessType: 'space'
                         }));
                 }
             }
@@ -175,6 +178,14 @@ export default class mainScene extends SGraphyScene {
     // 绘制虚拟墙
     addVrtualWallList(): void {
     }
+    // 绘制图片
+    addImageList(imageList: ImgItemInterface[]): void {
+        if (imageList && imageList.length) {
+            imageList.map(t => {
+                this.addItem(new SGraphyImgItem(null, t.X, t.Y, t.width, t.height))
+            })
+        }
+    }
     /**
      * 产生item实例
      */