/* * ******************************************************************************************************************** * * :*$@@%$*: ;: ;; ;; * :@@%! :!@@%: %! ;%%@@%$ =@@@@@@@%; @%@@@%%%%@@@@@ * :@%; :$= %%$$$%$$ ;$$ ;$@= !@$ * =@! %! @ $=;% !@@@%: !$$$$$$$$$$$$$$= * =@* %! @ $= % %@= =%@! %= * *$%%! @@= ;=$%%%$*: %! @ $= % =%%%%%%@$ *%: =% * %@@!: !@@@%=$@@@@%! :*@@$: %! @ $= % $* ;@ @* :%* * ;@@! ;!!!;: ;@%: =======@%========* @ $$ % $%*****$@ :@$=*********=@$ * $@* ;@@@%=!: *@* * =@$ ;;;!=%@@@@=! =@! * %@$: =@%: :*@@@* %@= Copyright (c) 2016-2019. 北京上格云技术有限公司 * ;%@@$=$@@%* *@@@$=%@@%; * ::;:: ::;:: All rights reserved. * * ******************************************************************************************************************** */ import { Opt } from "../types/Opt"; import { SGraphyItem } from "@saga-web/graphy/lib"; import { SColor, SLineCapStyle, SPainter, SPath2D, SPoint, SPolygonUtil } from "@saga-web/draw/lib"; import { SMouseEvent } from "@saga-web/base/lib"; import { ItemOrder } from "../types/ItemOrder"; import { SMathUtil } from "../utils/SMathUtil"; /** * 蒙版item * * @author 郝建龙 */ export class SceneMarkItem extends SGraphyItem { /** 轮廓线坐标 */ outLine: SPoint[] = []; /** 是否闭合 */ closeFlag = false; /** 鼠标移动点 */ private lastPoint = new SPoint(); /** 蒙版 */ private mask = new SPath2D(); /** * 构造函数 * * @param parent 指向父对象 * @param data 蒙版起点数据 */ constructor(parent: SGraphyItem | null, data: SPoint); // Constructor /** * 构造函数 * * @param parent 指向父对象 * @param data 蒙版轮廓线数据 */ constructor(parent: SGraphyItem | null, data: SPoint[]); // Constructor /** * 构造函数 * * @param parent 指向父对象 * @param data 蒙版起点数据 | 蒙版轮廓线数据 */ constructor(parent: SGraphyItem | null, data: SPoint[] | SPoint) { super(parent); if (data instanceof Array) { this.outLine = data; this.createMask(); } else { this.outLine.push(data); this.lastPoint = data; } this.zOrder = ItemOrder.sceneMarkOrder; } // Constructor /** * 鼠标按下事件 * * @param event 事件参数 * @return boolean */ onMouseDown(event: SMouseEvent): boolean { if (!this.closeFlag && event.buttons == 1) { if ( this.lastPoint.x == this.outLine[0].x && this.lastPoint.y == this.outLine[0].y && this.outLine.length >= 3 ) { this.createMask(); return true; } let p = new SPoint(event.x, event.y); this.lastPoint.x = p.x; this.lastPoint.y = p.y; this.outLine.push(p); } this.update(); return true; } // Function onMouseDown() /** * 鼠标移动事件 * * @param event 事件参数 * @return boolean */ onMouseMove(event: SMouseEvent): boolean { if (!this.closeFlag) { this.lastPoint = new SPoint(event.x, event.y); if (this.outLine.length >= 3) { let le = SMathUtil.pointDistance( this.lastPoint.x, this.lastPoint.y, this.outLine[0].x, this.outLine[0].y ); // @ts-ignore let scale = this.parent.scene.view.scale; if (le * scale < 30) { this.lastPoint.x = this.outLine[0].x; this.lastPoint.y = this.outLine[0].y; } } } this.update(); return true; } // Function onMouseMove() /*** * 键盘按键弹起事件 * * @param event 事件参数 */ onKeyUp(event: KeyboardEvent): void { if (event.keyCode == 13 && this.outLine.length >= 3) { this.createMask(); } } // Function onKeyUp() /** * 创建蒙版 * */ createMask(): void { this.closeFlag = true; if (this.scene) { this.scene.grabItem = null; } this.mask = new SPath2D(); this.mask.moveTo(Number.MIN_SAFE_INTEGER, Number.MIN_SAFE_INTEGER); this.mask.lineTo(Number.MAX_SAFE_INTEGER, Number.MIN_SAFE_INTEGER); this.mask.lineTo(Number.MAX_SAFE_INTEGER, Number.MAX_SAFE_INTEGER); this.mask.lineTo(Number.MIN_SAFE_INTEGER, Number.MAX_SAFE_INTEGER); this.mask.lineTo(Number.MIN_SAFE_INTEGER, Number.MIN_SAFE_INTEGER); let antiArr = this.outLine.concat([]); // (计算基于数学坐标系统,在绘图坐标系由于y轴方向相反结果也要取反) if (SPolygonUtil.clockDir(antiArr) > 0) { antiArr = antiArr.reverse(); } this.mask.polygon(antiArr); this.update(); } // Function createMask() /** * 判断点是否在区域内 * * @param x * @param y */ contains(x: number, y: number): boolean { let arr = this.outLine; return !SPolygonUtil.pointIn(x, y, arr); } // Function contains() /** * Item绘制操作 * * @param painter painter对象 */ onDraw(painter: SPainter): void { painter.pen.lineCapStyle = SLineCapStyle.Square; if (this.closeFlag) { painter.pen.color = SColor.Transparent; painter.brush.color = Opt.sceneMarkColor; painter.drawPath(this.mask); } else { painter.pen.color = new SColor("#ff0000"); painter.pen.lineWidth = painter.toPx(3); painter.drawPolyline(this.outLine); painter.drawLine( this.outLine[this.outLine.length - 1], this.lastPoint ); } } // Function onDraw() } // Class SceneMarkItem