调整道岔绘制逻辑
This commit is contained in:
parent
c2e3df8dbc
commit
e66a5a5687
@ -1,63 +0,0 @@
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Polygon from 'zrender/src/graphic/shape/Polygon';
|
||||
|
||||
class ERhomboid extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
this.model = model;
|
||||
this.create();
|
||||
}
|
||||
|
||||
create() {
|
||||
const model = this.model;
|
||||
const style = this.model.style;
|
||||
this.section = new Polygon({ // 平行四边形
|
||||
zlevel: model.zlevel,
|
||||
z: model.z + 1,
|
||||
shape: {
|
||||
points: model.sectionPoints
|
||||
},
|
||||
style: {
|
||||
fill: style.Section.line.spareColor
|
||||
// fill: 'green'
|
||||
},
|
||||
cursor: model.cursor,
|
||||
onmouseover: model.onmouseover,
|
||||
onmouseout: model.onmouseout
|
||||
});
|
||||
|
||||
this.hide();
|
||||
this.add(this.section);
|
||||
}
|
||||
|
||||
hide() {
|
||||
this.section.hide();
|
||||
}
|
||||
|
||||
show() {
|
||||
this.section.show();
|
||||
}
|
||||
|
||||
setColor(color) {
|
||||
this.section.setStyle({ fill: color });
|
||||
}
|
||||
|
||||
stopAnimation(flag) {
|
||||
this.section.stopAnimation(flag);
|
||||
}
|
||||
|
||||
getSection() {
|
||||
return this.section;
|
||||
}
|
||||
|
||||
setStyle(styles) {
|
||||
this.eachChild((child) => {
|
||||
if (child.setStyle) {
|
||||
child.setStyle(styles);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
export default ERhomboid;
|
@ -1,5 +1,5 @@
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Polygon from 'zrender/src/graphic/shape/Polygon';
|
||||
import Polyline from 'zrender/src/graphic/shape/Polyline';
|
||||
|
||||
class ESwLnversion extends Group {
|
||||
constructor(model) {
|
||||
@ -11,15 +11,17 @@ class ESwLnversion extends Group {
|
||||
create() {
|
||||
const model = this.model;
|
||||
const style = this.model.style;
|
||||
this.relocShelter = new Polygon({ // 遮盖B区段范围
|
||||
this.relocShelter = new Polyline({ // 遮盖B区段范围
|
||||
zlevel: model.zlevel,
|
||||
z: model.z,
|
||||
z: model.z + 4,
|
||||
shape: {
|
||||
points: model.shelterPoints
|
||||
},
|
||||
style: {
|
||||
fill: style.backgroundColor
|
||||
// fill: style.backgroundColor
|
||||
// fill: 'yellow'
|
||||
lineWidth: style.Section.line.width,
|
||||
stroke: style.backgroundColor
|
||||
},
|
||||
cursor: model.cursor,
|
||||
onmouseover: model.onmouseover,
|
||||
@ -31,7 +33,7 @@ class ESwLnversion extends Group {
|
||||
|
||||
hide() {
|
||||
this.relocShelter.hide();
|
||||
this.relocShelter.setStyle({ fill: this.model.style.backgroundColor });
|
||||
this.relocShelter.setStyle({ stroke: this.model.style.backgroundColor });
|
||||
this.stopAnimation(false);
|
||||
}
|
||||
|
||||
@ -40,7 +42,12 @@ class ESwLnversion extends Group {
|
||||
}
|
||||
|
||||
setColor(color) {
|
||||
this.relocShelter.setStyle({ fill: color });
|
||||
// this.relocShelter.setStyle({ fill: color });
|
||||
this.relocShelter.setStyle({ stroke: color });
|
||||
}
|
||||
|
||||
setStyle(data) {
|
||||
this.relocShelter.setStyle(data);
|
||||
}
|
||||
|
||||
stopAnimation(flag) {
|
||||
|
@ -1,5 +1,5 @@
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Polygon from 'zrender/src/graphic/shape/Polygon';
|
||||
import Polyline from 'zrender/src/graphic/shape/Polyline';
|
||||
|
||||
class ESwLocal extends Group {
|
||||
constructor(model) {
|
||||
@ -12,17 +12,17 @@ class ESwLocal extends Group {
|
||||
const model = this.model;
|
||||
const style = this.model.style;
|
||||
|
||||
this.locShelter = new Polygon({
|
||||
this.locShelter = new Polyline({
|
||||
zlevel: model.zlevel,
|
||||
z: model.z,
|
||||
z: model.z + 5,
|
||||
shape: {
|
||||
points: model.shelterPoints
|
||||
},
|
||||
style: {
|
||||
fill: style.backgroundColor
|
||||
// fill: style.backgroundColor,
|
||||
// fill: 'red'
|
||||
// lineWidth: style.Section.line.width,
|
||||
// stroke: style.backgroundColor
|
||||
lineWidth: style.Section.line.width,
|
||||
stroke: style.backgroundColor
|
||||
},
|
||||
cursor: model.cursor,
|
||||
onmouseover: model.onmouseover,
|
||||
@ -35,7 +35,7 @@ class ESwLocal extends Group {
|
||||
|
||||
hide() {
|
||||
this.locShelter.hide();
|
||||
this.locShelter.setStyle({ fill: this.model.style.backgroundColor });
|
||||
this.locShelter.setStyle({ stroke: this.model.style.backgroundColor });
|
||||
this.stopAnimation(false);
|
||||
}
|
||||
|
||||
@ -48,8 +48,12 @@ class ESwLocal extends Group {
|
||||
}
|
||||
|
||||
setColor(color) {
|
||||
this.locShelter.setStyle({ fill: color });
|
||||
// this.locShelter.setStyle({ stroke: color });
|
||||
// this.locShelter.setStyle({ fill: color });
|
||||
this.locShelter.setStyle({ stroke: color });
|
||||
}
|
||||
|
||||
setStyle(data) {
|
||||
this.locShelter.setStyle(data);
|
||||
}
|
||||
|
||||
animateStyle(cb) {
|
||||
|
@ -13,14 +13,14 @@ class ETriangle extends Group {
|
||||
const style = this.model.style;
|
||||
this.section = new Polyline({ // 平行四边形
|
||||
zlevel: model.zlevel,
|
||||
z: model.z + 1,
|
||||
z: model.z + 3,
|
||||
shape: {
|
||||
points: model.sectionPoints
|
||||
},
|
||||
style: {
|
||||
fill: style.Section.line.spareColor,
|
||||
// fill: style.Section.line.spareColor,
|
||||
// fill: 'red',
|
||||
lineWidth: 0,
|
||||
lineWidth: style.Section.line.width,
|
||||
stroke: style.Section.line.spareColor
|
||||
},
|
||||
cursor: model.cursor,
|
||||
@ -41,7 +41,11 @@ class ETriangle extends Group {
|
||||
}
|
||||
|
||||
setColor(color) {
|
||||
this.section.setStyle({ fill: color });
|
||||
this.section.setStyle({ stroke: color });
|
||||
}
|
||||
|
||||
attr(data) {
|
||||
this.section.attr(data);
|
||||
}
|
||||
|
||||
stopAnimation(flag) {
|
||||
|
@ -9,7 +9,6 @@ import ELockRect from './ELockRect';
|
||||
import ELockArc from './ELockArc';
|
||||
import EMouse from './EMouse';
|
||||
import EHighlight from '../element/EHighlight';
|
||||
// import ERhomboid from './ERhomboid';
|
||||
import ETriangle from './ETriangle';
|
||||
import store from '@/store/index_APP_TARGET';
|
||||
import Vue from 'vue';
|
||||
@ -46,83 +45,58 @@ export default class Switch extends Group {
|
||||
const model = this.model;
|
||||
const style = this.style;
|
||||
|
||||
const switchWidth = style.Section.line.width + style.Section.line.beyondWidth * 2; // 超出宽度多少
|
||||
const swPadding = style.Switch.core.length + style.Section.line.width / 2;
|
||||
const directx = this.triangle.drictx;
|
||||
const directy = this.triangle.dricty;
|
||||
const direct = -this.triangle.drictx * this.triangle.dricty;
|
||||
|
||||
const switchWidth1 = style.Section.line.width / 2;
|
||||
const width1 = switchWidth1 * this.triangle.getSinRate();
|
||||
const height1 = switchWidth1 * this.triangle.getCosRate();
|
||||
const width2 = (height1 + switchWidth1) / this.triangle.getTanRate();
|
||||
const width3 = (style.Section.line.width / this.triangle.getSinRate()) - width2 - width1;
|
||||
const detailWidth = 0.2; // 调整定位模糊宽度
|
||||
|
||||
const point1 = [model.intersection.x - directx * width3 - directx * detailWidth, model.intersection.y + directy * switchWidth1];
|
||||
const point2 = [model.intersection.x + directx * (width2 + width1) + directx * detailWidth, point1[1]];
|
||||
const point3 = [point2[0] + directx * this.triangle.getCotRate() * swPadding, point2[1] + directy * swPadding];
|
||||
const point4 = [point3[0] + direct * this.triangle.getSin(switchWidth) - directx * 2 * detailWidth, point3[1] - direct * this.triangle.getCos(switchWidth)];
|
||||
// let directxA = 1;
|
||||
// const sectionAModel = Vue.prototype.$jlmap.mapDevice[model.sectionACode];
|
||||
// let sectionATriangle = new JTriangle(sectionAModel.points[0], sectionAModel.points[1]);
|
||||
// const sectionAPoint = { x: model.intersection.x, y: model.intersection.y };
|
||||
// if (sectionAModel.points[0].x == model.intersection.x && sectionAModel.points[0].y == model.intersection.y) {
|
||||
// sectionATriangle = new JTriangle(sectionAModel.points[0], sectionAModel.points[1]);
|
||||
// directxA = 1;
|
||||
// }
|
||||
// if (sectionAModel.points[sectionAModel.points.length - 1].x == model.intersection.x && sectionAModel.points[sectionAModel.points.length - 1].y == model.intersection.y) {
|
||||
// sectionATriangle = new JTriangle(sectionAModel.points[sectionAModel.points.length - 2], sectionAModel.points[sectionAModel.points.length - 1]);
|
||||
// directxA = -1;
|
||||
// }
|
||||
|
||||
// const drictyyA = sectionATriangle.dricty;
|
||||
// // const difference = switchWidth1 * this.triangle.getCosRate();
|
||||
|
||||
// const point1 = [model.intersection.x + directx * this.triangle.getCotRate() * swPadding, model.intersection.y + directy * swPadding];
|
||||
// const point2 = [model.intersection.x, model.intersection.y];
|
||||
// const point3 = [sectionAPoint.x + directxA * (switchWidth1 * sectionATriangle.getCosRate()), sectionAPoint.y + drictyyA * switchWidth1 * sectionATriangle.getSinRate()];
|
||||
this.locShelter = new ESwLocal({ // 定位 覆盖形状 A
|
||||
let directxA = 1;
|
||||
const sectionAModel = Vue.prototype.$jlmap.mapDevice[model.sectionACode];
|
||||
const sectionBModel = Vue.prototype.$jlmap.mapDevice[model.sectionBCode];
|
||||
let sectionATriangle = new JTriangle(sectionAModel.points[0], sectionAModel.points[1]);
|
||||
let sectionBTriangle = new JTriangle(sectionBModel.points[0], sectionBModel.points[1]);
|
||||
const sectionAPoint = { x: model.intersection.x, y: model.intersection.y };
|
||||
if (sectionAModel.points[0].x == model.intersection.x && sectionAModel.points[0].y == model.intersection.y) {
|
||||
sectionATriangle = new JTriangle(sectionAModel.points[0], sectionAModel.points[1]);
|
||||
sectionBTriangle = new JTriangle(sectionBModel.points[0], sectionBModel.points[1]);
|
||||
directxA = 1;
|
||||
}
|
||||
if (sectionAModel.points[sectionAModel.points.length - 1].x == model.intersection.x && sectionAModel.points[sectionAModel.points.length - 1].y == model.intersection.y) {
|
||||
sectionATriangle = new JTriangle(sectionAModel.points[sectionAModel.points.length - 2], sectionAModel.points[sectionAModel.points.length - 1]);
|
||||
sectionBTriangle = new JTriangle(sectionBModel.points[sectionBModel.points.length - 2], sectionBModel.points[sectionBModel.points.length - 1]);
|
||||
directxA = -1;
|
||||
}
|
||||
const drictyyA = sectionATriangle.dricty;
|
||||
const point1 = [model.intersection.x + directx * this.triangle.getCotRate() * swPadding, model.intersection.y + directy * swPadding];
|
||||
const point2 = [model.intersection.x, model.intersection.y];
|
||||
const point3 = [sectionAPoint.x + directxA * (switchWidth1 * sectionATriangle.getCosRate()), sectionAPoint.y + drictyyA * switchWidth1 * sectionATriangle.getSinRate()];
|
||||
this.shapeModelA = new ESwLocal({ // 形状 A 层级最高 反位折线覆盖
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
style: style,
|
||||
shelterPoints: [point1, point2, point3, point4],
|
||||
// shelterPoints: [point1, point2, point3],
|
||||
shelterPoints: [point1, point2, point3],
|
||||
cursor: 'pointer',
|
||||
triangle: this.triangle,
|
||||
onmouseover: () => { this.name.getArrowText().show(); },
|
||||
onmouseout: () => { this.name.getArrowText().hide(); }
|
||||
});
|
||||
|
||||
const rpoint1 = [model.intersection.x + directx * width3, model.intersection.y - directy * switchWidth1];
|
||||
const rpoint2 = [rpoint1[0] + directx * (width2 + width1) - directx * width3, model.intersection.y + directy * switchWidth1];
|
||||
const rpoint3 = [rpoint2[0] + directx * 10, rpoint2[1]];
|
||||
const rpoint4 = [rpoint2[0] + directx * 10, rpoint1[1]];
|
||||
this.relocShelter = new ESwLnversion({ // 反位覆盖形状 B
|
||||
const relocShelterLength = 15;
|
||||
const rpoint1 = [sectionAPoint.x - directxA * (relocShelterLength * sectionBTriangle.getCosRate()), sectionAPoint.y - drictyyA * relocShelterLength * sectionBTriangle.getSinRate()];
|
||||
const rpoint2 = [sectionAPoint.x, sectionAPoint.y];
|
||||
const rpoint3 = [sectionAPoint.x + directxA * (switchWidth1 * sectionATriangle.getCosRate()), sectionAPoint.y + drictyyA * switchWidth1 * sectionATriangle.getSinRate()];
|
||||
this.shapeModelB = new ESwLnversion({ // 形状 B 层级居中 定位折线覆盖
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
style: style,
|
||||
shelterPoints: [rpoint1, rpoint2, rpoint3, rpoint4],
|
||||
shelterPoints: [rpoint1, rpoint2, rpoint3],
|
||||
cursor: 'pointer',
|
||||
onmouseover: () => { this.name.getArrowText().show(); },
|
||||
onmouseout: () => { this.name.getArrowText().hide(); }
|
||||
});
|
||||
|
||||
// const spoint1 = [model.intersection.x + directx * width3, model.intersection.y - directy * switchWidth1];
|
||||
// const spoint2 = [spoint1[0] - directx * (width2 + width1) - directx * width3, spoint1[1]];
|
||||
// const spoint3 = [model.intersection.x - directx * width3, model.intersection.y + directy * switchWidth1];
|
||||
// const spoint4 = [spoint1[0] + directx * (width2 + width1) - directx * width3, spoint3[1]];
|
||||
// this.rhomboid = new ERhomboid({ // 岔芯 平行四边形 佛山线路专用
|
||||
// zlevel: this.zlevel,
|
||||
// z: this.z,
|
||||
// style: style,
|
||||
// sectionPoints: [spoint1, spoint2, spoint3, spoint4],
|
||||
// cursor: 'pointer',
|
||||
// onmouseover: () => { this.name.getArrowText().show(); },
|
||||
// onmouseout: () => { this.name.getArrowText().hide(); }
|
||||
// });
|
||||
if (this.style.Switch.text.lossRect) { // 道岔失表显示红色矩形框
|
||||
const lossRect = this.locShelter.getLocal().getBoundingRect();
|
||||
const lossRect = this.shapeModelA.getLocal().getBoundingRect();
|
||||
this.lossShow = new Rect({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z + 1,
|
||||
@ -142,16 +116,14 @@ export default class Switch extends Group {
|
||||
this.add(this.lossShow);
|
||||
this.lossShow.hide();
|
||||
}
|
||||
const Tspoint1 = [model.intersection.x + directx * width3 + directx * (width2 + width1) - directx * width3, model.intersection.y + directy * switchWidth1];
|
||||
const Tspoint2 = [model.intersection.x - directx * width3, Tspoint1[1]];
|
||||
const Tspoint3 = [model.intersection.x - directx * width3, model.intersection.y - directy * switchWidth1];
|
||||
const Tspoint4 = [model.intersection.x + directx * width3, Tspoint3[1]];
|
||||
const Tspoint5 = [Tspoint1[0], Tspoint1[1]];
|
||||
this.sheltertriangle = new ETriangle({ // 岔芯 直角梯形 C
|
||||
|
||||
const Tspoint1 = [model.intersection.x + directx * this.triangle.getCotRate() * swPadding, model.intersection.y + directy * swPadding];
|
||||
const Tspoint2 = [model.intersection.x, model.intersection.y];
|
||||
this.shapeModelC = new ETriangle({ // 形状 C 层级最低 应用佛山反位覆盖
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
style: style,
|
||||
sectionPoints: [Tspoint1, Tspoint2, Tspoint3, Tspoint4, Tspoint5],
|
||||
sectionPoints: [Tspoint1, Tspoint2],
|
||||
cursor: 'pointer',
|
||||
onmouseover: () => { this.name.getArrowText().show(); },
|
||||
onmouseout: () => { this.name.getArrowText().hide(); }
|
||||
@ -191,10 +163,9 @@ export default class Switch extends Group {
|
||||
}
|
||||
});
|
||||
|
||||
this.add(this.locShelter);
|
||||
this.add(this.relocShelter);
|
||||
// this.add(this.rhomboid);
|
||||
this.add(this.sheltertriangle);
|
||||
this.add(this.shapeModelA);
|
||||
this.add(this.shapeModelB);
|
||||
this.add(this.shapeModelC);
|
||||
this.add(this.name);
|
||||
this.add(this.enabledName);
|
||||
style.Switch.text.show && model.nameShow ? this.name.show() : this.name.hide();
|
||||
@ -281,36 +252,34 @@ export default class Switch extends Group {
|
||||
this.lockRect.hide(); // 矩形包围框
|
||||
this.lockArc.hide(); // 圆形单锁框
|
||||
this.name.getNameText().stopAnimation(false);
|
||||
this.sheltertriangle.hide(); // 直角梯形覆盖图形
|
||||
this.sheltertriangle.setColor(this.style.Section.line.spareColor);
|
||||
this.sheltertriangle.stopAnimation(false);
|
||||
this.shapeModelC.hide(); // 形状 C
|
||||
this.shapeModelA.hide(); // 形状 A
|
||||
this.shapeModelB.hide(); // 形状 B
|
||||
this.setHasTextBorder(0);
|
||||
this.locShelter.hide(); // 定位覆盖图形
|
||||
this.relocShelter.hide(); // 反位覆盖图形
|
||||
this.enabledName.hide(); // 使能隐藏
|
||||
this.shapeModelC.attr({
|
||||
z: this.z + 3
|
||||
});
|
||||
this.enabledName && this.enabledName.hide(); // 使能隐藏
|
||||
this.lossShow && this.lossShow.hide(); // 道岔失去矩形
|
||||
this.lossShow && this.lossShow.stopAnimation(false);
|
||||
}
|
||||
|
||||
/** 定位*/
|
||||
setLocationAction() {
|
||||
if (this.style.Switch.core.splice) {
|
||||
this.locShelter.hide();
|
||||
if (this.style.Switch.core.splice) { // 哈尔滨线路
|
||||
this.shapeModelB.hide();
|
||||
this.shapeModelC.hide();
|
||||
} else {
|
||||
this.locShelter.show();
|
||||
this.shapeModelB.show();
|
||||
this.shapeModelB.setColor(this.style.Section.line.spareColor);
|
||||
this.shapeModelC.show();
|
||||
}
|
||||
if (this.style.Switch.core.graphShow) { // 佛山线路显示
|
||||
this.relocShelter.show();
|
||||
this.sheltertriangle.show();
|
||||
this.relocShelter.setColor('#00FF00');
|
||||
this.sheltertriangle.setColor('#00FF00');
|
||||
} else {
|
||||
this.relocShelter.hide();
|
||||
this.sheltertriangle.hide();
|
||||
this.shapeModelB.show();
|
||||
this.shapeModelB.setColor('#00FF00');
|
||||
this.shapeModelC.show();
|
||||
this.shapeModelC.setColor(this.style.backgroundColor);
|
||||
}
|
||||
// this.relocShelter.show();
|
||||
// this.relocShelter.setColor('red');
|
||||
// this.locShelter.setColor('yellow');
|
||||
this.setTextColor(this.style.Switch.text.locateColor);
|
||||
}
|
||||
|
||||
@ -318,26 +287,28 @@ export default class Switch extends Group {
|
||||
setInversionAction() {
|
||||
this.setTextColor(this.style.Switch.text.inversionColor);
|
||||
if (this.style.Switch.core.splice) {
|
||||
this.relocShelter.hide();
|
||||
// this.shapeModelA.show();
|
||||
// this.shapeModelA.setColor(this.style.Section.line.spareColor);
|
||||
} else {
|
||||
this.relocShelter.show(); // 反位
|
||||
this.shapeModelB.show();
|
||||
}
|
||||
this.locShelter.hide(); // 定位
|
||||
this.sheltertriangle.hide();
|
||||
this.shapeModelA.show();
|
||||
this.shapeModelA.setColor(this.style.Section.line.spareColor);
|
||||
if (this.style.Switch.core.graphShow) { // 佛山线路显示
|
||||
this.locShelter.show();
|
||||
this.locShelter.setColor('#FFFF00');
|
||||
this.sheltertriangle.show();
|
||||
this.sheltertriangle.setColor('#FFFF00');
|
||||
this.shapeModelC.show();
|
||||
this.shapeModelC.setColor('#FFFF00');
|
||||
this.shapeModelC.attr({
|
||||
z: this.z + 6
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
/** 失去*/
|
||||
setLossAction() {
|
||||
this.locShelter.show();
|
||||
this.relocShelter.show();
|
||||
this.sheltertriangle.show();
|
||||
this.sheltertriangle.setColor(this.style.backgroundColor);
|
||||
this.shapeModelA.show();
|
||||
this.shapeModelB.show();
|
||||
this.shapeModelC.show();
|
||||
this.shapeModelC.setColor(this.style.backgroundColor);
|
||||
this.setTextColor(this.style.Switch.text.lossColor);
|
||||
this.style.Switch.text.faultFlashing && this.nameTextAnimation();
|
||||
|
||||
@ -349,8 +320,8 @@ export default class Switch extends Group {
|
||||
.start();
|
||||
}
|
||||
setSwitchFault(split) {
|
||||
if (this.style.Switch.jointImg.faultStatus && split) {
|
||||
this.setForkAction(); // 道岔挤岔 宁波线失表状态
|
||||
if (this.style.Switch.jointImg.faultStatus && split) { // 宁波线失表状态
|
||||
this.setForkAction(); // 道岔挤岔
|
||||
} else {
|
||||
if (this.model.switchFaultCode && split) {
|
||||
const switchFault = store.getters['map/getDeviceByCode'](this.model.switchFaultCode);
|
||||
@ -365,28 +336,28 @@ export default class Switch extends Group {
|
||||
setForkAction() {
|
||||
if (this.style.Switch.jointImg.fork) {
|
||||
this.recover();
|
||||
this.relocShelter.show();
|
||||
this.relocShelter.animateStyle(item => {
|
||||
this.shapeModelB.show();
|
||||
this.shapeModelB.animateStyle(item => {
|
||||
item.animateStyle(true)
|
||||
.when(0, { fill: this.style.backgroundColor })
|
||||
.when(1000, { fill: 'red' })
|
||||
.when(2000, { fill: this.style.backgroundColor })
|
||||
.when(0, { stroke: this.style.backgroundColor })
|
||||
.when(1000, { stroke: 'red' })
|
||||
.when(2000, { stroke: this.style.backgroundColor })
|
||||
.start();
|
||||
});
|
||||
this.sheltertriangle.show(); // 宁波线路挤叉特殊显示
|
||||
this.sheltertriangle.animateStyle(item => {
|
||||
this.shapeModelC.show(); // 宁波线路挤叉特殊显示
|
||||
this.shapeModelC.animateStyle(item => {
|
||||
item.animateStyle(true)
|
||||
.when(0, { fill: this.style.backgroundColor })
|
||||
.when(1000, { fill: 'red' })
|
||||
.when(2000, { fill: this.style.backgroundColor })
|
||||
.when(0, { stroke: this.style.backgroundColor })
|
||||
.when(1000, { stroke: 'red' })
|
||||
.when(2000, { stroke: this.style.backgroundColor })
|
||||
.start();
|
||||
});
|
||||
this.locShelter.show();
|
||||
this.locShelter.animateStyle(item => {
|
||||
this.shapeModelA.show();
|
||||
this.shapeModelA.animateStyle(item => {
|
||||
item.animateStyle(true)
|
||||
.when(0, { fill: this.style.backgroundColor })
|
||||
.when(1000, { fill: 'red' })
|
||||
.when(2000, { fill: this.style.backgroundColor })
|
||||
.when(0, { stroke: this.style.backgroundColor })
|
||||
.when(1000, { stroke: 'red' })
|
||||
.when(2000, { stroke: this.style.backgroundColor })
|
||||
.start();
|
||||
});
|
||||
this.setTextColor('red');
|
||||
@ -415,28 +386,28 @@ export default class Switch extends Group {
|
||||
/** 封锁 */
|
||||
block() {
|
||||
if (this.style.Switch.jointImg.block) { // 宁波专用封锁显示
|
||||
this.relocShelter.show();
|
||||
this.relocShelter.animateStyle(item => {
|
||||
this.shapeModelB.show();
|
||||
this.shapeModelB.animateStyle(item => {
|
||||
item.animateStyle(true)
|
||||
.when(0, { fill: this.style.backgroundColor })
|
||||
.when(1000, { fill: this.style.Switch.jointImg.flashingColors })
|
||||
.when(2000, { fill: this.style.backgroundColor })
|
||||
.when(0, { stroke: this.style.backgroundColor })
|
||||
.when(1000, { stroke: this.style.Switch.jointImg.flashingColors })
|
||||
.when(2000, { stroke: this.style.backgroundColor })
|
||||
.start();
|
||||
});
|
||||
this.sheltertriangle.show();
|
||||
this.sheltertriangle.animateStyle(item => {
|
||||
this.shapeModelC.show();
|
||||
this.shapeModelC.animateStyle(item => {
|
||||
item.animateStyle(true)
|
||||
.when(0, { fill: this.style.backgroundColor })
|
||||
.when(1000, { fill: this.style.Switch.jointImg.flashingColors })
|
||||
.when(2000, { fill: this.style.backgroundColor })
|
||||
.when(0, { stroke: this.style.backgroundColor })
|
||||
.when(1000, { stroke: this.style.Switch.jointImg.flashingColors })
|
||||
.when(2000, { stroke: this.style.backgroundColor })
|
||||
.start();
|
||||
});
|
||||
this.locShelter.show();
|
||||
this.locShelter.animateStyle(item => {
|
||||
this.shapeModelA.show();
|
||||
this.shapeModelA.animateStyle(item => {
|
||||
item.animateStyle(true)
|
||||
.when(0, { fill: this.style.backgroundColor })
|
||||
.when(1000, { fill: this.style.Switch.jointImg.flashingColors })
|
||||
.when(2000, { fill: this.style.backgroundColor })
|
||||
.when(0, { stroke: this.style.backgroundColor })
|
||||
.when(1000, { stroke: this.style.Switch.jointImg.flashingColors })
|
||||
.when(2000, { stroke: this.style.backgroundColor })
|
||||
.start();
|
||||
});
|
||||
}
|
||||
@ -447,8 +418,8 @@ export default class Switch extends Group {
|
||||
this.setTextColor(this.style.Switch.text.blockText);
|
||||
}
|
||||
if (this.style.Switch.jointImg.trapezoidBlock && this.model.reversePosition) { // 范围且封锁时显示
|
||||
this.sheltertriangle.show();
|
||||
this.sheltertriangle.getSection().setStyle('fill', '#000080');
|
||||
this.shapeModelC.show();
|
||||
this.shapeModelC.getSection().setStyle('fill', '#000080');
|
||||
}
|
||||
if (this.style.Switch.rectLock.block) {
|
||||
this.lockRect.show();
|
||||
@ -488,35 +459,43 @@ export default class Switch extends Group {
|
||||
}
|
||||
|
||||
// 处理岔芯颜色
|
||||
setSectionState(section, state) {
|
||||
setSectionState(state) {
|
||||
const sectionC = store.getters['map/getDeviceByCode'](state.sectionCCode);
|
||||
if (sectionC && state.reversePosition) {
|
||||
this.setSwitchModelStatus(this.shapeModelA, sectionC);
|
||||
}
|
||||
const sectionA = store.getters['map/getDeviceByCode'](state.sectionACode);
|
||||
if (sectionA) {
|
||||
// 空闲
|
||||
section.setStyle({'fill': this.style.Section.line.spareColor});
|
||||
if (sectionA && state.normalPosition && !this.style.Switch.core.graphShow) {
|
||||
this.setSwitchModelStatus(this.shapeModelB, sectionA);
|
||||
}
|
||||
}
|
||||
// 处理道岔元素状态
|
||||
setSwitchModelStatus(section, sectionModel) {
|
||||
// 空闲
|
||||
section.setStyle({'stroke': this.style.Section.line.spareColor});
|
||||
section.show();
|
||||
// 道岔保护区段锁闭
|
||||
if (sectionModel.overlapLock) {
|
||||
section.setStyle({'stroke': this.style.Section.line.protectiveLockColor});
|
||||
section.show();
|
||||
// 道岔保护区段锁闭
|
||||
if (sectionA.overlapLock) {
|
||||
section.show();
|
||||
section.setStyle({'fill': this.style.Section.line.protectiveLockColor});
|
||||
}
|
||||
// 空闲锁闭或者叫进路锁闭
|
||||
if (sectionA.routeLock) {
|
||||
section.setStyle({'fill': this.style.Section.line.routeLockColor, 'stroke': this.style.Section.line.routeLockColor, 'lineWidth': this.style.Section.line.beyondWidth});
|
||||
section.show();
|
||||
}
|
||||
// 非CBTC车占用
|
||||
if (sectionA.nctOccupied) {
|
||||
section.show();
|
||||
section.setStyle({'fill': this.style.Section.line.unCommunicationOccupiedColor, 'stroke': this.style.Section.line.unCommunicationOccupiedColor, 'lineWidth': this.style.Section.line.beyondWidth});
|
||||
}
|
||||
// CBTC车占用
|
||||
if (sectionA.ctOccupied) {
|
||||
section.show();
|
||||
section.setStyle({'fill': this.style.Section.line.communicationOccupiedColor, 'stroke': this.style.Section.line.communicationOccupiedColor, 'lineWidth': this.style.Section.line.beyondWidth});
|
||||
}
|
||||
if (sectionA.cutOff) {
|
||||
section.hide();
|
||||
}
|
||||
}
|
||||
// 空闲锁闭或者叫进路锁闭
|
||||
if (sectionModel.routeLock) {
|
||||
section.setStyle({'stroke': this.style.Section.line.routeLockColor});
|
||||
section.show();
|
||||
}
|
||||
// 非CBTC车占用
|
||||
if (sectionModel.nctOccupied) {
|
||||
section.setStyle({'stroke': this.style.Section.line.unCommunicationOccupiedColor});
|
||||
section.show();
|
||||
}
|
||||
// CBTC车占用
|
||||
if (sectionModel.ctOccupied) {
|
||||
section.setStyle({'stroke': this.style.Section.line.communicationOccupiedColor});
|
||||
section.show();
|
||||
}
|
||||
if (sectionModel.cutOff) {
|
||||
section.hide();
|
||||
}
|
||||
}
|
||||
|
||||
@ -537,8 +516,8 @@ export default class Switch extends Group {
|
||||
model.blockade && this.block(); // 道岔封锁
|
||||
model.singleLock && model.blockade && this.blockMonolock(); // 单锁&锁闭状态
|
||||
const path = window.location.href;
|
||||
if (!this.style.Switch.core.graphShow && !path.includes('/map/draw')) {
|
||||
this.setSectionState(this.sheltertriangle, this.model); // 处理岔芯颜色
|
||||
if (!path.includes('/map/draw')) {
|
||||
this.setSectionState(this.model); // 处理元素颜色
|
||||
}
|
||||
// this.interlockingReserved(); // 联锁预留道岔
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user