|
@@ -24,10 +24,11 @@
|
|
|
* *********************************************************************************************************************
|
|
|
*/
|
|
|
|
|
|
-import { SGraphItem, STextItem, SLineStyle, STextOrigin, Point } from "@persagy-web/graph";
|
|
|
+import { SGraphItem, SLineStyle, STextOrigin, Point } from "@persagy-web/graph";
|
|
|
import { SColor, SFont, SPainter, SLineCapStyle, SPoint, SPath, SPolygonUtil, SRect } from "@persagy-web/draw";
|
|
|
import { Example } from "../index";
|
|
|
import { SGraphEdit, SBaseTextEdit } from "@persagy-web/edit";
|
|
|
+import { SItemStatus } from "@persagy-web/big";
|
|
|
/**
|
|
|
* 编辑基础空间类
|
|
|
*
|
|
@@ -46,8 +47,8 @@ export class SPlanZone extends SGraphEdit {
|
|
|
private pointList: SPoint[][][] = [];
|
|
|
/** path 对象 */
|
|
|
private pathList: SPath[] = [];
|
|
|
- /** text item */
|
|
|
- textItem: SBaseTextEdit = new SBaseTextEdit(this, null);
|
|
|
+ /** 文本数组 */
|
|
|
+ textItemList: SBaseTextEdit[] = [];
|
|
|
|
|
|
/** 是否可移动 */
|
|
|
set moveable(val: boolean) {
|
|
@@ -63,6 +64,25 @@ export class SPlanZone extends SGraphEdit {
|
|
|
return this._legendData;
|
|
|
} // get legendData()
|
|
|
|
|
|
+ /** item 状态 */
|
|
|
+ _status: SItemStatus = SItemStatus.Normal;
|
|
|
+ get status(): SItemStatus {
|
|
|
+ return this._status;
|
|
|
+ }
|
|
|
+ set status(v: SItemStatus) {
|
|
|
+ this._status = v;
|
|
|
+ if (v == SItemStatus.Normal) {
|
|
|
+ this.textItemList.map((item) => {
|
|
|
+ item.moveable = false;
|
|
|
+ });
|
|
|
+ } else if (v == SItemStatus.Edit) {
|
|
|
+ this.textItemList.map((item) => {
|
|
|
+ item.moveable = true;
|
|
|
+ });
|
|
|
+ }
|
|
|
+ this.update();
|
|
|
+ }
|
|
|
+
|
|
|
/** 边框颜色 */
|
|
|
_strokeColor: SColor = SColor.Black;
|
|
|
get strokeColor(): SColor {
|
|
@@ -106,32 +126,33 @@ export class SPlanZone extends SGraphEdit {
|
|
|
/** 宽度是否像素 */
|
|
|
widthIsPx: boolean = false;
|
|
|
|
|
|
- /**文本内容 */
|
|
|
- get text(): string {
|
|
|
- return this.textItem.text;
|
|
|
- } // Get text
|
|
|
- set text(v: string) {
|
|
|
- this.textItem.text = v;
|
|
|
- this.update();
|
|
|
- } // Set text
|
|
|
- /**文本颜色 */
|
|
|
+ /** 文本颜色 */
|
|
|
private _color: SColor = new SColor();
|
|
|
get color(): SColor {
|
|
|
return this._color;
|
|
|
} // Get color
|
|
|
set color(v: SColor) {
|
|
|
this._color = v;
|
|
|
- } // Set color
|
|
|
- /**文本样式 */
|
|
|
+ this.textItemList.forEach((item) => {
|
|
|
+ item.color = v;
|
|
|
+ });
|
|
|
+ this.update();
|
|
|
+ }
|
|
|
+
|
|
|
+ /** 文本字体 */
|
|
|
private _font: SFont = new SFont("sans-serif", 12);
|
|
|
get font(): SFont {
|
|
|
return this._font;
|
|
|
} // Get font
|
|
|
set font(v: SFont) {
|
|
|
this._font = v;
|
|
|
+ this.textItemList.forEach((item: SBaseTextEdit, index: number) => {
|
|
|
+ item.font = v;
|
|
|
+ });
|
|
|
+ this.update();
|
|
|
} // Set font
|
|
|
|
|
|
- /** 是否显示文字 */
|
|
|
+ /** 是否显示文字 */
|
|
|
_showText: boolean = true;
|
|
|
get showText(): boolean {
|
|
|
return this._showText;
|
|
@@ -142,18 +163,60 @@ export class SPlanZone extends SGraphEdit {
|
|
|
}
|
|
|
this._showText = v;
|
|
|
if (v) {
|
|
|
- this.textItem.show();
|
|
|
+ this.textItemList.map((item) => {
|
|
|
+ item.show();
|
|
|
+ });
|
|
|
} else {
|
|
|
- this.textItem.hide();
|
|
|
+ this.textItemList.map((item) => {
|
|
|
+ item.hide();
|
|
|
+ });
|
|
|
}
|
|
|
}
|
|
|
|
|
|
/** 公式 */
|
|
|
- private _formula: string = "";
|
|
|
+ private _formula: any[] = [];
|
|
|
set formula(val) {
|
|
|
this._formula = val;
|
|
|
+ try {
|
|
|
+ if (this.scene) {
|
|
|
+ this.textItemList.forEach((textItem) => {
|
|
|
+ this.scene?.removeItem(textItem);
|
|
|
+ });
|
|
|
+ }
|
|
|
+ if (val.length) {
|
|
|
+ const textItemList: any[] = [];
|
|
|
+ val.forEach((item: any, index: number) => {
|
|
|
+ let obj = new SBaseTextEdit(this, null);
|
|
|
+ obj.propertyData = { ...item };
|
|
|
+ obj.text = item.name;
|
|
|
+ if (item.pos) {
|
|
|
+ obj.moveTo(item.pos.x, item.pos.y);
|
|
|
+ } else {
|
|
|
+ const avgPos = this.getAverageVal();
|
|
|
+ // console.log(avgPos.avgY - this.font.size * (0.5 * val.length - 0.5 - index))
|
|
|
+ obj.moveTo(avgPos.avgX, avgPos.avgY - this.font.size * (0.5 * val.length - 0.5 - index));
|
|
|
+ }
|
|
|
+
|
|
|
+ obj.connect("onMove", this, this.textMove.bind(this));
|
|
|
+ obj.font = this.font;
|
|
|
+ obj.color = this.color;
|
|
|
+ obj.originPosition = STextOrigin.Center;
|
|
|
+ obj.isTransform = false;
|
|
|
+ obj.moveable = true;
|
|
|
+ obj.showSelect = false;
|
|
|
+ textItemList.push(obj);
|
|
|
+ });
|
|
|
+ this.textItemList = textItemList;
|
|
|
+ } else {
|
|
|
+ this.textItemList = [];
|
|
|
+ }
|
|
|
+ this.update();
|
|
|
+ } catch (error) {
|
|
|
+ console.error("公式数据错误", error);
|
|
|
+ }
|
|
|
} // set formula()
|
|
|
- get formula(): string {
|
|
|
+ // get formula(): string {
|
|
|
+ get formula(): any[] {
|
|
|
return this._formula;
|
|
|
} // get formula()
|
|
|
|
|
@@ -168,8 +231,6 @@ export class SPlanZone extends SGraphEdit {
|
|
|
*/
|
|
|
constructor(parent: SGraphItem | null, data: Example) {
|
|
|
super(parent);
|
|
|
- this.textItem.originPosition = STextOrigin.Center;
|
|
|
- this.textItem.isTransform = false;
|
|
|
this.zOrder = 9700;
|
|
|
this.selectable = true;
|
|
|
this.showSelect = false;
|
|
@@ -183,9 +244,8 @@ export class SPlanZone extends SGraphEdit {
|
|
|
if (!this.legendData) return;
|
|
|
this.id = this.legendData.id ? this.legendData.id : "";
|
|
|
this.anotherMsg = this.legendData?.properties?.anotherMsg ? this.legendData.properties.anotherMsg : "";
|
|
|
- this.textItem.text = this.legendData.localName ? this.legendData.localName : "";
|
|
|
if (this.legendData?.outline?.length && this.legendData.outline[0] && this.legendData.outline[0]?.length) {
|
|
|
- let tempArr = this.legendData.outline.map((t): Point[][] => {
|
|
|
+ let outline = this.legendData.outline.map((t): Point[][] => {
|
|
|
return t.map((it): Point[] => {
|
|
|
return it.map(
|
|
|
(item): Point => {
|
|
@@ -194,13 +254,12 @@ export class SPlanZone extends SGraphEdit {
|
|
|
);
|
|
|
});
|
|
|
});
|
|
|
- this.minX = tempArr[0][0][0].x;
|
|
|
+ this.minX = outline[0][0][0].x;
|
|
|
this.maxX = this.minX;
|
|
|
- this.minY = tempArr[0][0][0].y;
|
|
|
+ this.minY = outline[0][0][0].y;
|
|
|
this.maxY = this.minY;
|
|
|
- this.textItem.moveTo(this.minX, this.minY);
|
|
|
// 处理轮廓点数组,同时计算最大最小值
|
|
|
- this.pointList = tempArr.map((t): SPoint[][] => {
|
|
|
+ this.pointList = outline.map((t): SPoint[][] => {
|
|
|
let sPath = new SPath();
|
|
|
let tempArr = t.map((it): SPoint[] => {
|
|
|
let array = it.map(
|
|
@@ -229,10 +288,38 @@ export class SPlanZone extends SGraphEdit {
|
|
|
return tempArr;
|
|
|
});
|
|
|
}
|
|
|
- if (this.legendData.properties?.textPos?.x && this.legendData.properties?.textPos?.y) {
|
|
|
- this.textItem.moveTo(this.legendData.textPos.x, this.legendData.textPos.y);
|
|
|
+ }
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 获取轮廓线第一块区域的坐标平均值
|
|
|
+ */
|
|
|
+ getAverageVal() {
|
|
|
+ let avgX = 0,
|
|
|
+ avgY = 0;
|
|
|
+ if (this.pointList[0] && this.pointList[0][0] && this.pointList[0][0].length) {
|
|
|
+ const firstOutline = this.pointList[0][0];
|
|
|
+ avgX =
|
|
|
+ firstOutline.reduce((val, pos) => {
|
|
|
+ return val + pos.x;
|
|
|
+ }, 0) / firstOutline.length;
|
|
|
+ avgY =
|
|
|
+ firstOutline.reduce((val, pos) => {
|
|
|
+ return val + pos.y;
|
|
|
+ }, 0) / firstOutline.length;
|
|
|
}
|
|
|
+ return { avgX, avgY };
|
|
|
+ }
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 文本位置移动回调函数
|
|
|
+ *
|
|
|
+ * @param textItem 移动的文本元素
|
|
|
+ * @param pointList 移动前后位置坐标信息
|
|
|
+ */
|
|
|
+ textMove(textItem: SBaseTextEdit, pointList: SPoint[]) {
|
|
|
+ this.moveText();
|
|
|
}
|
|
|
+ moveText() {}
|
|
|
|
|
|
/**
|
|
|
* Item 对象边界区域
|
|
@@ -286,7 +373,6 @@ export class SPlanZone extends SGraphEdit {
|
|
|
attachObjectIds: [this.id],
|
|
|
properties: {
|
|
|
id: this.id,
|
|
|
- textPos: { x: this.textItem.x, y: this.textItem.y },
|
|
|
anotherMsg: this.anotherMsg,
|
|
|
},
|
|
|
};
|