Browse Source

修正两种绘制功能数据加载不正确bug

develop
陈鹏飞 3 years ago
parent
commit
3073311e88
  1. 15
      src/app/system-management/image-label2/image-label2.component.ts

15
src/app/system-management/image-label2/image-label2.component.ts

@ -143,6 +143,7 @@ export class ImageLabel2Component implements OnInit {
context.stroke(); context.stroke();
} else { //绘制 矩形 } else { //绘制 矩形
this.drawOblong(this.oblongPoints,context) this.drawOblong(this.oblongPoints,context)
context.strokeStyle = this.oilUnloadingArea? "green" : "red";
let element = this.getOblongInfo(this.downx,this.downy,moveX,moveY) let element = this.getOblongInfo(this.downx,this.downy,moveX,moveY)
context.strokeRect(element.x,element.y,element.width,element.height); context.strokeRect(element.x,element.y,element.width,element.height);
} }
@ -180,9 +181,16 @@ export class ImageLabel2Component implements OnInit {
arrowPoints = []; //箭头的点的集合 arrowPoints = []; //箭头的点的集合
//canvas 绘制直线 //canvas 绘制直线
drawLine(pointsList, context) { drawLine(pointsList, context, isRepeat: boolean = false) {
context.clearRect(0, 0, this.canvasWidth, this.canvasHeight); context.clearRect(0, 0, this.canvasWidth, this.canvasHeight);
this.copyCanvas? context.putImageData(this.copyCanvas, 0, 0) : null; this.copyCanvas? context.putImageData(this.copyCanvas, 0, 0) : null;
if (this.markType === 3 && !isRepeat) { //同时绘制 矩形
this.oblongPoints.forEach(element => {
context.strokeStyle = element.oilUnloadingArea? "green" : "red";
context.lineWidth = 3;
context.strokeRect(element.x,element.y,element.width,element.height);
});
}
pointsList.forEach((item,index)=>{ pointsList.forEach((item,index)=>{
if ((index+1)%2 === 0) { if ((index+1)%2 === 0) {
this.drawArrow(item.startX,item.startY,item.endX,item.endY,30,10,3,'green',context) this.drawArrow(item.startX,item.startY,item.endX,item.endY,30,10,3,'green',context)
@ -273,8 +281,11 @@ export class ImageLabel2Component implements OnInit {
drawOblong(oblongList, context) { drawOblong(oblongList, context) {
context.clearRect(0, 0, this.canvasWidth, this.canvasHeight); context.clearRect(0, 0, this.canvasWidth, this.canvasHeight);
this.copyCanvas? context.putImageData(this.copyCanvas, 0, 0) : null; this.copyCanvas? context.putImageData(this.copyCanvas, 0, 0) : null;
if (this.markType === 3) { //同时绘制 直线箭头
this.drawLine(this.arrowPoints,context,true)
}
oblongList.forEach(element => { oblongList.forEach(element => {
context.strokeStyle = "green"; context.strokeStyle = element.oilUnloadingArea? "green" : "red";
context.lineWidth = 3; context.lineWidth = 3;
context.strokeRect(element.x,element.y,element.width,element.height); context.strokeRect(element.x,element.y,element.width,element.height);
}); });

Loading…
Cancel
Save