Commit 4153c79a authored by limingzhe's avatar limingzhe

fix: debug

parent daa46f8c
This diff is collapsed.
...@@ -95,6 +95,7 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges { ...@@ -95,6 +95,7 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges {
canvasLeft; canvasLeft;
canvasTop; canvasTop;
renderArr; renderArr;
renderTopArr;
imgArr = []; imgArr = [];
oldPos; oldPos;
radioValue; radioValue;
...@@ -130,7 +131,6 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges { ...@@ -130,7 +131,6 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges {
'posY', 'posY',
'mathLabel', 'mathLabel',
'checkbox', 'checkbox',
'multRect',
'dropDownItem' 'dropDownItem'
] ]
...@@ -512,34 +512,82 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges { ...@@ -512,34 +512,82 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges {
} }
} }
setItemMultRectByData(item, multRectArr) { cleanMultRect(multRectArr) {
for (let i=0; i<multRectArr.length; i++) {
removeItemFromArr(this.renderTopArr, multRectArr[i]);
}
}
setItemMultRectByData(item, multRectDataArr) {
if (item.multRectArr) {
this.cleanMultRect(item.multRectArr);
}
let curBgRect;
if (this.bg) {
curBgRect = this.bg.getBoundingBox();
} else {
curBgRect = {x: 0, y: 0, width: this.canvasWidth, height: this.canvasHeight};
}
let oldBgRect = this.bgItem.rect;
if (!oldBgRect) {
oldBgRect = curBgRect;
}
const rate = curBgRect.width / oldBgRect.width;
const arr = []; const arr = [];
for (let i=0; i<multRectArr.length; i++) { for (let i=0; i<multRectDataArr.length; i++) {
const multRectData = multRectArr[i]; const multRectData = multRectDataArr[i];
const multRect = new HotZoneMultRect(this.ctx); const multRectItem = new HotZoneMultRect(this.ctx);
multRect.showLineDash(); multRectItem.showLineDash();
multRect.setSize(multRectData.width, multRectData.height); multRectItem.anchorX = 0.5;
multRect.anchorX = 0.5; multRectItem.anchorY = 0.5;
multRect.anchorY = 0.5; multRectItem.rectEdgeColor = multRectData.color;
multRect.rectEdgeColor = multRectData.color; multRectItem.showLabel("M-" + (i+1));
multRect.showLabel("M-" + (i+1)); multRectItem.item = item;
multRect.item = item;
multRect.visible = true; multRectItem.visible = true;
if (multRectData.x == -1 && multRectData.y == -1) { if (!multRectData.rect) {
multRect.x = item.x + multRect.width * i * 0.3; //无数据小矩形
multRect.y = item.y + multRect.width * i * 0.3;
multRectItem.setSize(multRectData.width, multRectData.height);
multRectItem.x = item.x + multRectItem.width * i * 0.3;
multRectItem.y = item.y + multRectItem.width * i * 0.3;
} else { } else {
multRect.x = multRectData.x; //有数据小矩形
multRect.y = multRectData.y;
console.log('multRectData.rect: ', multRectData.rect);
const saveRect = multRectData.rect;
saveRect.x *= rate;
saveRect.y *= rate;
saveRect.width *= rate;
saveRect.height *= rate;
saveRect.x += curBgRect.x;
saveRect.y += curBgRect.y;
multRectItem.setSize(saveRect.width, saveRect.height);
multRectItem.scaleX = saveRect.width / multRectItem.width;
multRectItem.scaleY = saveRect.height / multRectItem.height;
multRectItem.x = saveRect.x + saveRect.width / 2;
multRectItem.y = saveRect.y + saveRect.height / 2;
} }
this.renderArr.push(multRect); this.renderTopArr.push(multRectItem);
arr.push(multRect); arr.push(multRectItem);
} }
item.multRectArr = arr; item.multRectArr = arr;
...@@ -923,6 +971,7 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges { ...@@ -923,6 +971,7 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges {
this.canvasHeight = this.wrap.nativeElement.clientHeight; this.canvasHeight = this.wrap.nativeElement.clientHeight;
this.mapScale = this.canvasWidth / this.canvasBaseW; this.mapScale = this.canvasWidth / this.canvasBaseW;
this.renderArr = []; this.renderArr = [];
this.renderTopArr = [];
this.bg = null; this.bg = null;
this.imgArr = []; this.imgArr = [];
...@@ -1175,12 +1224,16 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges { ...@@ -1175,12 +1224,16 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges {
// } // }
// } // }
for (let i = 0; i < this.renderArr.length; i++) { for (let i = 0; i < this.renderArr.length; i++) {
this.renderArr[i].update(this); this.renderArr[i].update(this);
} }
this.updateArr(this.hotZoneArr); this.updateArr(this.hotZoneArr);
this.updateArr(this.renderTopArr);
this.updatePos(); this.updatePos();
...@@ -1369,6 +1422,21 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges { ...@@ -1369,6 +1422,21 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges {
} }
}) })
if (hotZoneArr[i].multRectArr) {
const tempArr = [];
hotZoneArr[i].multRectArr.forEach(element => {
const rectData = element.getBoundingBox();
rectData.x = Math.round((rectData.x - bgItem['rect'].x) * 100) / 100;
rectData.y = Math.round((rectData.y - bgItem['rect'].y) * 100) / 100;
rectData.width = Math.round((rectData.width) * 100) / 100;
rectData.height = Math.round((rectData.height) * 100) / 100;
const oneData = {rect: rectData, color: element.rectEdgeColor}
tempArr.push(oneData);
});
hotZoneItem['multRect'] = tempArr;
}
hotZoneItem['actionData_' + hotZoneItem.gIdx] = hotZoneArr[i]['actionData_' + hotZoneArr[i].gIdx] hotZoneItem['actionData_' + hotZoneItem.gIdx] = hotZoneArr[i]['actionData_' + hotZoneArr[i].gIdx]
...@@ -1928,6 +1996,7 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges { ...@@ -1928,6 +1996,7 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges {
onMultRectSave(e, item) { onMultRectSave(e, item) {
console.log(' in onMultRectSave: ', e); console.log(' in onMultRectSave: ', e);
item.multRect = e; item.multRect = e;
this.setItemMultRectByData(item, item.multRect); this.setItemMultRectByData(item, item.multRect);
} }
......
...@@ -38,7 +38,7 @@ export class MultRectComponent implements OnDestroy, OnChanges { ...@@ -38,7 +38,7 @@ export class MultRectComponent implements OnDestroy, OnChanges {
{name: 'red', color: '#ff0000'}, {name: 'red', color: '#ff0000'},
{name: 'green', color: '#00ff00'}, {name: 'green', color: '#00ff00'},
{name: 'blue', color: '#0000ff'}, {name: 'blue', color: '#0000ff'},
{name: 'yellow', color: '#ffff00'}, {name: 'black', color: '#000000'},
] ]
constructor(private appRef: ApplicationRef, private nzMessageService: NzMessageService) { constructor(private appRef: ApplicationRef, private nzMessageService: NzMessageService) {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment