Ver código fonte

展示图形item 基类添加;渐变读取与存盘方法添加

haojianlong 4 anos atrás
pai
commit
af5404b598

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

@@ -1,6 +1,6 @@
 {
     "name": "@persagy-web/draw",
-    "version": "2.2.1",
+    "version": "2.2.3",
     "description": "博锐尚格绘制引擎。",
     "main": "lib/index.js",
     "types": "lib/index.d.js",

+ 25 - 0
persagy-web-draw/src/SColor.ts

@@ -247,4 +247,29 @@ export class SColor {
     //         this._value = (this._value << 8) + 0xff;
     //     }
     // }
+
+    /**
+     * 颜色转rgb
+     *
+     * */
+    toRgb(): string {
+        return `rgb(${this.red}, ${this.green}, ${this.blue})`;
+    } // Function toRgb()
+
+    /**
+     * 颜色转rgba
+     *
+     * */
+    toRgba(): string {
+        return `rgba(${this.red}, ${this.green}, ${this.blue}, ${this.alpha /
+            255.0})`;
+    } // Function toRgb()
+
+    /**
+     * 颜色转6位16进制
+     *
+     * */
+    toVal(): string {
+        return "#" + SStringUtil.num2Hex(this._value, 6);
+    } // Function toRgb()
 } // Class SColor

+ 6 - 0
persagy-web-draw/src/SGradient.ts

@@ -106,4 +106,10 @@ export abstract class SGradient {
         this.end.x = x;
         this.end.y = y;
     } // Function setEnd()
+
+    /**
+     * 转为字符串保存
+     *
+     * */
+    abstract value(): string;
 } // Class SGradientStop

+ 14 - 0
persagy-web-draw/src/SLinearGradient.ts

@@ -73,4 +73,18 @@ export class SLinearGradient extends SGradient {
             this.end = new SPoint(x2 as number, y2 as number);
         }
     } // Constructor()
+
+    /**
+     * 转为字符串保存
+     *
+     * */
+    value(): string {
+        let str = `SLinearGradient{`;
+        str += `${this.x1},${this.y1};`;
+        str += `${this.x2},${this.y2};`;
+        this.stopList.forEach(t => {
+            str += `${t.pos},${t.color.value};`;
+        });
+        return `${str}}`;
+    } // Function value()
 } // Class SGradientBrush

+ 2 - 182
persagy-web-draw/src/SPainter.ts

