فهرست منبع

graph:feat:graphview增加返回图中所有元素方法

haojianlong 4 سال پیش
والد
کامیت
247e930f7a
3فایلهای تغییر یافته به همراه55 افزوده شده و 11 حذف شده
  1. 1 0
      persagy-web-draw/src/SCanvasView.ts
  2. 1 1
      persagy-web-graph/package.json
  3. 53 10
      persagy-web-graph/src/SGraphView.ts

+ 1 - 0
persagy-web-draw/src/SCanvasView.ts

@@ -153,6 +153,7 @@ export class SCanvasView extends SObject {
      * 图像的 URL
      *
      * @param type    图像类型
+     * @return 图像的 URL
      */
     imageUrl(type: string): string {
         return this.canvasView.toDataURL(`image/${type}`);

+ 1 - 1
persagy-web-graph/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@persagy-web/graph",
-    "version": "2.2.23",
+    "version": "2.2.24",
     "description": "博锐尚格二维图形引擎。",
     "main": "lib/index.js",
     "types": "lib/index.d.js",

+ 53 - 10
persagy-web-graph/src/SGraphView.ts

@@ -250,20 +250,68 @@ export class SGraphView extends SCanvasView {
     } // Function mapToScene()
 
     /**
-     * 保存图像
+     * 保存指定大小图像,并且适配到中央而不影响原图
      *
      * @param name    名称
      * @param type    图像类型
      * @param width   要保存图形的宽
      * @param height  要保存图形的高
+     * @param bg      生成图的背景色
      */
     saveImageSize(
         name: string,
         type: string,
         width: number,
-        height: number
+        height: number,
+        bg: string = "#ffffff"
     ): void {
         const can = document.createElement("CANVAS") as HTMLCanvasElement;
+        let vi: any = this.generateView(can, width, height, bg);
+        vi.saveImage(name, type);
+        // @ts-ignore
+        this.scene.view = this;
+        can.remove();
+        vi = null;
+    } // Function saveImageSize()
+
+    /**
+     * 保存指定大小图像,并且适配到中央而不影响原图所使用的图像的 URL
+     *
+     * @param type    图像类型
+     * @param width   要保存图形的宽
+     * @param height  要保存图形的高
+     * @param bg      生成图的背景色
+     * @return 图像的 URL
+     */
+    imageSizeUrl(
+        type: string,
+        width: number,
+        height: number,
+        bg: string = "#FFFFFF"
+    ): string {
+        const can = document.createElement("CANVAS") as HTMLCanvasElement;
+        let vi: any = this.generateView(can, width, height, bg);
+        const str = vi.canvasView.toDataURL(`image/${type}`);
+        can.remove();
+        vi = null;
+        return str;
+    } // Function imageSizeUrl()
+
+    /**
+     * 生成新的view
+     *
+     * @param can       canvas dom
+     * @param width     要保存图形的宽
+     * @param height    要保存图形的高
+     * @param bg        生成图的背景色
+     * @return 图像的 URL
+     */
+    private generateView(
+        can: HTMLCanvasElement,
+        width: number,
+        height: number,
+        bg: string = "#FFFFFF"
+    ): SGraphView {
         can.width = width;
         can.height = height;
         can.id = uuidv1();
@@ -276,15 +324,10 @@ export class SGraphView extends SCanvasView {
         let vi = new SGraphView(can.id);
         vi.scene = this.scene;
         vi.fitSceneToView();
-        vi.backgroundColor = new SColor("#FFFFFF");
+        vi.backgroundColor = new SColor(bg);
         vi.onDraw(painter);
-        vi.saveImage(name, type);
-        // @ts-ignore
-        this.scene.view = this;
-        can.remove();
-        // @ts-ignore
-        vi = null;
-    } // Function saveImageSize()
+        return vi;
+    } // Function generateView()
 
     /**
      * 绘制视图