|
@@ -17,7 +17,7 @@
|
|
|
* 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) 2016-2020. 博锐尚格科技股份有限公司
|
|
|
+ * .&888888I Copyright (c) 2009-2020. 博锐尚格科技股份有限公司
|
|
|
* ~8888'
|
|
|
* .!88~ All rights reserved.
|
|
|
*
|
|
@@ -25,11 +25,11 @@
|
|
|
*/
|
|
|
|
|
|
import {
|
|
|
+ SGraphItem,
|
|
|
SGraphPointListDelete,
|
|
|
SGraphPointListInsert,
|
|
|
SGraphPointListUpdate,
|
|
|
- SLineStyle,
|
|
|
- SGraphItem
|
|
|
+ SLineStyle
|
|
|
} from "@persagy-web/graph";
|
|
|
import { SKeyCode, SMouseEvent, SUndoStack } from "@persagy-web/base/";
|
|
|
import {
|
|
@@ -41,34 +41,28 @@ import {
|
|
|
SPolygonUtil,
|
|
|
SRect
|
|
|
} from "@persagy-web/draw";
|
|
|
-import { SItemStatus } from "@persagy-web/big";
|
|
|
+import { SItemStatus, ItemOrder } from "@persagy-web/big";
|
|
|
+import { Marker } from "../type/Marker";
|
|
|
import { SMathUtil } from "@persagy-web/big/lib/utils/SMathUtil";
|
|
|
import { SGraphEdit } from ".."
|
|
|
-import { Marker } from "../type/Marker";
|
|
|
-import { ItemOrder } from '@persagy-web/big/lib';
|
|
|
/**
|
|
|
- * 多边形编辑类
|
|
|
+ * 编辑多边形
|
|
|
*
|
|
|
- * @author 韩耀龙(han_yao_long@163.com)
|
|
|
+ * @author 韩耀龙
|
|
|
*/
|
|
|
export class SBasePolygonEdit extends SGraphEdit {
|
|
|
- //属性
|
|
|
- /**编辑相关操作的数据 */
|
|
|
- data: Marker
|
|
|
- /** 起始锚点 */
|
|
|
- startItem: SGraphItem | null = null;
|
|
|
- /** 结束锚点 */
|
|
|
- endItem: SGraphItem | null = null;
|
|
|
- /** X坐标最小值 */
|
|
|
+ /** X坐标最小值 */
|
|
|
private minX = Number.MAX_SAFE_INTEGER;
|
|
|
- /** X坐标最大值 */
|
|
|
+ /** X坐标最大值 */
|
|
|
private maxX = Number.MIN_SAFE_INTEGER;
|
|
|
- /** Y坐标最小值 */
|
|
|
+ /** Y坐标最小值 */
|
|
|
private minY = Number.MAX_SAFE_INTEGER;
|
|
|
- /** Y坐标最大值 */
|
|
|
+ /** Y坐标最大值 */
|
|
|
private maxY = Number.MIN_SAFE_INTEGER;
|
|
|
|
|
|
- /** 轮廓线坐标 */
|
|
|
+ /** 图例节点对象数据 */
|
|
|
+ data: Marker;
|
|
|
+ /** 轮廓线坐标 */
|
|
|
private pointList: SPoint[] = [];
|
|
|
// 获取当前状态
|
|
|
get getPointList(): SPoint[] {
|
|
@@ -79,22 +73,12 @@ export class SBasePolygonEdit extends SGraphEdit {
|
|
|
this.pointList = arr;
|
|
|
this.update();
|
|
|
}
|
|
|
- /** 是否垂直水平绘制 */
|
|
|
- private _verAndLeve: Boolean = false;
|
|
|
- get verAndLeve(): Boolean {
|
|
|
- return this._verAndLeve;
|
|
|
- }
|
|
|
- set verAndLeve(bool: Boolean) {
|
|
|
- this._verAndLeve = bool;
|
|
|
- this.update();
|
|
|
- }
|
|
|
- // 当前状态
|
|
|
+
|
|
|
+ /** 当前状态 */
|
|
|
protected _status: number = SItemStatus.Normal;
|
|
|
- // 获取当前状态
|
|
|
get status(): SItemStatus {
|
|
|
return this._status;
|
|
|
}
|
|
|
- // 编辑当前状态
|
|
|
set status(value: SItemStatus) {
|
|
|
this._status = value;
|
|
|
this.undoStack.clear();
|
|
@@ -102,49 +86,49 @@ export class SBasePolygonEdit extends SGraphEdit {
|
|
|
}
|
|
|
|
|
|
/** 边框颜色 */
|
|
|
- _strokeColor: SColor = new SColor("#0091FF");
|
|
|
+ _strokeColor: SColor = SColor.Black;
|
|
|
/** 画笔颜色 */
|
|
|
get strokeColor(): SColor {
|
|
|
return this._strokeColor;
|
|
|
- }
|
|
|
+ } // Get strokeColor
|
|
|
set strokeColor(v: SColor) {
|
|
|
this._strokeColor = v;
|
|
|
this.update();
|
|
|
- }
|
|
|
+ } // Set strokeColor
|
|
|
|
|
|
/** 填充颜色 */
|
|
|
- _fillColor: SColor = new SColor("#1EE887");
|
|
|
+ _fillColor: SColor = new SColor("#2196f3");
|
|
|
get fillColor(): SColor {
|
|
|
return this._fillColor;
|
|
|
- }
|
|
|
+ } // Get fillColor
|
|
|
set fillColor(v: SColor) {
|
|
|
this._fillColor = v;
|
|
|
this.update();
|
|
|
- }
|
|
|
+ } // Set fillColor
|
|
|
|
|
|
/** 边框样式 */
|
|
|
_lineStyle: SLineStyle = SLineStyle.Solid;
|
|
|
get lineStyle(): SLineStyle {
|
|
|
return this._lineStyle;
|
|
|
- }
|
|
|
+ } // Get lineStyle
|
|
|
set lineStyle(v: SLineStyle) {
|
|
|
this._lineStyle = v;
|
|
|
this.update();
|
|
|
- }
|
|
|
+ } // Set lineStyle
|
|
|
|
|
|
- /** 边框的宽 只可输入像素宽*/
|
|
|
- _lineWidth: number = 4;
|
|
|
+ /** 边框的宽 只可输入像素宽 */
|
|
|
+ _lineWidth: number = 1;
|
|
|
get lineWidth(): number {
|
|
|
return this._lineWidth;
|
|
|
- }
|
|
|
+ } // Get lineWidth
|
|
|
set lineWidth(v: number) {
|
|
|
this._lineWidth = v;
|
|
|
this.update();
|
|
|
- }
|
|
|
+ } // Set lineWidth
|
|
|
|
|
|
- /** 是否闭合 */
|
|
|
+ /** 是否闭合 */
|
|
|
closeFlag: boolean = false;
|
|
|
- /** 鼠标移动点 */
|
|
|
+ /** 鼠标移动点 */
|
|
|
private lastPoint: SPoint | null = null;
|
|
|
/** 当前鼠标获取顶点对应索引 */
|
|
|
private curIndex: number = -1;
|
|
@@ -152,17 +136,18 @@ export class SBasePolygonEdit extends SGraphEdit {
|
|
|
private curPoint: null | SPoint = null;
|
|
|
/** 灵敏像素 */
|
|
|
private len: number = 10;
|
|
|
- /** 场景像素 内部将灵敏像素换算为场景实际距离 */
|
|
|
+ /** 场景像素 内部将灵敏像素换算为场景实际距离 */
|
|
|
private scenceLen: number = 15;
|
|
|
- /** 场景像素 */
|
|
|
+ /** 场景像素 */
|
|
|
private isAlt: boolean = false;
|
|
|
- /** undoredo堆栈 */
|
|
|
+ /** undo/redo堆栈 */
|
|
|
protected undoStack: SUndoStack = new SUndoStack();
|
|
|
|
|
|
/**
|
|
|
* 构造函数
|
|
|
*
|
|
|
* @param parent 指向父对象
|
|
|
+ * @param data 图例节点对象数据
|
|
|
*/
|
|
|
constructor(parent: SGraphItem | null, data: Marker) {
|
|
|
super(parent);
|
|
@@ -170,64 +155,72 @@ export class SBasePolygonEdit extends SGraphEdit {
|
|
|
// this.textItem.isTransform = false;
|
|
|
this.zOrder = ItemOrder.polygonOrder;
|
|
|
this.data = data;
|
|
|
- this.name = data.Name;
|
|
|
+ this.name = data.name;
|
|
|
// this.text = data.Name;
|
|
|
- if (data) {
|
|
|
+ if (data.style) {
|
|
|
this.setPointList = [];
|
|
|
let setPointList: SPoint[];
|
|
|
- if (data.OutLine) {
|
|
|
- if (data.OutLine[0] instanceof SPoint) {
|
|
|
+ if (data.style.outLine) {
|
|
|
+ if (data.style.outLine[0] instanceof SPoint) {
|
|
|
// @ts-ignore
|
|
|
- this.setPointList = data.OutLine;
|
|
|
+ this.setPointList = data.style.outLine;
|
|
|
} else {
|
|
|
- setPointList = data.OutLine.map(i => {
|
|
|
- return (new SPoint(i.X, i.Y))
|
|
|
+ setPointList = data.style.outLine.map(i => {
|
|
|
+ return (new SPoint(i.x, i.y))
|
|
|
})
|
|
|
this.setPointList = setPointList;
|
|
|
}
|
|
|
}
|
|
|
- if (data.Properties.Zorder) {
|
|
|
- this.zOrder = data.Properties.Zorder;
|
|
|
- }
|
|
|
- // 设置线宽
|
|
|
- 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 = new SColor(data.Properties.color);
|
|
|
- }
|
|
|
- if (data.Properties.font) {
|
|
|
- this.font = new SFont("sans-serif", data.Properties.font);
|
|
|
- }
|
|
|
- if (data.Properties && data.Properties.IsActive) {
|
|
|
- this.isActive = data.Properties.IsActive;
|
|
|
- }
|
|
|
- if (data.AttachObjectIds && data.AttachObjectIds.length) {
|
|
|
- this.isActive = true;
|
|
|
- }
|
|
|
- switch (data.Properties.LineDash) {
|
|
|
- case "solid":
|
|
|
- this.lineStyle = SLineStyle.Solid;
|
|
|
- break;
|
|
|
- case "dotted":
|
|
|
- this.lineStyle = SLineStyle.Dotted;
|
|
|
- break;
|
|
|
- case "dashed":
|
|
|
- this.lineStyle = SLineStyle.Dashed;
|
|
|
- break;
|
|
|
- default:
|
|
|
- this.lineStyle = SLineStyle.Solid;
|
|
|
+ // 样式相关
|
|
|
+ if (data.style.default) {
|
|
|
+ // 颜色
|
|
|
+ if (data.style.default.strokeColor) {
|
|
|
+ this.strokeColor = new SColor(data.style.default.strokeColor)
|
|
|
+ }
|
|
|
+ // 线宽
|
|
|
+ if (data.style.default.lineWidth) {
|
|
|
+ this.lineWidth = data.style.default.lineWidth
|
|
|
+ }
|
|
|
+ // 线样式
|
|
|
+ if (data.style.default.lineStyle) {
|
|
|
+ this.lineStyle = data.style.default.lineStyle
|
|
|
+ }
|
|
|
+ // 填充色
|
|
|
+ if (data.style.default.fillColor) {
|
|
|
+ this.fillColor = new SColor(data.style.default.fillColor)
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
+ // if (data) {
|
|
|
+ // if (data.Properties.Zorder) {
|
|
|
+ // this.zOrder = data.Properties.Zorder;
|
|
|
+ // }
|
|
|
+ // // 设置线宽
|
|
|
+
|
|
|
+ // if (data.Properties.TextPos) {
|
|
|
+ // this.textItem.moveTo(data.Properties.TextPos.X, data.Properties.TextPos.Y);
|
|
|
+ // }
|
|
|
+ // if (data.Properties.color) {
|
|
|
+ // this.color = new SColor(data.Properties.color);
|
|
|
+ // }
|
|
|
+ // if (data.Properties.font) {
|
|
|
+ // this.font = new SFont("sans-serif", data.Properties.font);
|
|
|
+ // }
|
|
|
+ // if (data.Properties && data.Properties.IsActive) {
|
|
|
+ // this.isActive = data.Properties.IsActive;
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ // 监听多边形创建完成事件,并动态计算文本位置
|
|
|
+ // 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);
|
|
|
+ // })
|
|
|
}
|
|
|
|
|
|
//////////////////
|
|
@@ -250,7 +243,7 @@ export class SBasePolygonEdit extends SGraphEdit {
|
|
|
}
|
|
|
this.update();
|
|
|
return point;
|
|
|
- }
|
|
|
+ } // Function insertPoint()
|
|
|
|
|
|
/**
|
|
|
* 删除点位
|
|
@@ -279,7 +272,7 @@ export class SBasePolygonEdit extends SGraphEdit {
|
|
|
this.curPoint = null;
|
|
|
this.update();
|
|
|
return point;
|
|
|
- }
|
|
|
+ } // Function deletePoint()
|
|
|
|
|
|
/**
|
|
|
* 多边形顶点的移动位置
|
|
@@ -300,16 +293,7 @@ export class SBasePolygonEdit extends SGraphEdit {
|
|
|
}
|
|
|
point = this.pointList[i];
|
|
|
return point;
|
|
|
- }
|
|
|
-
|
|
|
- /**
|
|
|
- * 打印出多边形数组
|
|
|
- *
|
|
|
- * @return 顶点数组
|
|
|
- */
|
|
|
- PrintPointList(): SPoint[] {
|
|
|
- return this.pointList;
|
|
|
- }
|
|
|
+ } // Function movePoint()
|
|
|
|
|
|
////////////
|
|
|
// 以下为三种状态下的绘制多边形方法
|
|
@@ -347,7 +331,7 @@ export class SBasePolygonEdit extends SGraphEdit {
|
|
|
}
|
|
|
painter.drawPolygon([...pointList]);
|
|
|
painter.restore();
|
|
|
- }
|
|
|
+ } // Function drawShowPolygon()
|
|
|
|
|
|
/**
|
|
|
* 创建状态 --绘制多边形数组
|
|
@@ -403,7 +387,7 @@ export class SBasePolygonEdit extends SGraphEdit {
|
|
|
} else {
|
|
|
painter.drawPolygon(pointList);
|
|
|
}
|
|
|
- }
|
|
|
+ } // Function drawCreatePolygon()
|
|
|
|
|
|
/**
|
|
|
*
|
|
@@ -429,7 +413,7 @@ export class SBasePolygonEdit extends SGraphEdit {
|
|
|
}
|
|
|
painter.drawCircle(item.x, item.y, painter.toPx(this.len / 2));
|
|
|
});
|
|
|
- }
|
|
|
+ } // Function drawCreatePolygon()
|
|
|
|
|
|
/**
|
|
|
* 编辑状态操作多边形数组
|
|
@@ -543,7 +527,7 @@ export class SBasePolygonEdit extends SGraphEdit {
|
|
|
// 刷新视图
|
|
|
this.update();
|
|
|
}
|
|
|
- }
|
|
|
+ } // Function editPolygonPoint()
|
|
|
|
|
|
/////////////////////
|
|
|
// undo、redo相关操作
|
|
@@ -557,7 +541,7 @@ export class SBasePolygonEdit extends SGraphEdit {
|
|
|
// 记录相关命令并推入堆栈中
|
|
|
const sgraphcommand = new SGraphCommand(this.scene, this, ...any);
|
|
|
this.undoStack.push(sgraphcommand);
|
|
|
- }
|
|
|
+ } // Function recordAction()
|
|
|
|
|
|
/**
|
|
|
* 执行取消操作执行
|
|
@@ -567,7 +551,7 @@ export class SBasePolygonEdit extends SGraphEdit {
|
|
|
return;
|
|
|
}
|
|
|
this.undoStack.undo();
|
|
|
- }
|
|
|
+ } // Function undo()
|
|
|
|
|
|
/**
|
|
|
* 执行重做操作执行
|
|
@@ -577,7 +561,7 @@ export class SBasePolygonEdit extends SGraphEdit {
|
|
|
return;
|
|
|
}
|
|
|
this.undoStack.redo();
|
|
|
- }
|
|
|
+ } // Function redo()
|
|
|
|
|
|
///////////////////////////////
|
|
|
// 以下为鼠标事件
|
|
@@ -658,7 +642,7 @@ export class SBasePolygonEdit extends SGraphEdit {
|
|
|
* @return boolean
|
|
|
*/
|
|
|
onMouseDown(event: SMouseEvent): boolean {
|
|
|
- if (event.shiftKey || this.verAndLeve) {
|
|
|
+ if (event.shiftKey) {
|
|
|
event = this.compare(event);
|
|
|
}
|
|
|
// 如果状态为编辑状态则添加点
|
|
@@ -723,7 +707,7 @@ export class SBasePolygonEdit extends SGraphEdit {
|
|
|
*/
|
|
|
|
|
|
onMouseMove(event: SMouseEvent): boolean {
|
|
|
- if (event.shiftKey || this.verAndLeve) {
|
|
|
+ if (event.shiftKey) {
|
|
|
event = this.compare(event);
|
|
|
}
|
|
|
if (this.status == SItemStatus.Create) {
|
|
@@ -756,7 +740,7 @@ export class SBasePolygonEdit extends SGraphEdit {
|
|
|
if (this.status == SItemStatus.Create) {
|
|
|
last = this.pointList[this.pointList.length - 1];
|
|
|
} else if (this.status == SItemStatus.Edit) {
|
|
|
- if (this.curIndex > 1) {
|
|
|
+ if (this.curIndex > 0) {
|
|
|
last = this.pointList[this.curIndex - 1];
|
|
|
}
|
|
|
}
|
|
@@ -910,4 +894,4 @@ export class SBasePolygonEdit extends SGraphEdit {
|
|
|
this.drawEditPolygon(painter, this.pointList);
|
|
|
}
|
|
|
} // Function onDraw()
|
|
|
-}
|
|
|
+} // Class SPolygonItem
|