diff --git a/src/app/working-area/working-area.component.ts b/src/app/working-area/working-area.component.ts index 5bf565a..09efe03 100644 --- a/src/app/working-area/working-area.component.ts +++ b/src/app/working-area/working-area.component.ts @@ -238,6 +238,20 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV } }); } + /** + * 根据id刷新图标 + * @param id 图标数据id + */ + public refreshIcon(id: string): void { + const icon = this.backgroundImage.children.find(item => item.name === id); + if (icon instanceof SinglePointIcon) { + icon.refresh(); + } else if (icon instanceof MultipointIcon) { + icon.refresh(); + } else if (icon instanceof PolygonIcon) { + icon.refresh(); + } + } /** * * @param value 缩放倍数 @@ -276,9 +290,6 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV const floorData = this.canvasData.originaleveryStoreyData.data; const buildingData = this.canvasData.originalcompanyBuildingData.data; const floor = this.canvasData.selectStorey; - console.log(this.canvasData.originaleveryStoreyData); - console.log(this.canvasData.originalcompanyBuildingData); - // // key=>属性名 data[key]=>属性值 Object.keys(floorData).forEach((key) => { switch (floorData[key].InteractiveMode) { @@ -575,6 +586,7 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV */ public setBackgroundScale(scale: number): void { this.backgroundImage.scale.set(scale); + this.emit('mouseWheel', this.backgroundImage.scale.x); } /** * 设置背景图角度 @@ -842,7 +854,7 @@ export class SinglePointIcon extends PIXI.Container { private text = new PIXI.Text(this.assetData.Name + '\r\n' + this.assetData.PropertyInfos.find(item => item.PropertyName === '名称/编号')?.PropertyValue, this.style); - + private image = PIXI.Sprite.from(this.assetData.ImageUrl); constructor(public assetData: any, private workingArea: WorkingAreaComponent) { super(); this.workingArea.backgroundImage.addChild(this); @@ -850,16 +862,16 @@ export class SinglePointIcon extends PIXI.Container { this.y = this.assetData.Point.y; this.name = this.assetData.Id; this.angle = this.assetData.Angle; - const singlePointIcon = PIXI.Sprite.from(this.assetData.ImageUrl); - singlePointIcon.x = 0; - singlePointIcon.y = 0; - singlePointIcon.width = this.assetData.Width; - singlePointIcon.height = this.assetData.Height; - - singlePointIcon.alpha = 1; - singlePointIcon.anchor.set(0.5); - singlePointIcon.interactive = true; - singlePointIcon + + this.image.x = 0; + this.image.y = 0; + this.image.width = this.assetData.Width; + this.image.height = this.assetData.Height; + + this.image.alpha = 1; + this.image.anchor.set(0.5); + this.image.interactive = true; + this.image .on('mousedown', event => { event.stopPropagation(); console.log(this.assetData); @@ -906,12 +918,12 @@ export class SinglePointIcon extends PIXI.Container { } }); - this.text.x = singlePointIcon.x; - this.text.y = singlePointIcon.y - singlePointIcon.height / 2; + this.text.x = this.image.x; + this.text.y = this.image.y - this.image.height / 2; this.text.anchor.set(0.5, 1); this.addChild(this.text); - this.addChild(singlePointIcon); + this.addChild(this.image); } // 设置名称 public setNameVisible(value: boolean, mode: GameMode) { @@ -919,6 +931,15 @@ export class SinglePointIcon extends PIXI.Container { this.text.visible = value; } } + // 刷新 + public refresh() { + this.image.width = this.assetData.Width; + this.image.height = this.assetData.Height; + this.angle = this.assetData.Angle; + this.text.text = this.assetData.Name + + '\r\n' + + this.assetData.PropertyInfos.find(item => item.PropertyName === '名称/编号')?.PropertyValue; + } } /** * 多点连线 @@ -1135,6 +1156,12 @@ export class MultipointIcon extends PIXI.Container { this.text.visible = value; } } + // + public refresh() { + this.text.text = this.assetData.Name + + '\r\n' + + this.assetData.PropertyInfos.find(item => item.PropertyName === '名称/编号')?.PropertyValue; + } } /** * 多边形 @@ -1349,6 +1376,18 @@ export class PolygonIcon extends PIXI.Container { this.text.visible = value; } } + public refresh() { + this.text.text = this.assetData.Name + + '\r\n' + + this.assetData.PropertyInfos.find(item => item.PropertyName === '名称/编号')?.PropertyValue; + // 填充多边形 + const color: number = this.assetData.Color.substring(0, 7).replace('#', '0x'); + const angle: number = parseInt(this.assetData.Color.substring(7), 16) / 255; + this.polygonGraphics.clear(); + this.polygonGraphics.beginFill(color, angle); + this.polygonGraphics.drawPolygon(this.getPoints()); + this.polygonGraphics.endFill(); + } } export class Line extends PIXI.Container {