shaojiahao
/
examSystem-Anxin
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity
Browse Source

[修正] 调整底图大小后会对计算适应缩放产生错误的计算

master
徐振升 4 years ago
parent
4f19a08c19
commit
7fecb604a2
1 changed files with 151 additions and 134 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 285
      src/app/working-area/working-area.component.ts

285
src/app/working-area/working-area.component.ts
Unescape View File

@ -158,7 +158,7 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
* RC版: 该版本已经相当成熟了，基本上不存在导致错误的BUG，与即将发行的正式版相差无几。
* Release版: 该版本意味“最终版本”，在前面版本的一系列测试版之后，终归会有一个正式版本，是最终交付用户使用的一个版本。该版本有时也称为标准版。一般情况下，Release不会以单词形式出现在软件封面上，取而代之的是符号®。
*/
public VERSION = '1.0.18.20210205_beta';
public VERSION = '1.0.20.20210207_beta';
/**
* 数据初始化
*/
@ -201,9 +201,9 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
if (this.allowEdit && this.canvasData.gameMode === axShape.assetData.GameMode) {
// 删除图例对象
const temp = this.backgroundImage.getChildByName('图例') as AxLegend;
if ( temp !== undefined
if (temp !== undefined
&& temp !== null
&& axShape.assetData.Name !== '图例') {
&& axShape.assetData.Name !== '图例') {
const itemLegend = new Legend(axShape.assetData.Name, axShape.assetData.ImageUrl, 1);
temp.deleteItem(itemLegend);
}
@ -241,15 +241,15 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
sayHello() {
let _a;
if (navigator.userAgent.toLowerCase().indexOf('chrome') > -1) {
const args = [
'\n %c 版本号 - ' + this.VERSION + '\n',
'color: #ff66a5; background: #000000; padding:5px 0;',
];
(_a = window.console).log.apply(_a, args);
const args = [
'\n %c 版本号 - ' + this.VERSION + '\n',
'color: #ff66a5; background: #000000; padding:5px 0;',
];
(_a = window.console).log.apply(_a, args);
} else if (window.console) {
window.console.log('\n %c 版本号 - ' + this.VERSION + '\n');
window.console.log('\n %c 版本号 - ' + this.VERSION + '\n');
}
}
}
/**
* 页面初始化
*/
@ -305,8 +305,8 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
public resizeItem(size: number) {
this.backgroundImage.children.forEach(item => {
if (item instanceof AxShape) {
item.setItemScale(size);
item.drawBorder(size);
item.setItemScale(size);
item.drawBorder(size);
}
});
}
@ -353,18 +353,18 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
this.camera2D
.clamp({
left: -10000,
right: 10000,
top: -10000,
bottom: 10000,
})
left: -10000,
right: 10000,
top: -10000,
bottom: 10000,
})
.drag()
.pinch()
.wheel()
.clampZoom({
minScale: 0.12,
maxScale: 16,
})
minScale: 0.12,
maxScale: 16,
})
.decelerate();
this.camera2D.on('wheel', event => {
@ -373,7 +373,7 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
this.camera2D.on('pointerdown', event => {
if (this.isCtrlKeyClicked === true
&& event.data.button === 0) {
&& event.data.button === 0) {
this.rectToolGraphics.visible = true;
this.initialScreenMousePos = this.backgroundImage.toLocal(this.mousePosition);
this.finalScreenMousePos = this.backgroundImage.toLocal(this.mousePosition);
@ -384,7 +384,7 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
this.rectToolGraphics.visible = false;
const shapes: AxShape[] = [];
this.backgroundImage.children.forEach(item => {
if ( item instanceof AxShape
if (item instanceof AxShape
&& item instanceof AxPreviewImageShape === false) {
// 判断2个矩形是否相交
const rect1 = this.rectToolGraphics.getBounds();
@ -403,7 +403,7 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
this.rectToolGraphics.visible = false;
const shapes: AxShape[] = [];
this.backgroundImage.children.forEach(item => {
if ( item instanceof AxShape
if (item instanceof AxShape
&& item instanceof AxPreviewImageShape === false) {
// 判断2个矩形是否相交
const rect1 = this.rectToolGraphics.getBounds();
@ -419,7 +419,7 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
});
this.camera2D.on('pointermove', event => {
if (this.isCtrlKeyClicked === true
&& this.rectToolGraphics.visible === true) {
&& this.rectToolGraphics.visible === true) {
this.finalScreenMousePos = this.backgroundImage.toLocal(this.mousePosition);
const init = this.initialScreenMousePos;
@ -468,8 +468,8 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
* 缩放适应
*/
public zoomFit() {
const imageWidth = this.backgroundImage.texture.width;
const imageHeight = this.backgroundImage.texture.height;
const imageWidth = this.backgroundImage.width;
const imageHeight = this.backgroundImage.height;
const appWidth = this.app.view.width - 470;
const appHeight = this.app.view.height;
const wScale = appWidth / imageWidth;
@ -561,9 +561,9 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
}
}
const temp = this.backgroundImage.getChildByName('图例') as AxLegend;
if ( temp !== undefined
if (temp !== undefined
&& temp !== null
&& axShape.assetData.Name !== '图例') {
&& axShape.assetData.Name !== '图例') {
const itemLegend = new Legend(axShape.assetData.Name, axShape.assetData.ImageUrl, 1);
temp.addItem(itemLegend);
}
@ -660,7 +660,7 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
wall.allowEdit = this.allowEdit && this.canvasData.gameMode === wall.assetData.GameMode;
}
break;
}
}
});
// this.emit('backgroundScale', this.backgroundImage.scale.x);
}
@ -689,7 +689,7 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
const pipeline = new AxArrowConnector(nodeData[key][tempKey], this, false, true);
pipeline.allowEdit = this.allowEdit && this.canvasData.gameMode === pipeline.assetData.GameMode;
break;
}
}
});
});
}
@ -701,7 +701,7 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
this.enterPaintEndButton.width = 60;
this.enterPaintEndButton.height = 60;
this.enterPaintEndButton.anchor.set(0.5);
this.enterPaintEndButton.position = new PIXI.Point(0, 0);
this.enterPaintEndButton.position = new PIXI.Point(0, 0);
this.enterPaintEndButton.interactive = true;
this.enterPaintEndButton.buttonMode = true;
this.enterPaintEndButton
@ -737,7 +737,7 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
list.push(property);
});
const assetData = {
const assetData = {
TemplateId: this.canvasData.selectTemplateData.id,
CanConnect: this.canvasData.selectTemplateData.canConnect,
Pipelines: new Array(),
@ -748,19 +748,19 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
FillMode: this.canvasData.selectTemplateData.fillMode,
FireElementId: this.canvasData.selectTemplateData.fireElementId,
FixedSize: this.canvasData.selectTemplateData.fixedSize,
Height : 32,
Width : 32,
Height: 32,
Width: 32,
Id: ObjectID.default.generate(),
ImageUrl: this.canvasData.selectTemplateData.imageUrl,
InteractiveMode: this.canvasData.selectTemplateData.interactiveMode,
MultiPoint : null,
MultiPoint: null,
Point: new PIXI.Point(this.previewImage.x, this.previewImage.y),
Name : this.canvasData.selectTemplateData.name,
Name: this.canvasData.selectTemplateData.name,
PropertyInfos: list,
Border : this.canvasData.selectTemplateData.border,
DrawMode : this.canvasData.selectTemplateData.drawMode,
Thickness : this.canvasData.selectTemplateData.thickness,
IsFromBuilding : this.canvasData.selectTemplateData.isFromBuilding,
Border: this.canvasData.selectTemplateData.border,
DrawMode: this.canvasData.selectTemplateData.drawMode,
Thickness: this.canvasData.selectTemplateData.thickness,
IsFromBuilding: this.canvasData.selectTemplateData.isFromBuilding,
GameMode: this.canvasData.gameMode,
Tag: this.canvasData.selectTemplateData.tag
};
@ -860,61 +860,61 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
// this.paintingShape.refresh();
// }
// } else {
this.previewLineSegment.visible = true;
this.enterPaintEndButton.position = this.circleShadow.position;
this.enterPaintEndButton.visible = true;
this.enterPaintEndButton.zIndex = this.backgroundImage.children.length;
this.currentClickPoint.position = new PIXI.Point(this.circleShadow.x, this.circleShadow.y);
this.paintPoints.push(new PIXI.Point(this.circleShadow.x, this.circleShadow.y));
if (this.paintPoints.length < 2) {
return;
}
if (this.paintingShape === null) {
const jsonObject = JSON.parse(JSON.stringify(this.canvasData.selectTemplateData.propertyInfos));
const propertyList = [];
jsonObject.forEach(element => {
const property = new PropertyInfo(element);
propertyList.push(property);
});
const assetData2 = {
TemplateId: this.canvasData.selectTemplateData.id,
FloorId: this.canvasData.selectStorey.id,
Angle: this.canvasData.selectTemplateData.angle,
Color: this.canvasData.selectTemplateData.color,
Enabled: this.canvasData.selectTemplateData.enabled,
FillMode: this.canvasData.selectTemplateData.fillMode,
FireElementId: this.canvasData.selectTemplateData.fireElementId,
FixedSize: this.canvasData.selectTemplateData.fixedSize,
Height: 32,
Width: 32,
Id: ObjectID.default.generate(),
ImageUrl: this.canvasData.selectTemplateData.imageUrl,
InteractiveMode: this.canvasData.selectTemplateData.interactiveMode,
MultiPoint: JSON.parse(JSON.stringify(this.paintPoints)),
Point: new PIXI.Point(0, 0),
Name: this.canvasData.selectTemplateData.name,
PropertyInfos: propertyList,
Border: this.canvasData.selectTemplateData.border,
DrawMode: this.canvasData.selectTemplateData.drawMode,
Thickness: this.canvasData.selectTemplateData.thickness,
IsFromBuilding: this.canvasData.selectTemplateData.isFromBuilding,
GameMode: this.canvasData.gameMode,
Tag: this.canvasData.selectTemplateData.tag
};
if (this.canvasData.selectTemplateData.name === '距离') {
this.paintingShape = new AxArrowConnector(assetData2, this, true, true);
} else if (this.canvasData.selectTemplateData.name === '普通墙' || this.canvasData.selectTemplateData.name === '承重墙') {
this.paintingShape = new AxArrowConnector(assetData2, this, false, false);
} else if (this.canvasData.selectTemplateData.name === '水带' ) {
this.paintingShape = new AxArrowConnector(assetData2, this, false, true);
}
} else {
this.paintingShape.assetData.MultiPoint = JSON.parse(JSON.stringify(this.paintPoints));
this.paintingShape.redraw();
this.previewLineSegment.visible = true;
this.enterPaintEndButton.position = this.circleShadow.position;
this.enterPaintEndButton.visible = true;
this.enterPaintEndButton.zIndex = this.backgroundImage.children.length;
this.currentClickPoint.position = new PIXI.Point(this.circleShadow.x, this.circleShadow.y);
this.paintPoints.push(new PIXI.Point(this.circleShadow.x, this.circleShadow.y));
if (this.paintPoints.length < 2) {
return;
}
if (this.paintingShape === null) {
const jsonObject = JSON.parse(JSON.stringify(this.canvasData.selectTemplateData.propertyInfos));
const propertyList = [];
jsonObject.forEach(element => {
const property = new PropertyInfo(element);
propertyList.push(property);
});
const assetData2 = {
TemplateId: this.canvasData.selectTemplateData.id,
FloorId: this.canvasData.selectStorey.id,
Angle: this.canvasData.selectTemplateData.angle,
Color: this.canvasData.selectTemplateData.color,
Enabled: this.canvasData.selectTemplateData.enabled,
FillMode: this.canvasData.selectTemplateData.fillMode,
FireElementId: this.canvasData.selectTemplateData.fireElementId,
FixedSize: this.canvasData.selectTemplateData.fixedSize,
Height: 32,
Width: 32,
Id: ObjectID.default.generate(),
ImageUrl: this.canvasData.selectTemplateData.imageUrl,
InteractiveMode: this.canvasData.selectTemplateData.interactiveMode,
MultiPoint: JSON.parse(JSON.stringify(this.paintPoints)),
Point: new PIXI.Point(0, 0),
Name: this.canvasData.selectTemplateData.name,
PropertyInfos: propertyList,
Border: this.canvasData.selectTemplateData.border,
DrawMode: this.canvasData.selectTemplateData.drawMode,
Thickness: this.canvasData.selectTemplateData.thickness,
IsFromBuilding: this.canvasData.selectTemplateData.isFromBuilding,
GameMode: this.canvasData.gameMode,
Tag: this.canvasData.selectTemplateData.tag
};
if (this.canvasData.selectTemplateData.name === '距离') {
this.paintingShape = new AxArrowConnector(assetData2, this, true, true);
} else if (this.canvasData.selectTemplateData.name === '普通墙' || this.canvasData.selectTemplateData.name === '承重墙') {
this.paintingShape = new AxArrowConnector(assetData2, this, false, false);
} else if (this.canvasData.selectTemplateData.name === '水带') {
this.paintingShape = new AxArrowConnector(assetData2, this, false, true);
}
} else {
this.paintingShape.assetData.MultiPoint = JSON.parse(JSON.stringify(this.paintPoints));
this.paintingShape.redraw();
}
// }
// this.emit('backgroundScale', this.backgroundImage.scale.x);
break;
break;
}
}
// else if (this.isCtrlKeyClicked === true) {
@ -934,13 +934,13 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
})
.on('pointerover', (event) => {
if (this.previewImage !== null
&& this.paintMode === PaintMode.singlePointIcon) {
&& this.paintMode === PaintMode.singlePointIcon) {
this.previewImage.visible = true;
}
})
.on('pointerout', (event) => {
if (this.previewImage !== null
&& this.paintMode === PaintMode.singlePointIcon) {
&& this.paintMode === PaintMode.singlePointIcon) {
this.previewImage.visible = false;
}
});
@ -974,26 +974,43 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
/**
* 刷新背景图
*/
public async refreshBackgroundImage(imageUrl: string = this.canvasData.selectStorey.imageUrl, imageAngle: number = this.canvasData.selectStorey.imageAngle): Promise<void> {
public async refreshBackgroundImage(
imageUrl: string = this.canvasData.selectStorey.imageUrl,
imageAngle: number = this.canvasData.selectStorey.imageAngle,
imageWidth: number = this.canvasData.selectStorey.imageWidth,
imageHeight: number = this.canvasData.selectStorey.imageHeight,
): Promise<void> {
if (imageAngle === undefined || imageAngle === null) {
imageAngle = 0;
}
this.backgroundImage.scale.set(1);
// this.backgroundImage.pivot.set(0);
if (imageUrl === undefined || imageUrl === null || imageUrl === '') {
this.backgroundImage.texture = this.backgroundTexture;
} else {
this.backgroundImage.texture = await PIXI.Texture.fromURL(imageUrl);
}
this.backgroundImage.angle = imageAngle;
if (imageWidth !== undefined
&& imageWidth !== null
&& imageWidth !== 0
&& imageHeight !== undefined
&& imageHeight !== null
&& imageHeight !== 0) {
console.log(imageWidth, imageHeight);
this.backgroundImage.width = imageWidth;
this.backgroundImage.height = imageHeight;
} else {
this.backgroundImage.width = this.backgroundImage.texture.width;
this.backgroundImage.height = this.backgroundImage.texture.height;
}
this.backgroundImage.x = this.backgroundImage.width / 2;
this.backgroundImage.y = this.backgroundImage.height / 2;
this.backgroundImage.angle = imageAngle;
this.resetCamera2D();
// this.backgroundImage.children.forEach((item) => {
// if (item instanceof AxShape) {
// item.refresh();
// }
// });
}
/**
* 刷新
@ -1007,7 +1024,7 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
const itemList = [];
this.backgroundImage.children.forEach(item => {
if (item instanceof AxShape && item instanceof AxPreviewImageShape === false) {
itemList.push(item.name);
itemList.push(item.name);
}
});
@ -1037,7 +1054,7 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
const itemList = [];
this.backgroundImage.children.forEach(item => {
if (item instanceof AxShape && item instanceof AxPreviewImageShape === false) {
itemList.push(item.name);
itemList.push(item.name);
}
});
@ -1077,17 +1094,17 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
GameMode: this.canvasData.gameMode,
PropertyInfos: [
{
Tag : '',
Order : 0,
Enabled : true,
Visible : true,
Required : false,
RuleName : '',
RuleValue : '',
PhysicalUnit : '',
PropertyName : '列',
PropertyType : 2,
PropertyValue : 2,
Tag: '',
Order: 0,
Enabled: true,
Visible: true,
Required: false,
RuleName: '',
RuleValue: '',
PhysicalUnit: '',
PropertyName: '列',
PropertyType: 2,
PropertyValue: 2,
},
],
Scale: 1,
@ -1102,10 +1119,10 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
} else {
if (item !== '图例') {
shapeMap.set(this.canvasData.originaleveryStoreyData.data[item].Name, new Legend(
this.canvasData.originaleveryStoreyData.data[item].Name,
this.canvasData.originaleveryStoreyData.data[item].ImageUrl,
1
));
this.canvasData.originaleveryStoreyData.data[item].Name,
this.canvasData.originaleveryStoreyData.data[item].ImageUrl,
1
));
} else {
data = this.canvasData.originaleveryStoreyData.data[item];
}
@ -1172,7 +1189,7 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
this.previewLineSegment.clear();
this.previewLineSegment.lineStyle(1 / this.backgroundImage.scale.x, 0x00ff00, 1);
this.previewLineSegment.moveTo(pointA.x, pointA.y);
this.previewLineSegment.lineTo(pointB.x, pointB.y );
this.previewLineSegment.lineTo(pointB.x, pointB.y);
}
/**
* 创建半径图标影子
@ -1249,7 +1266,7 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
this.previewImage.visible = false;
}
// 重置组件状态
if ( this.paintingIcon !== undefined
if (this.paintingIcon !== undefined
&& this.paintingIcon !== null) {
this.backgroundImage.removeChild(this.paintingIcon);
}
@ -1333,9 +1350,9 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
}
break;
case PaintMode.Pipeline:
this.emit('createIcon', this.paintingShape);
this.paintingShape = null;
break;
this.emit('createIcon', this.paintingShape);
this.paintingShape = null;
break;
}
this.paintPoints.splice(0, this.paintPoints.length);
}
@ -1343,11 +1360,11 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
* 复制
*/
public copy(): void {
this.copyData = [];
this.selection.all().forEach(item => {
const newData = JSON.parse(JSON.stringify(item.assetData));
this.copyData.push(newData);
});
this.copyData = [];
this.selection.all().forEach(item => {
const newData = JSON.parse(JSON.stringify(item.assetData));
this.copyData.push(newData);
});
}
/**
* 粘贴
@ -1359,7 +1376,7 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
item.Point = new PIXI.Point(item.Point.x + 5, item.Point.y + 5);
const newData = JSON.parse(JSON.stringify(item));
newData.Id = ObjectID.default.generate(),
newData.CompanyId = companyId;
newData.CompanyId = companyId;
newData.BuildingId = buildingId;
newData.FloorId = floorId;
newData.Point = new PIXI.Point(item.Point.x + 5, item.Point.y + 5);
@ -1417,7 +1434,7 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
const itemList = [];
this.backgroundImage.children.forEach(item => {
if (item instanceof AxShape && item instanceof AxPreviewImageShape === false) {
itemList.push(item.name);
itemList.push(item.name);
}
});
@ -1446,7 +1463,7 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
const itemList = [];
this.backgroundImage.children.forEach(item => {
if (item instanceof AxShape && item instanceof AxPreviewImageShape === false) {
itemList.push(item.name);
itemList.push(item.name);
}
});
@ -1474,7 +1491,7 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
const itemList = [];
this.backgroundImage.children.forEach(item => {
if (item instanceof AxShape && item instanceof AxPreviewImageShape === false) {
itemList.push(item.name);
itemList.push(item.name);
}
});
@ -1532,7 +1549,7 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
this.selection.addArray(shape);
this.selection.all().forEach(item => {
this.setSelectEffect(item);
});
});
AxMessageSystem.send(EVENT_SELECTION_CHANGED);
}
}
@ -1549,7 +1566,7 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
}
this.selection.addArray(shape);
this.selection.all().forEach(item => {
this.setSelectEffect(item);
this.setSelectEffect(item);
});
AxMessageSystem.send(EVENT_SELECTION_CHANGED);
}

Write Preview
Loading…
Cancel
Save