@@ -32,7 +32,7 @@ import {
     SCanvasView,
     SFont,
     SLine,
-    SPath2D,
+    SPath,
     SPen,
     SPoint,
     SRect,
@@ -387,186 +387,6 @@ export class SPainter extends SObject {
     } // Function drawEllipse()
 
     /**
-     * 绘制椭圆弧
-     *
-     * @param   rect            椭圆所在矩形
-     * @param   startAngle      开始角度(单位弧度)
-     * @param   endAngle        结束角度(单位弧度)
-     */
-    drawArc(rect: SRect, startAngle: number, endAngle: number): void;
-
-    /**
-     * 绘制椭圆弧
-     *
-     * @param   x               椭圆所在矩形X坐标
-     * @param   y               椭圆所在矩形Y坐标
-     * @param   width           椭圆所在矩形宽度
-     * @param   height          椭圆所在矩形高度
-     * @param   startAngle      开始角度(单位弧度)
-     * @param   endAngle        结束角度(单位弧度)
-     */
-    drawArc(
-        x: number,
-        y: number,
-        width: number,
-        height: number,
-        startAngle: number,
-        endAngle: number
-    ): void;
-
-    /**
-     * 绘制椭圆弧(重载实现)
-     *
-     * @param   x               椭圆所在矩形X坐标
-     * @param   y               椭圆所在矩形Y坐标
-     * @param   width           椭圆所在矩形宽度
-     * @param   height          椭圆所在矩形高度
-     * @param   startAngle      开始角度(单位弧度)
-     * @param   endAngle        结束角度(单位弧度)
-     */
-    drawArc(
-        x: SRect | number,
-        y: number,
-        width: number,
-        height?: number,
-        startAngle?: number,
-        endAngle?: number
-    ): void {
-        if (x instanceof SRect) {
-            this.engine.drawArc(x.x, x.y, x.width, x.height, y, width);
-        } else {
-            this.engine.drawArc(
-                x,
-                y,
-                width,
-                height as number,
-                startAngle as number,
-                endAngle as number
-            );
-        }
-    } // Function drawArc()
-
-    /**
-     * 绘制椭圆弦弧
-     *
-     * @param   rect            椭圆所在矩形
-     * @param   startAngle      开始角度(单位弧度)
-     * @param   endAngle        结束角度(单位弧度)
-     */
-    drawChord(rect: SRect, startAngle: number, endAngle: number): void;
-
-    /**
-     * 绘制椭圆弦弧
-     *
-     * @param   x               椭圆所在矩形X坐标
-     * @param   y               椭圆所在矩形Y坐标
-     * @param   width           椭圆所在矩形宽度
-     * @param   height          椭圆所在矩形高度
-     * @param   startAngle      开始角度(单位弧度)
-     * @param   endAngle        结束角度(单位弧度)
-     */
-    drawChord(
-        x: number,
-        y: number,
-        width: number,
-        height: number,
-        startAngle: number,
-        endAngle: number
-    ): void;
-
-    /**
-     * 绘制椭圆弦弧(重载实现)
-     *
-     * @param   x               椭圆所在矩形X坐标
-     * @param   y               椭圆所在矩形Y坐标
-     * @param   width           椭圆所在矩形宽度
-     * @param   height          椭圆所在矩形高度
-     * @param   startAngle      开始角度(单位弧度)
-     * @param   endAngle        结束角度(单位弧度)
-     */
-    drawChord(
-        x: SRect | number,
-        y: number,
-        width: number,
-        height?: number,
-        startAngle?: number,
-        endAngle?: number
-    ): void {
-        if (x instanceof SRect) {
-            this.engine.drawChord(x.x, x.y, x.width, x.height, y, width);
-        } else {
-            this.engine.drawChord(
-                x,
-                y,
-                width,
-                height as number,
-                startAngle as number,
-                endAngle as number
-            );
-        }
-    } // Function drawChord()
-
-    /**
-     * 绘制椭圆饼
-     *
-     * @param   rect            椭圆所在矩形
-     * @param   startAngle      开始角度(单位弧度)
-     * @param   endAngle        结束角度(单位弧度)
-     */
-    drawPie(rect: SRect, startAngle: number, endAngle: number): void;
-
-    /**
-     * 绘制椭圆饼
-     *
-     * @param   x               椭圆所在矩形X坐标
-     * @param   y               椭圆所在矩形Y坐标
-     * @param   width           椭圆所在矩形宽度
-     * @param   height          椭圆所在矩形高度
-     * @param   startAngle      开始角度(单位弧度)
-     * @param   endAngle        结束角度(单位弧度)
-     */
-    drawPie(
-        x: number,
-        y: number,
-        width: number,
-        height: number,
-        startAngle: number,
-        endAngle: number
-    ): void;
-
-    /**
-     * 绘制椭圆饼
-     *
-     * @param   x               椭圆所在矩形X坐标
-     * @param   y               椭圆所在矩形Y坐标
-     * @param   width           椭圆所在矩形宽度
-     * @param   height          椭圆所在矩形高度
-     * @param   startAngle      开始角度(单位弧度)
-     * @param   endAngle        结束角度(单位弧度)
-     */
-    drawPie(
-        x: SRect | number,
-        y: number,
-        width: number,
-        height?: number,
-        startAngle?: number,
-        endAngle?: number
-    ): void {
-        if (x instanceof SRect) {
-            this.engine.drawPie(x.x, x.y, x.width, x.height, y, width);
-        } else {
-            this.engine.drawPie(
-                x,
-                y,
-                width,
-                height as number,
-                startAngle as number,
-                endAngle as number
-            );
-        }
-    } // Function drawPie()
-
-    /**
      * 绘制一条线段
      *
      * @param   line    线段
@@ -644,7 +464,7 @@ export class SPainter extends SObject {
      *
      * @param   path        路径
      */
-    drawPath(path: SPath2D): void {
+    drawPath(path: SPath): void {
         this.engine.drawPath(path);
     } // Function drawPath()
 

+ 30 - 12
persagy-web-draw/src/SPath.ts

@@ -25,6 +25,7 @@
  */
 
 import { SPathCommand } from "./SPathCommand";
+import { SPoint } from "./types/SPoint";
 
 /**
  * Path对象
@@ -32,6 +33,7 @@ import { SPathCommand } from "./SPathCommand";
  * @author  庞利祥 <sybotan@126.com>
  */
 export class SPath {
+    /** 命令集合 */
     cmdList: SPathCommand[] = [];
 
     /**
@@ -42,7 +44,7 @@ export class SPath {
      */
     private addCommand(cmd: string, ...args: number[]): void {
         this.cmdList.push({ command: cmd, args: args });
-    }
+    } // Function addCommand()
 
     /**
      * 添加一条新路径到对当前路径。
@@ -50,15 +52,16 @@ export class SPath {
      * @param path
      */
     addPath(path: SPath): void {
+        // todo
         this.cmdList.concat(path.cmdList);
-    }
+    } // Function addPath()
 
     /**
      * 使笔点返回到当前子路径的起始点。它尝试从当前点到起始点绘制一条直线。 如果图形已经是封闭的或者只有一个点,那么此函数不会做任何操作。
      */
     closePath(): void {
         this.addCommand("Z");
-    }
+    } // Function closePath()
 
     /**
      * 移动当前点到指定位置
@@ -68,7 +71,7 @@ export class SPath {
      */
     moveTo(x: number, y: number): void {
         this.addCommand("M", x, y);
-    }
+    } // Function moveTo()
 
     /**
      * 从当前点向指定点画线
@@ -78,7 +81,7 @@ export class SPath {
      */
     lineTo(x: number, y: number): void {
         this.addCommand("L", x, y);
-    }
+    } // Function lineTo()
 
     /**
      * 添加一条圆弧路径。
@@ -107,7 +110,7 @@ export class SPath {
             endAngle,
             anticlockwise
         );
-    }
+    } // Function arc()
 
     /**
      * 根据控制点和半径添加一条圆弧路径,使用直线连接前一个点。
@@ -126,7 +129,7 @@ export class SPath {
         radius: number
     ): void {
         this.addCommand("ArcTo", x1, y1, x2, y2, radius);
-    }
+    } // Function arcTo()
 
     /**
      * 添加二次贝塞尔曲线
@@ -138,7 +141,7 @@ export class SPath {
      */
     quadraticCurveTo(cp1x: number, cp1y: number, x: number, y: number): void {
         this.addCommand("Q", cp1x, cp1y, x, y);
-    }
+    } // Function quadraticCurveTo()
 
     /**
      * 添加三次贝塞尔曲线
@@ -159,7 +162,7 @@ export class SPath {
         y: number
     ): void {
         this.addCommand("C", cp1x, cp1y, cp2x, cp2y, x, y);
-    }
+    } // Function bezierCurveTo()
 
     /**
      * 添加椭圆
@@ -171,7 +174,7 @@ export class SPath {
      */
     ellipse(cx: number, cy: number, rx: number, ry: number): void {
         this.addCommand("Ellipse", cx, cy, rx, ry);
-    }
+    } // Function ellipse()
 
     /**
      * 添加矩形
@@ -187,5 +190,20 @@ export class SPath {
         this.addCommand("L", x + w, y + h);
         this.addCommand("L", x, y + h);
         this.addCommand("Z");
-    }
-}
+    } // Function rect()
+
+    /**
+     * 添加多边形
+     *
+     * @param   pList   点集数组
+     */
+    polygon(pList: SPoint[]): void {
+        if (pList.length > 3) {
+            this.addCommand("M", pList[0].x, pList[0].y);
+            for (let i = 1; i < pList.length; i++) {
+                this.addCommand("L", pList[i].x, pList[i].y);
+            }
+            this.addCommand("Z");
+        }
+    } // Function polygon()
+} // Class SPath

