import { SGraphItem, SLineStyle } from "@saga-web/graph/lib"; import { Legend } from '../types/Legend'; import { SPainter, SColor, SFont, SPoint, SLineCapStyle } from "@saga-web/draw"; import { STextItem } from '@saga-web/graph/lib'; import { hexify } from "@/components/mapClass/until" import { SItemStatus, ItemOrder, SPolygonItem } from '@saga-web/big/lib'; /** * 图例节点Item(区域类型) * * * @author 张宇(taohuzy@163.com) */ export class SZoneLegendItem extends SPolygonItem { /** 图例节点对象数据 */ data: Legend; /** text item */ textItem: STextItem = new STextItem(this); get text(): string { return this.textItem.text; } set text(v: string) { this.textItem.text = v; this.update(); } get color(): SColor { return this.textItem.color; } set color(v: SColor) { this.textItem.color = v; } get font(): SFont { return this.textItem.font; } set font(v: SFont) { this.textItem.font = v; } get status(): SItemStatus { return this._status; } // 编辑当前状态 set status(value: SItemStatus) { this._status = value; // 如果状态为show则需清栈 if (value == SItemStatus.Normal) { // 切换显示状态显示文本 this.showText = true; // 切换显示状态不可移动文本 this.textItem.moveable = false; if (this.undoStack) { this.undoStack.clear(); } } else if (value == SItemStatus.Edit) { // 切换编辑状态显示文本 this.showText = true; // 切换编辑状态可移动文本 this.textItem.moveable = true; } else if (value == SItemStatus.Create) { // 切换创建状态不显示文本 this.showText = false; // 切换创建状态不可移动文本 this.textItem.moveable = false; } this.update(); }; /** 是否激活 */ _isActive: boolean = false; get isActive(): boolean { return this._isActive; } // Get isActive set isActive(v: boolean) { this._isActive = v; if (v) { this.cursor = "pointer"; } else { this.cursor = "auto"; } this.update(); } // Set isActive /** 是否显示文字 */ _showText: boolean = true; get showText(): boolean { return this._showText; } set showText(v: boolean) { if (v === this._showText) { return } this._showText = v; if (v) { this.textItem.show(); } else { this.textItem.hide(); } } /** 是否蒙版遮罩 */ _maskFlag: boolean = false; get maskFlag(): boolean { return this._maskFlag; } set maskFlag(v: boolean) { if (v === this._maskFlag) { return } this._maskFlag = v; this.update() } /** * 构造函数 * * @param parent 指向父对象 * @param data 图例节点对象数据 */ constructor(parent: SGraphItem | null, data: Legend) { super(parent); this.textItem.isTransform = false; this.zOrder = ItemOrder.polygonOrder; this.data = data; this.id = data.ID; this.name = data.Name; this.text = data.Name; if (data) { this.setPointList = []; let setPointList: SPoint[]; if (data.OutLine) { if (data.OutLine[0] instanceof SPoint) { // @ts-ignore this.setPointList = data.OutLine; } else { setPointList = data.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; } } // 监听多边形创建完成事件,并动态计算文本位置 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); }) } toData(): any { this.data.Pos = { X: this.x, Y: this.y }; this.data.Name = this.name; this.data.Properties.Zorder = this.zOrder; this.data.Properties.FillColor = this.fillColor.value; this.data.Properties.StrokeColor = this.strokeColor.value; this.data.Properties.LineWidth = this.lineWidth; switch (this.lineStyle) { case SLineStyle.Solid: this.data.Properties.LineDash = "solid"; break; case SLineStyle.Dotted: this.data.Properties.LineDash = "dotted"; break; case SLineStyle.Dashed: this.data.Properties.LineDash = "dashed"; break; default: this.data.Properties.LineDash = "solid"; } this.data.OutLine = this.getPointList.map(pos => { return { X: pos.x, Y: pos.y } }); this.data.Properties.TextPos = {X: this.textItem.x, Y: this.textItem.y}; this.data.Properties.font = this.font.size; this.data.Properties.color = this.color.value; this.data.Properties.IsActive = this.isActive; return this.data; } onDraw(painter: SPainter) { if (this.maskFlag && this.status == SItemStatus.Normal) { let color = new SColor(this.strokeColor) color.alpha = color.alpha / 2 let brushcolor = new SColor(this.fillColor) brushcolor.alpha = brushcolor.alpha / 2 painter.pen.color = color painter.pen.lineCapStyle = SLineCapStyle.Square painter.pen.lineWidth = painter.toPx(this._lineWidth) painter.brush.color = brushcolor // @ts-ignore painter.drawPolygon([...this.pointList]); } else { super.onDraw(painter); } } } // Class SZoneLegendItem