|
|
|
@ -20,165 +20,169 @@ export class WorkingAreaComponent implements OnInit, AfterViewInit {
|
|
|
|
|
loader = PIXI.Loader.shared; |
|
|
|
|
// 根目录
|
|
|
|
|
backgroundImage: PIXI.Sprite; |
|
|
|
|
// 影子
|
|
|
|
|
shadow = new PIXI.Sprite(); |
|
|
|
|
// 影子圆形
|
|
|
|
|
shadowCircle = new PIXI.Graphics(); |
|
|
|
|
// 单点图标影子
|
|
|
|
|
singlePointIconShadow = new PIXI.Sprite(); |
|
|
|
|
// 线图标影子
|
|
|
|
|
lineIconShadow = new PIXI.Graphics(); |
|
|
|
|
// 圆形影子
|
|
|
|
|
circleShadow = new PIXI.Graphics(); |
|
|
|
|
// 鼠标位置
|
|
|
|
|
mousePosition; |
|
|
|
|
// 初始化
|
|
|
|
|
mousePosition: PIXI.Point; |
|
|
|
|
/// 绘画模式
|
|
|
|
|
paintMode: PaintMode; |
|
|
|
|
|
|
|
|
|
ngOnInit(): void { |
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
// 页面初始化之后
|
|
|
|
|
|
|
|
|
|
ngAfterViewInit(): void { |
|
|
|
|
setTimeout(() => { |
|
|
|
|
this.init(); |
|
|
|
|
this.createCanvas(); |
|
|
|
|
}, 0); |
|
|
|
|
} |
|
|
|
|
// 鼠标滑动事件
|
|
|
|
|
mouseWheelHandel(event) { |
|
|
|
|
/// <summary>
|
|
|
|
|
/// 鼠标滑动事件
|
|
|
|
|
/// <summary>
|
|
|
|
|
public mouseWheelHandel(event) { |
|
|
|
|
const delX = this.mousePosition.x - this.backgroundImage.position.x; |
|
|
|
|
const delY = this.mousePosition.y - this.backgroundImage.position.y; |
|
|
|
|
const scaleX = delX / this.backgroundImage.width; |
|
|
|
|
const scaleY = delY / this.backgroundImage.height; |
|
|
|
|
const pivot = this.backgroundImage.toLocal(this.mousePosition); |
|
|
|
|
const delta = Math.max(-1, Math.min(1, (event.wheelDelta || -event.detail))); |
|
|
|
|
|
|
|
|
|
if (delta > 0) { |
|
|
|
|
if (this.backgroundImage.scale.x >= 32) { |
|
|
|
|
this.backgroundImage.scale.x = 32; |
|
|
|
|
return; |
|
|
|
|
} |
|
|
|
|
this.backgroundImage.pivot.set(pivot.x, pivot.y); |
|
|
|
|
|
|
|
|
|
this.backgroundImage.scale.x += this.backgroundImage.scale.x * 0.1; |
|
|
|
|
this.backgroundImage.scale.y += this.backgroundImage.scale.y * 0.1; |
|
|
|
|
this.backgroundImage.anchor.x += scaleX; |
|
|
|
|
this.backgroundImage.anchor.y += scaleY; |
|
|
|
|
|
|
|
|
|
this.backgroundImage.position.x += delX; |
|
|
|
|
this.backgroundImage.position.y += delY; |
|
|
|
|
this.backgroundImage.children.forEach(item => { |
|
|
|
|
console.log(item.position); |
|
|
|
|
}); |
|
|
|
|
} else if (delta < 0) { |
|
|
|
|
if (this.backgroundImage.scale.x <= 0.1) { |
|
|
|
|
this.backgroundImage.scale.y = 0.1; |
|
|
|
|
return; |
|
|
|
|
} |
|
|
|
|
this.backgroundImage.pivot.set(pivot.x, pivot.y); |
|
|
|
|
|
|
|
|
|
this.backgroundImage.scale.x -= this.backgroundImage.scale.x * 0.1; |
|
|
|
|
this.backgroundImage.scale.y -= this.backgroundImage.scale.y * 0.1; |
|
|
|
|
this.backgroundImage.anchor.x += scaleX; |
|
|
|
|
this.backgroundImage.anchor.y += scaleY; |
|
|
|
|
|
|
|
|
|
this.backgroundImage.position.x += delX; |
|
|
|
|
this.backgroundImage.position.y += delY; |
|
|
|
|
this.backgroundImage.children.forEach(item => { |
|
|
|
|
console.log(item.position); |
|
|
|
|
}); |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
// 测试按钮
|
|
|
|
|
init() { |
|
|
|
|
this.createCanvas(); |
|
|
|
|
this.createBackgroundImage('https://qntemp3.bejson.com/upload/24797865631586900.jpg?imageView2/0/w/0/h/0/format/webp'); |
|
|
|
|
this.createShadowIcon('https://qntemp3.bejson.com/upload/24797865631586900.jpg?imageView2/0/w/100/h/100/format/webp'); |
|
|
|
|
this.setShadowVisible(false); |
|
|
|
|
} |
|
|
|
|
// 创建画布
|
|
|
|
|
createCanvas(): void { |
|
|
|
|
/// <summary>
|
|
|
|
|
/// 创建画布
|
|
|
|
|
/// <summary>
|
|
|
|
|
private createCanvas(): void { |
|
|
|
|
this.app = new PIXI.Application({ |
|
|
|
|
width: this.content.nativeElement.clientWidth, |
|
|
|
|
height: this.content.nativeElement.clientHeight, |
|
|
|
|
antialias: true, |
|
|
|
|
transparent: false, |
|
|
|
|
resolution: 1, |
|
|
|
|
backgroundColor: 0x1099bb |
|
|
|
|
backgroundColor: 0x1099bb// 0xffffff
|
|
|
|
|
}); |
|
|
|
|
this.content.nativeElement.appendChild(this.app.view); |
|
|
|
|
|
|
|
|
|
this.createBackgroundImage(); |
|
|
|
|
this.createSinglePointIconShadow(); |
|
|
|
|
this.createLineIconShadow(); |
|
|
|
|
|
|
|
|
|
this.app.ticker.add((delta) => { |
|
|
|
|
this.mousePosition = this.app.renderer.plugins.interaction.mouse.global; |
|
|
|
|
this.shadow.position = this.mousePosition; |
|
|
|
|
this.shadowCircle.position = this.mousePosition; |
|
|
|
|
}); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
// setIcon() {
|
|
|
|
|
// const defaultIcon = 'url(\'assets/images/avatar.jpg\'),auto';
|
|
|
|
|
// this.app.renderer.plugins.interaction.cursorStyles.default = defaultIcon;
|
|
|
|
|
// }
|
|
|
|
|
// // 加载资源
|
|
|
|
|
// LoadAsset(name: string, path: string) {
|
|
|
|
|
// this.loader.onProgress.add(() => {
|
|
|
|
|
// console.log(this.loader.progress);
|
|
|
|
|
// }); // called once per loaded/errored file
|
|
|
|
|
// this.loader.onError.add(() => { }); // called once per errored file
|
|
|
|
|
// this.loader.onLoad.add(() => { }); // called once per loaded file
|
|
|
|
|
// this.loader.onComplete.add(() => {
|
|
|
|
|
// alert('aaaaaaaa');
|
|
|
|
|
// }); // called once when the queued resources all load.
|
|
|
|
|
// this.loader.add(name, path);
|
|
|
|
|
// }
|
|
|
|
|
|
|
|
|
|
this.singlePointIconShadow.position = this.mousePosition; |
|
|
|
|
this.circleShadow.position = this.mousePosition; |
|
|
|
|
|
|
|
|
|
// 创建单点图标
|
|
|
|
|
createSprite(source: string, x: number, y: number, width: number, height: number, alpha: number): PIXI.Sprite { |
|
|
|
|
const sprite = PIXI.Sprite.from(source); |
|
|
|
|
sprite.x = x; |
|
|
|
|
sprite.y = y; |
|
|
|
|
sprite.width = width; |
|
|
|
|
sprite.height = height; |
|
|
|
|
sprite.alpha = alpha; |
|
|
|
|
sprite.anchor.set(0.5); |
|
|
|
|
sprite.interactive = true; |
|
|
|
|
sprite.buttonMode = true; |
|
|
|
|
sprite |
|
|
|
|
.on('pointerdown', this.onDragStart) |
|
|
|
|
.on('pointerup', this.onDragEnd) |
|
|
|
|
.on('pointerupoutside', this.onDragEnd) |
|
|
|
|
.on('pointermove', this.onDragMove); |
|
|
|
|
this.app.stage.addChild(sprite); |
|
|
|
|
sprite.setParent(this.backgroundImage); |
|
|
|
|
return sprite; |
|
|
|
|
} |
|
|
|
|
// 拖动开始
|
|
|
|
|
onDragStart(event) { |
|
|
|
|
event.currentTarget.data = event.data; |
|
|
|
|
event.currentTarget.alpha = 0.5; |
|
|
|
|
event.currentTarget.dragging = true; |
|
|
|
|
} |
|
|
|
|
// 拖动结束
|
|
|
|
|
onDragEnd(event) { |
|
|
|
|
event.currentTarget.alpha = 1; |
|
|
|
|
event.currentTarget.dragging = false; |
|
|
|
|
event.currentTarget.data = null; |
|
|
|
|
// this.lineIconShadow.clear();
|
|
|
|
|
// this.lineIconShadow.lineStyle(1, 0xffd900, 1);
|
|
|
|
|
// this.lineIconShadow.lineTo(100, 100);
|
|
|
|
|
}); |
|
|
|
|
} |
|
|
|
|
// 拖动移动
|
|
|
|
|
onDragMove(event) { |
|
|
|
|
if (event.currentTarget.dragging) { |
|
|
|
|
/// <summary>
|
|
|
|
|
/// 创建单点图标
|
|
|
|
|
/// <summary>
|
|
|
|
|
private createSinglePointIcon(source: PIXI.Texture, x: number, y: number, width: number, height: number, alpha: number): PIXI.Sprite { |
|
|
|
|
const singlePointIcon = new PIXI.Sprite(source); |
|
|
|
|
singlePointIcon.x = x; |
|
|
|
|
singlePointIcon.y = y; |
|
|
|
|
singlePointIcon.width = width; |
|
|
|
|
singlePointIcon.height = height; |
|
|
|
|
singlePointIcon.alpha = alpha; |
|
|
|
|
singlePointIcon.anchor.set(0.5); |
|
|
|
|
singlePointIcon.interactive = true; |
|
|
|
|
singlePointIcon |
|
|
|
|
.on('mousedown', event => { |
|
|
|
|
event.stopPropagation(); |
|
|
|
|
console.log(event); |
|
|
|
|
event.currentTarget.data = event.data; |
|
|
|
|
event.currentTarget.alpha = 0.5; |
|
|
|
|
event.currentTarget.dragging = true; |
|
|
|
|
}) |
|
|
|
|
.on('mouseup', event => { |
|
|
|
|
event.currentTarget.alpha = 1; |
|
|
|
|
event.currentTarget.dragging = false; |
|
|
|
|
event.currentTarget.data = null; |
|
|
|
|
}) |
|
|
|
|
.on('mouseupoutside', event => { |
|
|
|
|
event.currentTarget.alpha = 1; |
|
|
|
|
event.currentTarget.dragging = false; |
|
|
|
|
event.currentTarget.data = null; |
|
|
|
|
}) |
|
|
|
|
.on('mousemove', event => { |
|
|
|
|
if (event.currentTarget.dragging) { |
|
|
|
|
const newPosition = event.currentTarget.data.getLocalPosition(event.currentTarget.parent); |
|
|
|
|
event.currentTarget.x = newPosition.x; |
|
|
|
|
event.currentTarget.y = newPosition.y; |
|
|
|
|
} |
|
|
|
|
}) |
|
|
|
|
.on('rightclick', event => { |
|
|
|
|
|
|
|
|
|
}); |
|
|
|
|
this.backgroundImage.addChild(singlePointIcon); |
|
|
|
|
return singlePointIcon; |
|
|
|
|
} |
|
|
|
|
// 加载精灵图
|
|
|
|
|
SetupSprite(name: string) { |
|
|
|
|
const sprite = new PIXI.Sprite( |
|
|
|
|
this.loader.resources[name].texture |
|
|
|
|
); |
|
|
|
|
} |
|
|
|
|
// 画圆
|
|
|
|
|
DrawCircle(x: number): void { |
|
|
|
|
this.shadowCircle.beginFill(0xFFCC5A); |
|
|
|
|
this.shadowCircle.drawCircle(0, 0, x); |
|
|
|
|
this.app.stage.addChild(this.shadowCircle); |
|
|
|
|
/// <>
|
|
|
|
|
/// 多点连线
|
|
|
|
|
/// <>
|
|
|
|
|
private createLineIcon(source: PIXI.Texture, x: number, y: number, points: PIXI.Point[]) { |
|
|
|
|
const container = new PIXI.Container(); |
|
|
|
|
container.x = x; |
|
|
|
|
container.y = y; |
|
|
|
|
points.forEach(item => { |
|
|
|
|
const icon = new PIXI.TilingSprite(source, 100, 64); |
|
|
|
|
icon.anchor.set(0, 0.5); |
|
|
|
|
icon.x = item.x; |
|
|
|
|
icon.y = item.y; |
|
|
|
|
container.addChild(icon); |
|
|
|
|
|
|
|
|
|
const iconPoint = new PIXI.Graphics(); |
|
|
|
|
iconPoint.lineStyle(0); |
|
|
|
|
iconPoint.beginFill(0xFFFF0B, 1); |
|
|
|
|
iconPoint.drawCircle(item.x, item.y, 15); |
|
|
|
|
iconPoint.endFill(); |
|
|
|
|
container.addChild(iconPoint); |
|
|
|
|
}); |
|
|
|
|
this.backgroundImage.addChild(container); |
|
|
|
|
} |
|
|
|
|
// 创建背景图
|
|
|
|
|
createBackgroundImage(source: string): void { |
|
|
|
|
this.backgroundImage = PIXI.Sprite.from(source); |
|
|
|
|
/// <summary>
|
|
|
|
|
/// 创建背景图
|
|
|
|
|
/// <summary>
|
|
|
|
|
private createBackgroundImage(): void { |
|
|
|
|
this.backgroundImage = PIXI.Sprite.from('assets/images/noImg.png'); |
|
|
|
|
this.backgroundImage.anchor.set(0.5); |
|
|
|
|
this.backgroundImage.x = this.app.view.width / 2; |
|
|
|
|
this.backgroundImage.y = this.app.view.height / 2; |
|
|
|
|
this.backgroundImage.interactive = true; |
|
|
|
|
this.backgroundImage.name = 'background'; |
|
|
|
|
this.backgroundImage |
|
|
|
|
.on('pointerdown', event => { |
|
|
|
|
if (!event.currentTarget.dragging) { |
|
|
|
|
.on('mousedown', event => { |
|
|
|
|
if (!event.currentTarget.dragging && event.currentTarget.name === this.backgroundImage.name) { |
|
|
|
|
event.currentTarget.data = event.data; |
|
|
|
|
// this.oldGroup = this.parentGroup;
|
|
|
|
|
// this.parentGroup = dragGroup;
|
|
|
|
@ -188,22 +192,36 @@ export class WorkingAreaComponent implements OnInit, AfterViewInit {
|
|
|
|
|
event.currentTarget.dragPoint = event.data.getLocalPosition(event.currentTarget.parent); |
|
|
|
|
event.currentTarget.dragPoint.x -= event.currentTarget.x; |
|
|
|
|
event.currentTarget.dragPoint.y -= event.currentTarget.y; |
|
|
|
|
// tslint:disable-next-line: max-line-length
|
|
|
|
|
// 点击背景创建图标
|
|
|
|
|
const pos = this.backgroundImage.toLocal(this.mousePosition); |
|
|
|
|
switch (this.paintMode) { |
|
|
|
|
case PaintMode.PaintEnd: |
|
|
|
|
console.log(this.backgroundImage.toLocal(this.mousePosition)); |
|
|
|
|
break; |
|
|
|
|
case PaintMode.SinglePointIcon: |
|
|
|
|
this.createSinglePointIcon(this.singlePointIconShadow.texture, pos.x, pos.y, 32, 32, 1); |
|
|
|
|
break; |
|
|
|
|
case PaintMode.LineIcon: |
|
|
|
|
// tslint:disable-next-line: max-line-length
|
|
|
|
|
this.createLineIcon(this.singlePointIconShadow.texture, pos.x, pos.y, [new PIXI.Point(0, 0), new PIXI.Point(100, 0), new PIXI.Point(100, 100)]); |
|
|
|
|
break; |
|
|
|
|
case PaintMode.PolygonIcon: |
|
|
|
|
break; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
}) |
|
|
|
|
.on('pointerup', event => { |
|
|
|
|
if (event.currentTarget.dragging) { |
|
|
|
|
.on('mouseup', event => { |
|
|
|
|
if (event.currentTarget.dragging && event.currentTarget.name === this.backgroundImage.name) { |
|
|
|
|
event.currentTarget.dragging = false; |
|
|
|
|
// this.parentGroup = this.oldGroup;
|
|
|
|
|
// event.currentTarget.scale.x /= 1.1;
|
|
|
|
|
// event.currentTarget.scale.y /= 1.1;
|
|
|
|
|
event.currentTarget.data = null; |
|
|
|
|
console.log('创建图片'); |
|
|
|
|
// tslint:disable-next-line: max-line-length
|
|
|
|
|
this.createSprite('https://qntemp3.bejson.com/upload/72681686638249940.jpg?imageView2/0/w/100/h/100/format/webp', this.mousePosition.x, this.mousePosition.y, 64, 64, 1); |
|
|
|
|
} |
|
|
|
|
}) |
|
|
|
|
.on('pointerupoutside', event => { |
|
|
|
|
if (event.currentTarget.dragging) { |
|
|
|
|
.on('mouseupoutside', event => { |
|
|
|
|
if (event.currentTarget.dragging && event.currentTarget.name === this.backgroundImage.name) { |
|
|
|
|
event.currentTarget.dragging = false; |
|
|
|
|
// this.parentGroup = this.oldGroup;
|
|
|
|
|
// event.currentTarget.scale.x /= 1.1;
|
|
|
|
@ -211,53 +229,115 @@ export class WorkingAreaComponent implements OnInit, AfterViewInit {
|
|
|
|
|
event.currentTarget.data = null; |
|
|
|
|
} |
|
|
|
|
}) |
|
|
|
|
.on('pointermove', event => { |
|
|
|
|
if (event.currentTarget.dragging) { |
|
|
|
|
.on('mousemove', event => { |
|
|
|
|
if (event.currentTarget.dragging && event.currentTarget.name === this.backgroundImage.name) { |
|
|
|
|
const newPosition = event.currentTarget.data.getLocalPosition(event.currentTarget.parent); |
|
|
|
|
event.currentTarget.x = newPosition.x - event.currentTarget.dragPoint.x; |
|
|
|
|
event.currentTarget.y = newPosition.y - event.currentTarget.dragPoint.y; |
|
|
|
|
} |
|
|
|
|
}).on('rightclick', event => { |
|
|
|
|
event.stopPropagation(); |
|
|
|
|
this.cancelPaint(); |
|
|
|
|
|
|
|
|
|
}); |
|
|
|
|
this.app.stage.addChild(this.backgroundImage); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
addShadow(obj) { |
|
|
|
|
const graphics = new PIXI.Graphics(); |
|
|
|
|
// Circle
|
|
|
|
|
graphics.lineStyle(0); |
|
|
|
|
graphics.beginFill(0xDE3249, 1); |
|
|
|
|
graphics.drawCircle(100, 250, 50); |
|
|
|
|
graphics.endFill(); |
|
|
|
|
obj.addChild(graphics); |
|
|
|
|
} |
|
|
|
|
// 设置背景显示状态
|
|
|
|
|
setBackgroundImageVisible(value: boolean): void { |
|
|
|
|
this.backgroundImage.visible = value; |
|
|
|
|
} |
|
|
|
|
// 替换背景图
|
|
|
|
|
replaceBackgroundImage(source: string): void { |
|
|
|
|
/// <summary>
|
|
|
|
|
/// 替换背景图
|
|
|
|
|
/// 参数{source:string} 可以是一个url地址,也可以是本地assets下的一个图片路径
|
|
|
|
|
/// <summary>
|
|
|
|
|
public changeBackgroundImage(source: string): void { |
|
|
|
|
this.backgroundImage.texture = PIXI.Texture.from(source); |
|
|
|
|
this.backgroundImage.visible = true; |
|
|
|
|
} |
|
|
|
|
/// <summary>
|
|
|
|
|
/// 创建单点图标影子
|
|
|
|
|
/// <summary>
|
|
|
|
|
private createSinglePointIconShadow(): void { |
|
|
|
|
this.singlePointIconShadow = PIXI.Sprite.from('assets/images/noImg.png'); |
|
|
|
|
this.singlePointIconShadow.width = 32; |
|
|
|
|
this.singlePointIconShadow.height = 32; |
|
|
|
|
this.singlePointIconShadow.alpha = 0.5; |
|
|
|
|
this.singlePointIconShadow.anchor.set(0.5); |
|
|
|
|
this.singlePointIconShadow.visible = false; |
|
|
|
|
this.app.stage.addChild(this.singlePointIconShadow); |
|
|
|
|
} |
|
|
|
|
// 创建影子图标
|
|
|
|
|
createShadowIcon(source: string): void { |
|
|
|
|
this.shadow = PIXI.Sprite.from(source); |
|
|
|
|
this.shadow.alpha = 0.5; |
|
|
|
|
this.shadow.anchor.set(0.5); |
|
|
|
|
this.app.stage.addChild(this.shadow); |
|
|
|
|
/// <summary>
|
|
|
|
|
/// 改变单点图标影子
|
|
|
|
|
/// <summary>
|
|
|
|
|
private changeSinglePointIconShadow(source: string): void { |
|
|
|
|
this.singlePointIconShadow.texture = PIXI.Texture.from(source); |
|
|
|
|
this.singlePointIconShadow.visible = true; |
|
|
|
|
} |
|
|
|
|
// 设置影子图标显示状态
|
|
|
|
|
setShadowVisible(value: boolean): void { |
|
|
|
|
this.shadow.visible = value; |
|
|
|
|
/// <>
|
|
|
|
|
/// 创建线图标影子
|
|
|
|
|
/// <>
|
|
|
|
|
private createLineIconShadow() { |
|
|
|
|
this.app.stage.addChild(this.lineIconShadow); |
|
|
|
|
} |
|
|
|
|
// 替换影子图片
|
|
|
|
|
replaceShadow(source: string): void { |
|
|
|
|
this.shadow.texture = PIXI.Texture.from(source); |
|
|
|
|
/// <summary>
|
|
|
|
|
/// 开始绘画单点图标
|
|
|
|
|
/// <summary>
|
|
|
|
|
public beginPaintSinglePointIcon(source: string): void { |
|
|
|
|
this.cancelPaint(); |
|
|
|
|
this.paintMode = PaintMode.SinglePointIcon; |
|
|
|
|
this.changeSinglePointIconShadow(source); |
|
|
|
|
} |
|
|
|
|
// 创建单点图标
|
|
|
|
|
createSinglePointIcon(source: string): void { |
|
|
|
|
this.DrawCircle(5); |
|
|
|
|
// this.setShadowVisible(true);
|
|
|
|
|
// this.addShadow(this.shadow);
|
|
|
|
|
// this.replaceShadow(source);
|
|
|
|
|
// 开始绘画多边形
|
|
|
|
|
public beginPaintPolygonIcon(source: string): void { |
|
|
|
|
this.cancelPaint(); |
|
|
|
|
this.paintMode = PaintMode.PolygonIcon; |
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
// 开始绘画线
|
|
|
|
|
public beginPaintLineIcon(source: string): void { |
|
|
|
|
this.cancelPaint(); |
|
|
|
|
this.paintMode = PaintMode.LineIcon; |
|
|
|
|
this.changeSinglePointIconShadow(source); |
|
|
|
|
// this.lineIconShadow.lineStyle(1, 0xffd900, 1);
|
|
|
|
|
} |
|
|
|
|
/// <summary>
|
|
|
|
|
/// 取消绘画
|
|
|
|
|
/// <summary>
|
|
|
|
|
private cancelPaint(): void { |
|
|
|
|
switch (this.paintMode) { |
|
|
|
|
case PaintMode.PaintEnd: |
|
|
|
|
break; |
|
|
|
|
case PaintMode.SinglePointIcon: |
|
|
|
|
this.paintMode = PaintMode.PaintEnd; |
|
|
|
|
this.singlePointIconShadow.visible = false; |
|
|
|
|
break; |
|
|
|
|
case PaintMode.LineIcon: |
|
|
|
|
this.paintMode = PaintMode.PaintEnd; |
|
|
|
|
this.singlePointIconShadow.visible = false; |
|
|
|
|
break; |
|
|
|
|
case PaintMode.PolygonIcon: |
|
|
|
|
this.paintMode = PaintMode.PaintEnd; |
|
|
|
|
break; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
/// <summary>
|
|
|
|
|
/// 画圆
|
|
|
|
|
/// <summary>
|
|
|
|
|
paintShadowCircle(x: number): void { |
|
|
|
|
this.circleShadow.beginFill(0xFFCC5A); |
|
|
|
|
this.circleShadow.drawCircle(0, 0, x); |
|
|
|
|
this.app.stage.addChild(this.circleShadow); |
|
|
|
|
} |
|
|
|
|
/// <summary>
|
|
|
|
|
/// 取消画圆
|
|
|
|
|
/// <summary>
|
|
|
|
|
cancelPaintShadowCircle(): void { |
|
|
|
|
this.app.stage.removeChild(this.circleShadow); |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
/// <summary>
|
|
|
|
|
/// 绘制模式
|
|
|
|
|
/// <summary>
|
|
|
|
|
enum PaintMode { |
|
|
|
|
SinglePointIcon, |
|
|
|
|
LineIcon, |
|
|
|
|
PaintingLineIcon, |
|
|
|
|
PolygonIcon, |
|
|
|
|
PaintEnd, |
|
|
|
|
} |
|
|
|
|