import { JlGraphic, calculateMirrorPoint, getRectangleCenter, VectorText } from 'jl-graphic'; import { Point, Container, Graphics, Color, Rectangle } from 'pixi.js'; import { platformConstsMap } from './PlatformConfig.js'; //子元素--矩形 class RectGraphic extends Container { categoryType; rect; stateFillColor; constructor(categoryType) { super(); this.categoryType = categoryType; this.rect = new Graphics(); this.addChild(this.rect); } draw(platformConsts) { const rect = this.rect; const fillColor = this.stateFillColor || platformConsts.noTrainStop; rect .clear() .lineStyle(platformConsts.lineWidth, new Color(fillColor)) .beginFill(fillColor, 1) .drawRect(0, 0, platformConsts.width, platformConsts.height).endFill; rect.pivot = getRectangleCenter(new Rectangle(0, 0, platformConsts.width, platformConsts.height)); } clear() { this.rect.clear(); } } //子元素--门 class DoorGraphic extends Container { categoryType; doorGraphic; doorCloseGraphic; stateFillColor; constructor(categoryType) { super(); this.categoryType = categoryType; this.doorGraphic = new Graphics(); this.doorCloseGraphic = new Graphics(); this.addChild(this.doorGraphic); this.addChild(this.doorCloseGraphic); } draw(platformConsts) { const doorConsts = platformConsts.doorGraphic; const doorGraphic = this.doorGraphic; const doorCloseGraphic = this.doorCloseGraphic; const lineColor = this.stateFillColor || doorConsts.doorGreen; doorGraphic .clear() .lineStyle(platformConsts.lineWidth, new Color(lineColor)) .moveTo(-platformConsts.width / 2 - platformConsts.lineWidth / 2, 0) .lineTo(-doorConsts.doorOpenSpacing, 0) .moveTo(doorConsts.doorOpenSpacing, 0) .lineTo(platformConsts.width / 2 + platformConsts.lineWidth / 2, 0); //屏蔽门闭合 doorCloseGraphic .clear() .lineStyle(platformConsts.lineWidth, new Color(lineColor)) .moveTo(-doorConsts.doorOpenSpacing, 0) .lineTo(doorConsts.doorOpenSpacing, 0); } clear() { this.doorGraphic.clear(); this.doorCloseGraphic.clear(); } } //子元素--字符 class CodeGraphic extends Container { categoryType; character = new VectorText(''); //扣车H runLevel = new VectorText(''); //运行等级 runTime = new VectorText(''); //运行时间 stopTime = new VectorText(''); //停站时间 circle = new Graphics(); constructor(categoryType, platformConsts) { super(); this.categoryType = categoryType; this.addChild(this.character); this.addChild(this.runLevel); this.addChild(this.circle); this.addChild(this.stopTime); this.addChild(this.runTime); const codeConsts = platformConsts.codeGraphic; this.character.setVectorFontSize(codeConsts.besideFontSize); this.runLevel.setVectorFontSize(codeConsts.besideFontSize); this.stopTime.setVectorFontSize(codeConsts.besideFontSize); this.runTime.setVectorFontSize(codeConsts.besideFontSize); } draw(platformConsts) { const codeConsts = platformConsts.codeGraphic; //扣车 const character = this.character; character.text = 'H'; character.anchor.set(0.5); character.position.set(-platformConsts.width / 2 - platformConsts.lineWidth / 2 - (codeConsts.besideSpacing * 2) / 3, (platformConsts.height * 3) / 4); character.style.fill = codeConsts.whiteNumbers; const circle = this.circle; circle .clear() .lineStyle(0.5, codeConsts.whiteCircle) .drawCircle(0, 0, codeConsts.circleRadius); circle.position.set(-platformConsts.width / 2 - platformConsts.lineWidth / 2 - (codeConsts.besideSpacing * 4) / 3, (platformConsts.height * 3) / 5); //区间运行等级状态 const runLevel = this.runLevel; runLevel.anchor.set(0.5); runLevel.position.set(platformConsts.width / 2 + platformConsts.lineWidth / 2 + 3 * codeConsts.besideSpacing, -codeConsts.besideSpacing); runLevel.style.fill = codeConsts.whiteNumbers; //区间运行时间 const runTime = this.runTime; runTime.anchor.set(0.5); runTime.position.set(platformConsts.width / 2 + platformConsts.lineWidth / 2 + codeConsts.besideSpacing, -codeConsts.besideSpacing); runTime.style.fill = codeConsts.whiteNumbers; //停站时间 const stopTime = this.stopTime; stopTime.anchor.set(0.5); stopTime.position.set(platformConsts.width / 2 + platformConsts.lineWidth / 2 + codeConsts.besideSpacing, codeConsts.besideSpacing); stopTime.style.fill = codeConsts.whiteNumbers; character.visible = false; circle.visible = false; runLevel.visible = false; stopTime.visible = false; runTime.visible = false; } clear() { this.character.destroy(); } } //子元素--站台旁菱形图标 class LozengeGraphic extends Container { categoryType; lozenge; constructor(categoryType) { super(); this.categoryType = categoryType; this.lozenge = new Graphics(); this.addChild(this.lozenge); } draw(platformConsts) { const LozengeConsts = platformConsts.lozengeGraphic; const lozenge = this.lozenge; lozenge .clear() .lineStyle(1, new Color(LozengeConsts.lozengeRed)) .beginFill(LozengeConsts.lozengeRed, 1) .drawRect(0, 0, platformConsts.height / 4, platformConsts.height / 4) .endFill(); const rect = new Rectangle(0, 0, platformConsts.height / 4, platformConsts.height / 4); lozenge.pivot = getRectangleCenter(rect); lozenge.rotation = Math.PI / 4; lozenge.visible = false; } clear() { this.lozenge.clear(); } } class JlPlatform extends JlGraphic { static Type = 'Platform'; categoryType; platformConsts; rectGraphic; doorGraphic; lozengeGraphic; codeGraphic; constructor(categoryType) { super(JlPlatform.Type); this.categoryType = categoryType; this.platformConsts = platformConstsMap.get(this.categoryType); this.rectGraphic = new RectGraphic(categoryType); this.addChild(this.rectGraphic); if (this.platformConsts.doorGraphic) { this.doorGraphic = new DoorGraphic(categoryType); this.addChild(this.doorGraphic); } if (this.platformConsts.lozengeGraphic) { this.lozengeGraphic = new LozengeGraphic(categoryType); this.addChild(this.lozengeGraphic); } if (this.platformConsts.codeGraphic) { this.codeGraphic = new CodeGraphic(categoryType, this.platformConsts); this.addChild(this.codeGraphic); } } get datas() { return this.getDatas(); } doRepaint() { this.doorGraphic?.clear(); const platformConsts = this.platformConsts; this.rectGraphic.draw(platformConsts); if (this.datas.hasdoor && this.doorGraphic) { const doorConsts = platformConsts.doorGraphic; this.doorGraphic.draw(platformConsts); this.doorGraphic.position.set(0, -platformConsts.height / 2 - doorConsts.doorPlatformSpacing); if (this.datas.direction == 'down') { this.doorGraphic.position.copyFrom(calculateMirrorPoint(new Point(0, 0), this.doorGraphic.position)); } } if (this.codeGraphic) { const codeConsts = platformConsts.codeGraphic; this.codeGraphic.draw(platformConsts); this.codeGraphic.position.set(0, 0); if (this.datas.direction == 'down') { const psChange = [ this.codeGraphic.character, this.codeGraphic.runLevel, this.codeGraphic.stopTime, this.codeGraphic.runTime, ]; psChange.forEach((g) => { if (g) { g.position.copyFrom(calculateMirrorPoint(new Point(0, 0), g.position)); } }); this.codeGraphic.circle.position.set(platformConsts.width / 2 + platformConsts.lineWidth / 2 + (codeConsts.besideSpacing * 4) / 3, (-platformConsts.height * 10) / 11); } } if (this.lozengeGraphic) { const LozengeConsts = platformConsts.lozengeGraphic; this.lozengeGraphic.draw(platformConsts); this.lozengeGraphic.position.set(0, -platformConsts.height / 2 - LozengeConsts.doorPlatformSpacing - platformConsts.height / 3); if (this.datas.direction == 'down') { this.lozengeGraphic.position.copyFrom(calculateMirrorPoint(new Point(0, 0), this.lozengeGraphic.position)); } } } } export { JlPlatform };