diff --git a/src/app/working-area/model/multipointIcon.ts b/src/app/working-area/model/multipointIcon.ts index 6ac0fc1..a996b5f 100644 --- a/src/app/working-area/model/multipointIcon.ts +++ b/src/app/working-area/model/multipointIcon.ts @@ -48,6 +48,8 @@ export class MultipointIcon extends AxShape { this.text.visible = this.showName; this.text.angle = -this.workingArea.backgroundImage.angle; this.addChild(this.text); + this.assetData.Thickness = this.assetData.Thickness === 0 ? 32: this.assetData.Thickness; + var tileScale = this.assetData.Thickness/64; // 画线图标 for (let i = 0, count = this.pointsData.length - 1; i < count; i++) { const pointA = this.pointsData[i]; @@ -58,15 +60,17 @@ export class MultipointIcon extends AxShape { const b = pointB.y - pointA.y; const distance = Math.sqrt(a * a + b * b); - const icon = new PIXI.TilingSprite(PIXI.Texture.from(this.assetData.ImageUrl), distance, 64); + const icon = new PIXI.TilingSprite(PIXI.Texture.from(this.assetData.ImageUrl), distance, this.assetData.Thickness); + icon.tileScale.set(tileScale); icon.anchor.set(0, 0.5); icon.x = pointA.x; icon.y = pointA.y; icon.angle = angle; - icon.scale.set(1,this.assetData.Thickness === 0 ? 32/64 : this.assetData.Thickness/64); this.iconsTilingSprite.push(icon); this.addChild(icon); this.text.position = this.getLineCenter(this.pointsData[0], this.pointsData[1]); + // 等距等分 + this.tileDistanceEqual(icon); } this.sortableChildren = true; this.text.zIndex = this.pointsData.length; @@ -128,6 +132,8 @@ export class MultipointIcon extends AxShape { const distance = Math.sqrt(a * a + b * b); this.iconsTilingSprite[index].angle = angle; this.iconsTilingSprite[index].width = distance; + + this.tileDistanceEqual(this.iconsTilingSprite[index]); } else if (index < array.length - 1) {// 不是第一个点,也不是最后一个点 this.iconsTilingSprite[index].x = newPosition.x; this.iconsTilingSprite[index].y = newPosition.y; @@ -143,12 +149,16 @@ export class MultipointIcon extends AxShape { this.iconsTilingSprite[index].angle = angle; this.iconsTilingSprite[index].width = distance; + this.tileDistanceEqual(this.iconsTilingSprite[index]); + const angleC = Math.atan2((pointA.y - pointC.y), (pointA.x - pointC.x)) * (180 / Math.PI); const aC = pointA.x - pointC.x; const bC = pointA.y - pointC.y; const distanceC = Math.sqrt(aC * aC + bC * bC); this.iconsTilingSprite[index - 1].angle = angleC; this.iconsTilingSprite[index - 1].width = distanceC; + + this.tileDistanceEqual(this.iconsTilingSprite[index - 1]); } else if (index === array.length - 1) { // 最后一个点 const pointA = array[index]; // 当前点 const pointC = array[index - 1]; // 前一个点 @@ -159,6 +169,8 @@ export class MultipointIcon extends AxShape { const distanceC = Math.sqrt(aC * aC + bC * bC); this.iconsTilingSprite[index - 1].angle = angleC; this.iconsTilingSprite[index - 1].width = distanceC; + + this.tileDistanceEqual(this.iconsTilingSprite[index - 1]); } this.drawBorder(1 / this.workingArea.backgroundImage.scale.x); this.text.position = this.getLineCenter(this.pointsData[0], this.pointsData[1]); @@ -192,12 +204,28 @@ export class MultipointIcon extends AxShape { } // 刷新数据 public refresh() { - this.iconsTilingSprite.forEach(element => { - element.scale.set(1,this.assetData.Thickness === 0 ? 32/64 : this.assetData.Thickness/64); + this.assetData.Thickness = this.assetData.Thickness === 0 ? 32: this.assetData.Thickness; + this.iconsTilingSprite.forEach(item => { + // 厚度优化 + this.tileDistanceEqual(item); }); this.text.text = this.assetData.Name + '\r\n' + this.assetData.PropertyInfos.find(item => item.PropertyName === '名称/编号')?.PropertyValue; this.text.angle = -this.workingArea.backgroundImage.angle; } + + // 等距等分 + public tileDistanceEqual(icon: PIXI.TilingSprite) { + icon.height = this.assetData.Thickness; + var tileScale = this.assetData.Thickness / 64; + icon.tileScale.set(tileScale); + console.log(tileScale); + var tileWidth = tileScale * 64; + var tileCount = Math.ceil(icon.width / tileWidth); + tileWidth = icon.width / tileCount; + tileScale = tileWidth / 64; + console.log(tileScale); + icon.tileScale.set(tileScale); + } }