+ 14 - 0
persagy-web-draw/src/SRadialGradient.ts

@@ -97,4 +97,18 @@ export class SRadialGradient extends SGradient {
             this.r2 = r2 as number;
         }
     } // Constructor()
+
+    /**
+     * 转为字符串保存
+     *
+     * */
+    value(): string {
+        let str = `SRadialGradient{`;
+        str += `${this.x1},${this.y1},${this.r1};`;
+        str += `${this.x2},${this.y2},${this.r2};`;
+        this.stopList.forEach(t => {
+            str += `${t.pos},${t.color.value};`;
+        });
+        return `${str}}`;
+    } // Function value()
 } // Class SRadialGradient

+ 3 - 3
persagy-web-draw/src/engines/SCanvasPaintEngine.ts

@@ -243,10 +243,10 @@ export class SCanvasPaintEngine extends SPaintEngine {
      */
     drawPath(path: SPath): void {
         path.cmdList.forEach(cmd => {
-            if (cmd.command == "M") {
-                this._canvas.moveTo(cmd.args[0], cmd.args[1]);
-            } else if (cmd.command == "L") {
+            if (cmd.command == "L") {
                 this._canvas.lineTo(cmd.args[0], cmd.args[1]);
+            } else if (cmd.command == "M") {
+                this._canvas.moveTo(cmd.args[0], cmd.args[1]);
             } else if (cmd.command == "Z") {
                 this._canvas.closePath();
             } else if (cmd.command == "Q") {

+ 2 - 2
persagy-web-draw/src/engines/SPaintEngine.ts

@@ -24,7 +24,7 @@
  * *********************************************************************************************************************
  */
 
-import { SFont, SLine, SPaintEngineType, SPath2D, SPoint, SRect } from "..";
+import { SFont, SLine, SPaintEngineType, SPath, SPoint, SRect } from "..";
 import { SPaintState } from "./SPaintState";
 import { SMatrix } from "@persagy-web/base";
 
@@ -210,7 +210,7 @@ export abstract class SPaintEngine {
      *
      * @param   path        路径
      */
-    abstract drawPath(path: SPath2D): void;
+    abstract drawPath(path: SPath): void;
 
     /**
      * 绘制文本

+ 2 - 2
persagy-web-draw/src/index.ts

@@ -66,7 +66,7 @@ import { SGradient } from "./SGradient";
 import { SGradientStop } from "./SGradientStop";
 import { SLinearGradient } from "./SLinearGradient";
 import { SPainter } from "./SPainter";
-import { SPath2D } from "./SPath2D";
+import { SPath } from "./SPath";
 import { SPen } from "./SPen";
 import { SRadialGradient } from "./SRadialGradient";
 import { SArrowStyleType } from "./enums/SArrowStyleType";
@@ -80,7 +80,7 @@ export {
     SGradientStop,
     SLinearGradient,
     SPainter,
-    SPath2D,
+    SPath,
     SPen,
     SRadialGradient,
     SArrowStyleType,

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

@@ -1,6 +1,6 @@
 {
     "name": "@persagy-web/graph",
-    "version": "2.2.1",
+    "version": "2.2.4",
     "description": "博锐尚格二维图形引擎。",
     "main": "lib/index.js",
     "types": "lib/index.d.js",
@@ -40,7 +40,7 @@
         "typescript": "^3.5.3"
     },
     "dependencies": {
-        "@persagy-web/draw": "2.2.1",
+        "@persagy-web/draw": "2.2.3",
         "@types/uuid": "^8.0.0"
     }
 }

+ 13 - 7
persagy-web-graph/src/SGraphItem.ts

@@ -24,12 +24,7 @@
  * *********************************************************************************************************************
  */
 
-import {
-    SMouseButton,
-    SMouseEvent,
-    SObject,
-    SMatrix
-} from "@persagy-web/base";
+import { SMouseButton, SMouseEvent, SObject, SMatrix } from "@persagy-web/base";
 import { SPainter, SPoint, SRect } from "@persagy-web/draw";
 import { SGraphScene } from "./SGraphScene";
 
@@ -157,7 +152,18 @@ export class SGraphItem extends SObject {
     private _isMoving = false;
 
     /** 是否可用 */
-    enabled: boolean = true;
+    protected _enabled: boolean = true;
+    get enabled(): boolean {
+        return this._enabled;
+    } // Get enabled
+    set enabled(value: boolean) {
+        // 如果选择状态未变更
+        if (this.enabled == value) {
+            return;
+        }
+        this._enabled = value;
+        this.update();
+    } // Set enabled
 
     /** 是否可被选中 */
     selectable = false;

+ 7 - 1
persagy-web-graph/src/index.ts

@@ -45,6 +45,9 @@ import { SImageShowType } from "./enums/SImageShowType";
 import { SLineStyle } from "./enums/SLineStyle";
 import { SOrderSetType } from "./enums/SOrderSetType";
 import { STextOrigin } from "./enums/STextOrigin";
+import { SGraphStyle } from "./types/SGraphStyle";
+import { Style } from "./types/Style";
+import { SGraphShape } from "./items/SGraphShape";
 
 export {
     SGraphItem,
@@ -65,5 +68,8 @@ export {
     SImageShowType,
     SLineStyle,
     SOrderSetType,
-    STextOrigin
+    STextOrigin,
+    SGraphStyle,
+    Style,
+    SGraphShape
 };

+ 137 - 0
persagy-web-graph/src/items/SGraphShape.ts

@@ -0,0 +1,137 @@
+/*
+ * *********************************************************************************************************************
+ *
+ *          !!
+ *        .F88X
+ *        X8888Y
+ *      .}888888N;
+ *        i888888N;        .:!              .I$WI:
+ *          R888888I      .'N88~            i8}+8Y&8"l8i$8>8W~'>W8}8]KW+8IIN"8&
+ *          .R888888I    .;N8888~          .X8'  "8I.!,/8"  !%NY8`"8I8~~8>,88I
+ *            +888888N;  .8888888Y                                  "&&8Y.}8,
+ *            ./888888N;  .R888888Y        .'}~    .>}'.`+>  i}!    "i'  +/'  .'i~  !11,.:">,  .~]!  .i}i
+ *              ~888888%:  .I888888l      .]88~`1/iY88Ii+1'.R$8$8]"888888888>  Y8$  W8E  X8E  W8888'188Il}Y88$*
+ *              18888888    E8888881    .]W%8$`R8X'&8%++N8i,8N%N8+l8%`  .}8N:.R$RE%N88N%N$K$R  188,FE$8%~Y88I
+ *            .E888888I  .i8888888'      .:$8I;88+`E8R:/8N,.>881.`$8E/1/]N8X.Y8N`"KF&&FK!'88*."88K./$88%RN888+~
+ *            8888888I  .,N888888~        ~88i"8W,!N8*.I88.}888%F,i$88"F88"  888:E8X.>88!i88>`888*.}Fl1]*}1YKi'
+ *          i888888N'      I888Y          ]88;/EX*IFKFK88X  K8R  .l8W  88Y  ~88}'88E&%8W.X8N``]88!.$8K  .:W8I
+ *        .i888888N;        I8Y          .&8$  .X88!  i881.:%888>I88  ;88]  +88+.';;;;:.Y88X  18N.,88l  .+88/
+ *      .:R888888I
+ *      .&888888I                                          Copyright (c) 2009-2020.  博锐尚格科技股份有限公司
+ *        ~8888'
+ *        .!88~                                                                     All rights reserved.
+ *
+ * *********************************************************************************************************************
+ */
+
+import { SGraphItem } from "../SGraphItem";
+import { SPainter } from "@persagy-web/draw";
+import { Style } from "..";
+import {
+    SColor,
+    SGradient,
+    SLinearGradient,
+    SRadialGradient
+} from "@persagy-web/draw/lib";
+
+export class SGraphShape extends SGraphItem {
+    /** 当前item的风格 */
+    style: Style | null = null;
+
+    /**
+     * 构造函数
+     *
+     * @param   parent  父类
+     * @param   style   item各种状态的样式
+     * */
+    constructor(parent: SGraphItem, style?: Style) {
+        super(parent);
+        this.style = style || null;
+    } // Constructor
+
+    /**
+     * 绘制前设置绘制样式
+     *
+     * */
+    setStyle(): string {
+        let status = "Default";
+        if (this.style) {
+            if (this.enabled) {
+                if (this.selected) {
+                    status = "Selected";
+                }
+            } else {
+                status = "Disabled";
+            }
+        }
+        return status;
+    } // Function setStyle()
+
+    /**
+     * 解析渐变样式
+     *
+     * @param   str 渐变存储的字符串
+     * @return  SGradient
+     * */
+    parseFill(str: string): SGradient | undefined {
+        const index1 = str.indexOf("{");
+        const index2 = str.indexOf("}");
+        const temp = str.substring(index1 + 1, index2 - 1);
+        const dataArr = temp.split(";");
+        if (str.indexOf("SLinearGradient") > -1) {
+            try {
+                // @ts-ignore
+                const grad = new SLinearGradient(
+                    ...dataArr[0].split(","),
+                    // @ts-ignore
+                    ...dataArr[1].split(",")
+                );
+                for (let i = 2; i < dataArr.length; i++) {
+                    const cur = dataArr[i].split(",");
+                    grad.addColorStop(Number(cur[0]), new SColor(cur[1]));
+                }
+                return grad;
+            } catch (e) {
+                console.log("渐变颜色格式有误", e, str);
+            }
+        } else if (str.indexOf("SRadialGradient") > -1) {
+            try {
+                // @ts-ignore
+                const grad = new SRadialGradient(
+                    ...dataArr[0].split(","),
+                    // @ts-ignore
+                    ...dataArr[1].split(",")
+                );
+                for (let i = 2; i < dataArr.length; i++) {
+                    const cur = dataArr[i].split(",");
+                    grad.addColorStop(Number(cur[0]), new SColor(cur[1]));
+                }
+                return grad;
+            } catch (e) {
+                console.log("渐变颜色格式有误", e, str);
+            }
+        }
+        return undefined;
+    } // parseFill()
+
+    /**
+     * 绘制
+     *
+     * @param   painter painter对象
+     * */
+    onDraw(painter: SPainter): void {
+        const status = this.setStyle();
+        if (this.style && this.style[status]) {
+            const grad = this.parseFill(this.style[status].Fill);
+            if (grad) {
+                painter.brush.gradient = grad;
+            } else {
+                painter.brush.color = new SColor(this.style[status].Fill);
+            }
+            painter.pen.color = new SColor(this.style[status].Stroke);
+            painter.pen.lineWidth = this.style[status].LineWidth;
+        } else {
+            painter.brush.color = SColor.White;
+        }
+    } // Function onDraw()
+} // Class SGraphShape()

+ 41 - 0
persagy-web-graph/src/types/SGraphStyle.ts

@@ -0,0 +1,41 @@
+/*
+ * *********************************************************************************************************************
+ *
+ *          !!
+ *        .F88X
+ *        X8888Y
+ *      .}888888N;
+ *        i888888N;        .:!              .I$WI:
+ *          R888888I      .'N88~            i8}+8Y&8"l8i$8>8W~'>W8}8]KW+8IIN"8&
+ *          .R888888I    .;N8888~          .X8'  "8I.!,/8"  !%NY8`"8I8~~8>,88I
+ *            +888888N;  .8888888Y                                  "&&8Y.}8,
+ *            ./888888N;  .R888888Y        .'}~    .>}'.`+>  i}!    "i'  +/'  .'i~  !11,.:">,  .~]!  .i}i
+ *              ~888888%:  .I888888l      .]88~`1/iY88Ii+1'.R$8$8]"888888888>  Y8$  W8E  X8E  W8888'188Il}Y88$*
+ *              18888888    E8888881    .]W%8$`R8X'&8%++N8i,8N%N8+l8%`  .}8N:.R$RE%N88N%N$K$R  188,FE$8%~Y88I
+ *            .E888888I  .i8888888'      .:$8I;88+`E8R:/8N,.>881.`$8E/1/]N8X.Y8N`"KF&&FK!'88*."88K./$88%RN888+~
+ *            8888888I  .,N888888~        ~88i"8W,!N8*.I88.}888%F,i$88"F88"  888:E8X.>88!i88>`888*.}Fl1]*}1YKi'
+ *          i888888N'      I888Y          ]88;/EX*IFKFK88X  K8R  .l8W  88Y  ~88}'88E&%8W.X8N``]88!.$8K  .:W8I
+ *        .i888888N;        I8Y          .&8$  .X88!  i881.:%888>I88  ;88]  +88+.';;;;:.Y88X  18N.,88l  .+88/
+ *      .:R888888I
+ *      .&888888I                                          Copyright (c) 2009-2020.  博锐尚格科技股份有限公司
+ *        ~8888'
+ *        .!88~                                                                     All rights reserved.
+ *
+ * *********************************************************************************************************************
+ */
+
+/**
+ * 风格接口
+ *
+ * @author  郝建龙
+ */
+export interface SGraphStyle {
+    /** 边框颜色 */
+    Stroke: string;
+    /** 填充颜色 */
+    Fill: string;
+    /** 线条宽度 */
+    LineWidth: number;
+    /** 特效 */
+    Effect: any;
+} // Interface SGraphStyle

+ 29 - 0
persagy-web-graph/src/types/SRectShowType.ts

@@ -0,0 +1,29 @@
+/*
+ * *********************************************************************************************************************
+ *
+ *          !!
+ *        .F88X
+ *        X8888Y
+ *      .}888888N;
+ *        i888888N;        .:!              .I$WI:
+ *          R888888I      .'N88~            i8}+8Y&8"l8i$8>8W~'>W8}8]KW+8IIN"8&
+ *          .R888888I    .;N8888~          .X8'  "8I.!,/8"  !%NY8`"8I8~~8>,88I
+ *            +888888N;  .8888888Y                                  "&&8Y.}8,
+ *            ./888888N;  .R888888Y        .'}~    .>}'.`+>  i}!    "i'  +/'  .'i~  !11,.:">,  .~]!  .i}i
+ *              ~888888%:  .I888888l      .]88~`1/iY88Ii+1'.R$8$8]"888888888>  Y8$  W8E  X8E  W8888'188Il}Y88$*
+ *              18888888    E8888881    .]W%8$`R8X'&8%++N8i,8N%N8+l8%`  .}8N:.R$RE%N88N%N$K$R  188,FE$8%~Y88I
+ *            .E888888I  .i8888888'      .:$8I;88+`E8R:/8N,.>881.`$8E/1/]N8X.Y8N`"KF&&FK!'88*."88K./$88%RN888+~
+ *            8888888I  .,N888888~        ~88i"8W,!N8*.I88.}888%F,i$88"F88"  888:E8X.>88!i88>`888*.}Fl1]*}1YKi'
+ *          i888888N'      I888Y          ]88;/EX*IFKFK88X  K8R  .l8W  88Y  ~88}'88E&%8W.X8N``]88!.$8K  .:W8I
+ *        .i888888N;        I8Y          .&8$  .X88!  i881.:%888>I88  ;88]  +88+.';;;;:.Y88X  18N.,88l  .+88/
+ *      .:R888888I
+ *      .&888888I                                          Copyright (c) 2009-2020.  博锐尚格科技股份有限公司
+ *        ~8888'
+ *        .!88~                                                                     All rights reserved.
+ *
+ * *********************************************************************************************************************
+ */
+
+export interface SRectShowType {
+
+} // I

+ 36 - 0
persagy-web-graph/src/types/Style.ts

@@ -0,0 +1,36 @@
+/*
+ * *********************************************************************************************************************
+ *
+ *          !!
+ *        .F88X
+ *        X8888Y
+ *      .}888888N;
+ *        i888888N;        .:!              .I$WI:
+ *          R888888I      .'N88~            i8}+8Y&8"l8i$8>8W~'>W8}8]KW+8IIN"8&
+ *          .R888888I    .;N8888~          .X8'  "8I.!,/8"  !%NY8`"8I8~~8>,88I
+ *            +888888N;  .8888888Y                                  "&&8Y.}8,
+ *            ./888888N;  .R888888Y        .'}~    .>}'.`+>  i}!    "i'  +/'  .'i~  !11,.:">,  .~]!  .i}i
+ *              ~888888%:  .I888888l      .]88~`1/iY88Ii+1'.R$8$8]"888888888>  Y8$  W8E  X8E  W8888'188Il}Y88$*
+ *              18888888    E8888881    .]W%8$`R8X'&8%++N8i,8N%N8+l8%`  .}8N:.R$RE%N88N%N$K$R  188,FE$8%~Y88I
+ *            .E888888I  .i8888888'      .:$8I;88+`E8R:/8N,.>881.`$8E/1/]N8X.Y8N`"KF&&FK!'88*."88K./$88%RN888+~
+ *            8888888I  .,N888888~        ~88i"8W,!N8*.I88.}888%F,i$88"F88"  888:E8X.>88!i88>`888*.}Fl1]*}1YKi'
+ *          i888888N'      I888Y          ]88;/EX*IFKFK88X  K8R  .l8W  88Y  ~88}'88E&%8W.X8N``]88!.$8K  .:W8I
+ *        .i888888N;        I8Y          .&8$  .X88!  i881.:%888>I88  ;88]  +88+.';;;;:.Y88X  18N.,88l  .+88/
+ *      .:R888888I
+ *      .&888888I                                          Copyright (c) 2009-2020.  博锐尚格科技股份有限公司
+ *        ~8888'
+ *        .!88~                                                                     All rights reserved.
+ *
+ * *********************************************************************************************************************
+ */
+
+import { SGraphStyle } from "./SGraphStyle";
+
+/**
+ * item 风格接口
+ *
+ * @author  郝建龙
+ */
+export interface Style {
+    [propName: string]: SGraphStyle;
+} // Interface Style