joylink/rt-sim-training-client
6
0
Fork 0
Code Issues 3 Pull Requests Actions Packages Projects Releases Wiki Activity

修改代码

Browse Source
This commit is contained in:
ival 2019-07-16 16:29:31 +08:00
parent dd21cc3294
commit 25e6c8ceb8
9 changed files with 1412 additions and 1006 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

45
src/jmap/config/defaultSkin.js
View File

@ -170,51 +170,6 @@ export default class DefaultSkin {
/** 道岔单锁颜色*/
this.switchMonolockColor = '#870E10';
/** 信号机宽度 */
this.signalR = 4;
/** 灯柱宽度*/
this.signalLampStandardWidth = 1.2;
/** 设备距离区段的距离*/
this.signalDistance = 8;
/** 信号灯按钮边线*/
this.signalButtonDashColor = '#FFFFFF'; // '#C0C0C0'
/** 信号灯按钮颜色*/
this.signalButtonColor = 'darkgreen';
/** 信号灯按钮闪烁颜色*/
this.signalButtonLightenColor = '#E4EF50';
/** 信号灯字体颜色*/
this.signalTextColor = '#007600';
/** 信号灯灯柱颜色*/
this.signalLampStandardColor = '#5578B6';
/** 信号灯锁闭*/
this.signalBlockColor = '#EF0C08';
/** 信号灯灰色*/
this.signalLampGrayColor = '#7F7F7F';
/** 信号灯红色*/
this.signalLampRedColor = '#FF0000';
/** 信号灯绿色*/
this.signalLampGreenColor = '#00FF00';
/** 信号灯黄色*/
this.signalLampYellowColor = '#FFFF00';
/** 信号灯白色*/
this.signalLampWhiteColor = '#FFFFFF';
/** 信号灯蓝色*/
this.signalLampBlueColor = '#0070C0';
/** 公里表距离车站距离*/
this.stationKmRangeDistance = 22;

1020
src/jmap/shape/Signal.js
View File

File diff suppressed because it is too large Load Diff

988
src/jmap/shape/Signal_1.js Normal file
View File

@ -0,0 +1,988 @@
/*
* 信号机
*/
import Line from 'zrender/src/graphic/shape/Line';
import Text from 'zrender/src/graphic/Text';
import Polygon from 'zrender/src/graphic/shape/Polygon';
import Polyline from 'zrender/src/graphic/shape/Polyline';
import Circle from 'zrender/src/graphic/shape/Circle';
import Arc from 'zrender/src/graphic/shape/Arc';
import Rect from 'zrender/src/graphic/shape/Rect';
import Group from 'zrender/src/container/Group';
import { arrows, triangular } from './libs/ShapePoints';
class Lamp extends Group {
constructor(model) {
super();
this.model = model;
this.zlevel = model.zlevel;
this.z = 10;
this._create();
}
_create() {
const model = this.model;
this.lamp = new Arc({
name: model.index,
zlevel: this.zlevel + 1,
z: this.z,
shape: {
cx: model.position.x,
cy: model.position.y,
r: model.style.signalR
},
style: {
lineWidth: 0.4,
fill: model.style.backgroundColor,
stroke: model.style.signalLampStandardColor
}
});
this.lstop = new Line({
zlevel: this.zlevel + 1,
z: this.z,
origin: model.origin,
rotation: -Math.PI / 180 * model.rotate,
shape: {
x1: model.position.x + (model.style.signalR + 1) * Math.cos(Math.PI / 4),
y1: model.position.y + (model.style.signalR + 1) * Math.sin(Math.PI / 4),
x2: model.position.x - (model.style.signalR + 1) * Math.cos(Math.PI / 4),
y2: model.position.y - (model.style.signalR + 1) * Math.sin(Math.PI / 4)
},
style: {
lineWidth: 1.5,
stroke: model.style.backgroundColor
}
});
this.rstop = new Line({
zlevel: this.zlevel + 1,
z: this.z,
origin: model.origin,
rotation: -Math.PI / 180 * model.rotate,
shape: {
x1: model.position.x + (model.style.signalR + 1) * Math.cos(Math.PI / 4),
y1: model.position.y + (model.style.signalR + 1) * (Math.sin(Math.PI / 4) - Math.sqrt(2)),
x2: model.position.x - (model.style.signalR + 1) * Math.cos(Math.PI / 4),
y2: model.position.y - (model.style.signalR + 1) * (Math.sin(Math.PI / 4) - Math.sqrt(2))
},
style: {
lineWidth: 1.5,
stroke: model.style.backgroundColor
}
});
this.add(this.lamp);
}
setColor(color) {
if (color) {
this.lamp.setStyle('fill', color);
}
}
// 两条交叉黑线
setStop(has) {
if (has) {
this.add(this.lstop);
this.add(this.rstop);
} else {
this.remove(this.lstop);
this.remove(this.rstop);
}
}
}
// 自动进路箭头
class AutoSig extends Group {
constructor(model) {
super();
this.model = model;
this.zlevel = model.zlevel;
this.z = 10;
this._create();
}
_create() {
const model = this.model;
let rotation = Math.PI;
if (model.drict != 1) {
// 右侧
rotation = 0;
}
// 箭头
const x = model.position.x + model.drict * (model.lampCount * model.style.signalR + model.style.signalLampStandardWidth) * 2;
const y = model.position.y - model.style.signalLampStandardWidth;
this.arrowsControl = new Polygon({
zlevel: this.zlevel,
rotation: rotation,
origin: [x, y],
shape: {
points: arrows(x, y, model.style.stationControlDistance / 8, model.style.signalR * 0.8)
},
style: {
stroke: model.style.sidelineColor,
lineWidth: 0.6,
fill: model.style.signalLampGreenColor
}
});
this.add(this.arrowsControl);
}
// 停止动画
animationRecover() {
this.arrowsControl.stopAnimation(false);
}
// 箭头颜色
setColor(color) {
if (color) {
this.arrowsControl.setStyle('fill', color);
}
}
// 箭头闪烁
arrowsAnimation() {
const fill = this.arrowsControl.style.fill;
const style = this.model.style;
this.arrowsControl.animate('style', true)
.when(1000, { fill: style.backgroundColor, stroke: style.backgroundColor })
.when(2000, { fill: fill, stroke: style.sidelineColor })
.when(3000, { fill: style.backgroundColor, stroke: style.backgroundColor })
.when(4000, { fill: fill, stroke: style.sidelineColor })
.start();
}
}
// 运行方向三角
class JSigDrict extends Group {
constructor(model) {
super();
this.model = model;
this.zlevel = model.zlevel;
this.z = 10;
this._create();
}
_create() {
// 箭头
const model = this.model;
this.sigDrict = new Polygon({
zlevel: this.zlevel,
z: this.z,
shape: {
points: triangular(model.position.x, model.position.y, model.drict, model.style.signalR)
},
style: {
stroke: model.style.backgroundColor,
lineWidth: 0.5,
fill: model.style.signalLampYellowColor
}
});
this.add(this.sigDrict);
}
}
// 信号灯 几灯、高柱等
class JSiglamp extends Group {
constructor(model) {
super();
this.model = model;
this.zlevel = model.zlevel;
this.z = 10;
this.lamps = new Group({name: `${model.name}_Lamps`});
this.poles = new Group({name: `${model.name}_Poles`});
this._subType = 'SignalLamp';
this._val = '3'; /** 信号机*/
this._create();
}
_create() {
const model = this.model;
this.text = new Text({
zlevel: this.zlevel,
z: this.z,
position: [0, 0],
style: {
x: model.position.x + model.namePosition.x,
y: model.position.y + model.posit * (model.style.signalR + model.namePosition.y),
text: model.signalName,
textAlign: 'middle',
textVerticalAlign: model.posit === 1 ? 'top' : 'bottom',
textFont: 'bold ' + (model.style.textFontSize + 1) + 'px ' + model.style.textFontFormat,
textFill: model.style.signalTextGreen
}
});
this.ver = new Polyline({
zlevel: this.zlevel,
z: this.z - 2,
shape: {
points: [
[model.position.x, model.position.y + model.style.signalR * 1.2],
[model.position.x, model.position.y - model.style.signalR * 1.2]
]
},
style: {
lineWidth: model.style.signalLampStandardWidth,
stroke: model.style.signalLampStandardColor
}
});
this.hor = new Polyline({
zlevel: this.zlevel,
z: this.z - 1,
shape: {
points: [
[model.position.x, model.position.y],
[model.position.x + model.drict * model.style.signalR * 1.2, model.position.y]
]
},
style: {
lineWidth: model.style.signalLampStandardWidth,
stroke: model.style.signalLampStandardColor
}
});
this.add(this.lamps);
this.add(this.poles);
this.setShowName(model.isShowName);
this.setShowHighSigType(model.highType);
// 旋转
if (model.rotate) {
this.transformRotation(this.ver);
this.transformRotation(this.hor);
}
}
// border显示
setBorderVisible(isVisible) {
if (isVisible) {
this.textBorder.show();
this.lampsBorder.show();
} else {
this.textBorder.hide();
this.lampsBorder.hide();
}
}
// 设置显示信号灯名称
setShowName(isShow) {
if (isShow) this.add(this.text); else this.remove(this.text);
}
// 显示信号灯名称颜色
setNameColor(color) {
this.text.setStyle({ textFill: color });
}
setShowHighSigType(type) {
const model = this.model;
this.lamps.removeAll();
this.poles.removeAll();
this.poles.add(this.ver);
if (type === '01') this.poles.remove(this.hor); else this.poles.add(this.hor);
const highPosition = this.getEndPosition(model.highType);
for (let i = 0; i < model.lampCount; i++) {
const lamp = new Lamp({
style: model.style,
zlevel: this.zlevel,
lampCount: model.lampCount,
position: {
x: highPosition.x + i * model.drict * model.style.signalR * 2,
y: highPosition.y
},
index: i + 1,
origin: {
x: model.position.x,
y: model.position.y
},
rotate: model.rotate,
drict: model.drict,
highType: model.highType
});
this.lamps.add(lamp);
}
this.delay = new Text({
zlevel: this.zlevel,
style: {
x: model.position.x - model.drict * (model.style.signalLampStandardWidth),
y: model.position.y,
text: this.model.delayCount || 0,
textAlign: model.drict > 0 ? 'right' : 'left',
textVerticalAlign: 'middle',
textFont: 'bold ' + (model.style.textFontSize + 1) + 'px ' + model.style.textFontFormat,
textFill: model.style.signalTextRed
}
});
this.add(this.delay);
this.sigDriction = new JSigDrict({
style: model.style,
zlevel: this.zlevel,
position: {
x: highPosition.x + model.drict * (model.lampCount * model.style.signalR * 2 + model.style.signalR - 1),
y: model.position.y
},
drict: model.drict,
origin: {
x: model.position.x,
y: model.position.y
},
rotate: model.rotate
});
this.autoSig = new AutoSig({
style: model.style,
zlevel: this.zlevel,
position: {
x: highPosition.x,
y: highPosition.y
},
lampCount: model.lampCount,
drict: model.drict,
origin: {
x: model.position.x,
y: model.position.y
},
rotate: model.rotate
});
// 旋转
if (model.rotate) {
this.transformRotation(this.sigDriction);
this.transformRotation(this.autoSig);
this.transformRotation(this.lamps);
this.transformRotation(this.delay);
}
const rect = this.lamps.getBoundingRect();
rect.union(this.hor.getBoundingRect());
this.lampsBorder = new Rect({
zlevel: this.zlevel,
z: this.z - 3,
silent: true,
shape: rect,
style: {
lineDash: [3, 3],
stroke: model.style.borderColor,
fill: model.style.transparentColor
}
});
this.textBorder = new Rect({
zlevel: this.zlevel,
z: this.z - 1,
silent: true,
shape: this.text.getBoundingRect(),
style: {
lineDash: [3, 3],
stroke: model.style.borderColor,
fill: model.style.borderContextBackgroundColor
}
});
this.add(this.lampsBorder);
this.add(this.textBorder);
}
// 整体旋转信号灯
transformRotation(item) {
if (this.model.rotate) {
const origin = [this.model.position.x, this.model.position.y];
const rotation = -Math.PI / 180 * Number(this.model.rotate);
item.origin = origin;
item.rotation = rotation;
item.dirty();
}
}
setColorByIndex(index, color) {
for (let i = 0; i < this.model.lampCount; i++) {
if (this.lamps.childAt(i).model.index === index) {
this.lamps.childAt(i).setColor(color);
return;
}
}
}
setStopByIndex(index, has) {
for (let i = 0; i < this.model.lampCount; i++) {
if (this.lamps.childAt(i).model.index === index) {
this.lamps.childAt(i).setStop(has);
return;
}
}
}
setDelayUnlockAnimation() {
this.delay.show();
}
setAutoFlickerAnimation() {
this.autoSig.arrowsAnimation();
}
setRecover() {
this.delay.hide();
this.autoSig.animationRecover();
this.setNameColor(this.model.style.signalTextGreen);
}
setColorSig(color) {
this.autoSig.setColor(color);
}
getEndPosition(type) {
if (type === '01') {
return {
x: this.model.position.x + this.model.drict * this.model.style.signalR * 3 / 2,
y: this.model.position.y
};
} else {
return {
x: this.hor.shape.points[1][0] + this.model.drict * this.model.style.signalR,
y: this.hor.shape.points[1][1]
};
}
}
setShowSigDrict(showSigDrict) {
if (showSigDrict) this.add(this.sigDriction); else this.remove(this.sigDriction);
}
setAutoSig(isShow) {
if (isShow) this.add(this.autoSig); else this.remove(this.autoSig);
}
getShapeTipPoint() {
if (this.lamps) {
var distance = this.model.style.signalR;
this.lamps.dirty();
const rect = this.lamps.getBoundingRect();
return {
x: rect.x + Math.cos(Number(this.model.rotate)) * rect.width / 2 || (this.model.position.x),
y: rect.y + Math.cos(Number(this.model.rotate)) * rect.height / 2 - distance || (this.model.position.y - distance)
};
}
return null;
}
}
/** 按钮*/
class SigButton extends Group {
constructor(model) {
super();
this.model = model;
this.zlevel = model.zlevel;
this._subType = 'SignalButton';
this.z = 10;
this._create();
}
_create() {
const model = this.model;
this.sigNormalButtom = new Rect({
zlevel: this.zlevel,
z: this.z,
_subType: this._subType,
_val: '1',
shape: {
x: model.position.x - model.style.signalR,
y: 0,
width: model.style.signalR * 2,
height: model.style.signalR * 2
},
style: {
lineWidth: 0.2,
stroke: model.style.signalButtonDashColor,
fill: model.style.signalButtonColor
}
});
this.sigNormalButtomDown = new Polyline({
zlevel: this.zlevel,
z: this.z + 1,
silent: true,
shape: { points: [] },
style: {
lineWidth: 0.8,
stroke: model.style.backgroundColor
}
});
this.sigReentryButton = new Circle({
zlevel: this.zlevel,
z: this.z,
_subType: this._subType,
_val: '2', // 折返按钮
shape: {
cx: model.position.x,
cy: 0,
r: model.style.signalR
},
style: {
lineWidth: 0.2,
stroke: model.style.signalButtonDashColor,
fill: model.style.signalButtonColor
}
});
this.sigReentryButtonDown = new Arc({
zlevel: this.zlevel,
z: this.z + 1,
silent: true,
shape: {
cx: 0,
cy: 0,
r: 0,
startAngle: Math.PI * 8 / 5,
endAngle: Math.PI * 4 / 5,
clockwise: false
},
style: {
lineWidth: 0.8,
stroke: model.style.backgroundColor
}
});
this.add(this.sigNormalButtom);
this.add(this.sigReentryButton);
this.setSigDrict();
}
setSigDrict() {
const padding = 1;
const model = this.model;
const r = model.style.signalR * 0.8;
if (model.drict === 1) {
this.sigNormalButtom.attrKV('shape', {
y: model.position.y - 1 / 2 * r
});
this.sigReentryButton.attrKV('shape', {
cy: model.position.y - 5 / 2 * r
});
} else {
this.sigReentryButton.attrKV('shape', {
cy: model.position.y + 5 / 2 * r
});
this.sigNormalButtom.attrKV('shape', {
y: model.position.y - 3 / 2 * r
});
}
this.sigNormalButtomDown.attrKV('shape', {
points: [
[model.position.x - padding + r, this.sigNormalButtom.shape.y + padding],
[model.position.x + padding - r, this.sigNormalButtom.shape.y + padding],
[model.position.x + padding - r, this.sigNormalButtom.shape.y + padding * 2 + r]
]
});
this.sigReentryButtonDown.attrKV('shape', {
cx: this.sigReentryButton.shape.cx,
cy: this.sigReentryButton.shape.cy,
r: this.sigReentryButton.shape.r - padding
});
}
colorRecover() {
this.sigNormalButtom.setStyle('fill', this.model.style.signalButtonColor);
this.sigReentryButton.setStyle('fill', this.model.style.signalButtonColor);
}
animationRecover() {
this.sigNormalButtom.stopAnimation(true);
this.sigReentryButton.stopAnimation(true);
}
recover() {
this.colorRecover();
this.animationRecover();
}
setButtonStatus(buttonStatus) {
switch (buttonStatus) {
case '00':
case '01':
this.remove(this.sigNormalButtomDown);
this.remove(this.sigReentryButtonDown);
this.recover();
break;
case '02':
this.add(this.sigNormalButtomDown);
break;
case '03':
this.add(this.sigReentryButtonDown);
break;
case '04':
this.remove(this.sigNormalButtomDown);
this.sigNormalButtom.animateStyle(true)
.when(1000, {
fill: this.model.style.signalButtonLightenColor
})
.when(2000, {
fill: this.model.style.backgroundColor
})
.start();
break;
case '05':
this.remove(this.sigReentryButtonDown);
this.sigReentryButton.animateStyle(true)
.when(1000, {
fill: this.model.style.signalButtonLightenColor
})
.when(2000, {
fill: this.model.style.backgroundColor
})
.start();
break;
}
}
getShapeTipPoint(val) {
var view = null;
switch (val) {
case '1': {
view = this.sigNormalButtom;
break;
}
case '2': {
view = this.sigReentryButton;
break;
}
default: {
break;
}
}
if (view) {
var distance = 2;
var rect = view.getBoundingRect();
return {
x: rect.x + rect.width / 2,
y: rect.y - distance
};
}
return null;
}
}
export default class Signal extends Group {
constructor({ _code, _type, zlevel, model, state }, style) {
super();
this._code = _code;
this._type = _type;
this.zlevel = zlevel;
this.model = model;
this.state = state;
this.style = style;
this.selected = false;
this.lampCount = parseInt(model.lampPositionType);
this._create();
this.on('mousedown', this.mouseclick);
this.on('mouseout', this.mouseleave);
this.on('mouseover', this.mouseenter);
}
_create() {
const model = this.model;
const state = this.state;
const style = this.style;
const drict = model.directionType === '01' ? -1 : 1;
const posit = model.positionType === '01' ? -1 : 1;
// 信号灯文字说明
this.siglamp = new JSiglamp({
style: style,
zlevel: this.zlevel,
position: {
x: model.position.x,
y: model.position.y + posit * style.signalDistance
},
drict: drict,
posit: posit,
signalName: model.name,
namePosition: model.namePosition,
isShowName: model.nameShow,
highType: model.lampPostType,
lampCount: parseInt(model.lampPositionType),
showSigDrict: this.showSigDrict,
pop: true,
rotate: model.rotate
});
// 信号灯按钮
this.sigButton = new SigButton({
style: style,
zlevel: this.zlevel,
position: {
x: model.buttonPosition.x,
y: model.buttonPosition.y - posit * style.signalDistance
},
drict: posit,
pop: false
});
this.add(this.siglamp);
this.mouseStateRecover();
this.setState(state);
}
setButtonStatus(model) {
if (model.buttonShow) {
this.add(this.sigButton);
} else {
this.remove(this.sigButton);
}
if (this.sigButton) {
this.sigButton.setButtonStatus(model.buttonStatus);
}
}
setShowSigDrict(isShow) {
this.siglamp.setShowSigDrict(isShow);
}
setAutoSig(isShow) {
this.siglamp.setAutoSig(isShow);
}
setShowHighSigType(hightp) {
if (this.siglamp) {
this.highType = hightp;
this.siglamp.setShowHighSigType(hightp);
}
}
isPop(e) {
for (var i = 0; i < this.childCount(); i++) {
const rect = this.childAt(i).getBoundingRect();
if (rect.contain(e.offsetX, e.offsetY) && this.childAt(i).pop) {
return true;
}
}
}
// 关闭
close() {
if (this.lampCount === 1) {
if (this.model.useType === '05') {
/** 单灯 调车信号机*/
this.siglamp.setColorByIndex(1, this.style.signalLampBlueColor);
} else {
/** 单灯 出站信号机 */
/** 单灯 阻挡信号机*/
/** 单灯 阻挡兼调车信号 */
/** 单灯 列兼调信号机 */
this.siglamp.setColorByIndex(1, this.style.signalTextRed);
}
}
}
// 开放
open() {
if (this.lampCount === 1) {
/** 单灯 出站信号机*/
/** 单灯 阻隔信号机*/
this.siglamp.setColorByIndex(1, this.style.signalLampGreenColor);
}
}
// 列车进路
trainRoute() {
if (this.lampCount === 1) {
/** 单灯 列兼调信号*/
this.siglamp.setColorByIndex(1, this.style.signalLampYellowColor);
}
}
// 调车进路
shuntRoute() {
if (this.lampCount === 1) {
/** 单灯 列兼调信号*/
/** 单灯 阻挡兼调车信号*/
this.siglamp.setColorByIndex(1, this.style.signalLampWhiteColor);
}
}
// 引导
guid() {
}
// 封锁
block() {
this.siglamp.setColorByIndex(1, this.style.signalTextRed);
this.siglamp.setNameColor(this.style.sectionBlockTextColor);
}
// 功能封锁
functionBlock() {
}
// 信号保护区段监视状态显示
signalblock() {
}
// 故障
fault() {
}
// 物理点灯
logicalLight() {
for (var i = 0; i < this.lampCount; i++) {
this.siglamp.setStopByIndex(i + 1, false);
}
}
// 逻辑点灯
physicsLight() {
for (var i = 0; i < this.lampCount; i++) {
this.siglamp.setStopByIndex(i + 1, true);
}
}
// 设置自动进路模式状态类型
setAutoRouteOpen() {
if (this.model.linkageAutoRouteShow) {
this.siglamp.setAutoSig(true);
} else {
this.siglamp.setAutoSig(false);
}
this.siglamp.setRecover();
this.siglamp.setColorSig(this.style.signalLampGreenColor);
}
// 信号机进路自动触发模式状态类型
setAutoAccessOpen() {
if (this.model.atsAutoTriggerShow) {
this.siglamp.setAutoSig(true);
} else {
this.siglamp.setAutoSig(false);
}
this.siglamp.setRecover();
this.siglamp.setColorSig(this.style.signalLampYellowColor);
}
// 设置自动信号模式状态类型
setAutoSignalOpen() {
this.siglamp.setShowSigDrict(true);
}
// 隐藏自动信号和自动进路
setAutoClose() {
this.siglamp.setColorSig(this.style.backgroundColor);
this.siglamp.setAutoSig(false);
this.siglamp.setShowSigDrict(false);
}
// 自动信号和自动进路开始动画
setAutoFlicker() {
this.siglamp.setAutoFlickerAnimation();
}
// 设置延时解锁
setDelayUnlock() {
this.siglamp.setDelayUnlockAnimation();
}
// 恢复状态
recover() {
this.siglamp.setRecover();
}
setState(state) {
this.recover();
/** 设置状态 (点灯类型)*/
switch (state.status) {
case '01': this.close(); break; // 关闭
case '02': this.open(); break; // 开放
case '03': this.guid(); break; // 引导
case '04': this.block(); break; // 封锁
case '05': this.fault(); break; // 故障
case '06': this.block(); break; // 功能封锁
case '07': this.signalblock(); break; // 信号保护区段检测
}
/** 进路性质类型*/
switch (state.natureType) {
case '01': this.trainRoute(); break; // 列车进路
case '02': this.shuntRoute(); break; // 调车进路
}
/** 设置点灯类型*/
switch (state.lightType) {
case '01': this.logicalLight(); break; // 设置逻辑点灯
case '02': this.physicsLight(); break; // 设置物理点灯
}
/** 设置自动类型*/
switch (state.autoType) {
case '01': this.setAutoClose(); break; // 隐藏 隐藏自动信号和自动进路
case '02': this.setAutoSignalOpen(); break; // 显示 设置自动信号模式状态类型
case '03': this.setAutoRouteOpen(); break; // 显示 设置自动进路模式状态类型
case '04': this.setAutoAccessOpen(); break; // 显示 信号机进路自动触发模式状态类型
}
/** 延时解锁*/
state.delayType = '02';
switch (state.delayType) {
case '01': break; // 未延时解锁
case '02': break; // 人工闭塞延时解锁
case '03': break; // 自动闭塞延时解锁
}
/** 信号机进路办理，先停止动画，再判断当前颜色是否闪烁*/
if (state.routeSetting && (state.autoType == '03' || state.autoType == '04')) {
this.setAutoFlicker();
}
}
getShapeTipPoint(val) {
if (val === '1' || val === '2') {
return this.sigButton.getShapeTipPoint(val);
} else {
return this.siglamp.getShapeTipPoint(val);
}
}
mouseStateVisible() {
this.siglamp.setBorderVisible(true);
this.siglamp.setNameColor('#000');
}
mouseStateRecover() {
this.siglamp.setBorderVisible(false);
this.siglamp.setNameColor(this.style.signalTextGreen);
}
mouseclick(e) {
if ([3].includes(e.which)) {
this.selected = !this.selected;
if (this.selected) {
this.mouseStateVisible();
}
}
}
mouseenter() {
if (!this.selected) {
this.mouseStateVisible();
}
}
mouseleave() {
if (!this.selected) {
this.mouseStateRecover();
}
}
}

52
src/jmap/shape/element/EAutoSig.js Normal file
View File

@ -0,0 +1,52 @@
import Polygon from 'zrender/src/graphic/shape/Polygon';
import Group from 'zrender/src/container/Group';
import { arrows } from './libs/ShapePoints';
class EAutoSig extends Group {
constructor({position, count, drict, zlevel, z, style}) {
super();
const rotation = drict != 1? 0 : Math.PI;
const x = position.x + drict * (count * style.Signal.signalR + style.Signal.signalLampStandardWidth) * 2;
const y = position.y - style.Signal.signalLampStandardWidth;
this.style = style;
this.arrows = new Polygon({
zlevel: zlevel,
z: z,
rotation: rotation,
origin: [x, y],
shape: {
points: arrows(x, y, style.Signal.stationControlDistance / 8, style.Signal.signalR * 0.8)
},
style: {
stroke: style.Signal.sidelineColor,
lineWidth: 0.6,
fill: style.Signal.signalLampGreenColor
}
});
this.add(this.arrows);
}
// 停止动画
animationRecover() {
this.arrows.stopAnimation(false);
}
// 箭头颜色
setColor(color) {
color && this.arrows.setStyle('fill', color);
}
// 箭头闪烁
arrowsAnimation() {
const fill = this.arrows.style.Signal.fill;
this.arrows.animate(true)
.when(1000, { fill: this.style.backgroundColor, stroke: this.style.style.backgroundColor })
.when(2000, { fill: fill, stroke: this.style.style.Signal.sidelineColor })
.when(3000, { fill: this.style.style.backgroundColor, stroke: this.style.style.backgroundColor })
.when(4000, { fill: fill, stroke: this.style.style.Signal.sidelineColor })
.start();
}
}
export default EAutoSig;

101
src/jmap/shape/element/ESigButton.js Normal file
View File

@ -0,0 +1,101 @@
import Polyline from 'zrender/src/graphic/shape/Polyline';
import Circle from 'zrender/src/graphic/shape/Circle';
import Arc from 'zrender/src/graphic/shape/Arc';
import Rect from 'zrender/src/graphic/shape/Rect';
import Group from 'zrender/src/container/Group';
class ESigButton extends Group {
constructor({position, posit, show, zlevel, z, style}) {
super();
const padding = 1;
const r = style.Signal.signalR * 0.8;
this.style = style;
this._subType = 'SignalButton';
this.sigNormalButtom = new Rect({
zlevel: zlevel,
z: z,
_subType: this._subType,
_val: '1',
shape: {
x: position.x - style.Signal.signalR,
y: position.y - r + r * posit,
width: style.Signal.signalR * 2,
height: style.Signal.signalR * 2
},
style: {
lineWidth: 0.2,
stroke: style.Signal.signalButtonDashColor,
fill: style.Signal.signalButtonColor
}
});
this.sigReentryButton = new Circle({
zlevel: zlevel,
z: z,
_subType: this._subType,
_val: '2', // 折返按钮
shape: {
cx: position.x,
cy: position.y - 5 / 2 * r * posit,
r: style.Signal.signalR
},
style: {
lineWidth: 0.2,
stroke: style.Signal.signalButtonDashColor,
fill: style.Signal.signalButtonColor
}
});
this.sigNormalButtomDown = new Polyline({
zlevel: zlevel,
z: z + 1,
silent: true,
shape: { points: [
[position.x - padding + r, this.sigNormalButtom.shape.y + padding],
[position.x + padding - r, this.sigNormalButtom.shape.y + padding],
[position.x + padding - r, this.sigNormalButtom.shape.y + padding * 2 + r]
] },
style: {
lineWidth: 0.8,
stroke: style.backgroundColor
}
});
this.sigReentryButtonDown = new Arc({
zlevel: zlevel,
z: z + 1,
silent: true,
shape: {
cx: this.sigReentryButton.shape.cx,
cy: this.sigReentryButton.shape.cy,
r: this.sigReentryButton.shape.r - padding,
startAngle: Math.PI * 8 / 5,
endAngle: Math.PI * 4 / 5,
clockwise: false
},
style: {
lineWidth: 0.8,
stroke: style.backgroundColor
}
});
this.add(this.sigNormalButtom);
this.add(this.sigReentryButton);
this.setVisible(show);
}
setVisible(show) {
if (show) {
this.sigNormalButtom.show();
this.sigReentryButton.show();
} else {
this.sigNormalButtom.hide();
this.sigReentryButton.hide();
}
}
}
export default ESigButton;

24
src/jmap/shape/element/ESigDrict.js Normal file
View File

@ -0,0 +1,24 @@
import Polygon from 'zrender/src/graphic/shape/Polygon';
import Group from 'zrender/src/container/Group';
import { triangular } from './libs/ShapePoints';
class ESigDrict extends Group {
constructor({position, drict, zlevel, z, style}) {
super();
this.sigDrict = new Polygon({
zlevel: zlevel,
z: z,
shape: {
points: triangular(position.x, position.y, drict, style.Signal.signalR)
},
style: {
stroke: style.backgroundColor,
lineWidth: 0.5,
fill: style.Signal.signalLampYellowColor
}
});
this.add(this.sigDrict);
}
}
export default ESigDrict;

76
src/jmap/shape/element/ESigLmap.js Normal file
View File

@ -0,0 +1,76 @@
import Line from 'zrender/src/graphic/shape/Line';
import Arc from 'zrender/src/graphic/shape/Arc';
import Group from 'zrender/src/container/Group';
class ESigLmap extends Group {
constructor({index, position, origin, zlevel, z, style}) {
super();
this.lamp = new Arc({
name: index,
zlevel: zlevel + 1,
z: z,
shape: {
cx: position.x,
cy: position.y,
r: style.Signal.signalR
},
style: {
lineWidth: 0.4,
fill: style.backgroundColor,
stroke: style.Signal.signalLampStandardColor
}
});
this.lstop = new Line({
zlevel: zlevel + 1,
z: z,
origin: origin,
// rotation: -Math.PI / 180 * rotate,
shape: {
x1: position.x + (style.Signal.signalR + 1) * Math.cos(Math.PI / 4),
y1: position.y + (style.Signal.signalR + 1) * Math.sin(Math.PI / 4),
x2: position.x - (style.Signal.signalR + 1) * Math.cos(Math.PI / 4),
y2: position.y - (style.Signal.signalR + 1) * Math.sin(Math.PI / 4)
},
style: {
lineWidth: 1.5,
stroke: style.backgroundColor
}
});
this.rstop = new Line({
zlevel: zlevel + 1,
z: z,
origin: origin,
// rotation: -Math.PI / 180 * rotate,
shape: {
x1: position.x + (style.Signal.signalR + 1) * Math.cos(Math.PI / 4),
y1: position.y + (style.Signal.signalR + 1) * (Math.sin(Math.PI / 4) - Math.sqrt(2)),
x2: position.x - (style.Signal.signalR + 1) * Math.cos(Math.PI / 4),
y2: position.y - (style.Signal.signalR + 1) * (Math.sin(Math.PI / 4) - Math.sqrt(2))
},
style: {
lineWidth: 1.5,
stroke: style.backgroundColor
}
});
this.add(this.lamp);
}
setColor(color) {
color && this.lamp.setStyle('fill', color);
}
setStop(has) {
if (has) {
this.lstop.show();
this.rstop.show();
} else {
this.lstop.hide();
this.rstop.hide();
}
}
}
export default ESigLmap;

63
src/jmap/shape/element/ESigPost.js Normal file
View File

@ -0,0 +1,63 @@
import Polyline from 'zrender/src/graphic/shape/Polyline';
import Group from 'zrender/src/container/Group';
class ESigPost extends Group {
constructor({position, drict, type, zlevel, z, style}) {
super();
this.drict = drict;
this.position = position;
this.style = style;
this.ver = new Polyline({
zlevel: zlevel,
z: z,
shape: {
points: [
[position.x, position.y + style.Signal.signalR * 1.2],
[position.x, position.y - style.Signal.signalR * 1.2]
]
},
style: {
lineWidth: style.Signal.signalLampStandardWidth,
stroke: style.Signal.signalLampStandardColor
}
});
this.hor = new Polyline({
zlevel: zlevel,
z: z,
shape: {
points: [
[position.x, position.y],
[position.x + drict * style.Signal.signalR * 1.2, position.y]
]
},
style: {
lineWidth: style.Signal.signalLampStandardWidth,
stroke: style.Signal.signalLampStandardColor
}
});
this.add(this.ver);
this.add(this.hor);
type === '01' ? this.hor.hide() : this.hor.show();
}
getLampPosition(type) {
if (type === '01') {
return {
x: this.position.x + this.drict * this.style.Signal.signalR * 3 / 2,
y: this.position.y
};
} else {
return {
x: this.hor.shape.points[1][0] + this.drict * this.style.Signal.signalR,
y: this.hor.shape.points[1][1]
};
}
}
}
export default ESigPost;

49
src/jmap/theme/bejing.js
View File

@ -1,5 +1,5 @@
import defaultSkin from '../config/defaultSkin';
// import deviceType from '../constant/deviceType';
import deviceType from '../constant/deviceType';
class Beijing extends defaultSkin {
constructor() {
@ -11,6 +11,53 @@ class Beijing extends defaultSkin {
};
this[deviceType.Signal] = {
/** 信号机宽度 */
signalR: 6,
/** 灯柱宽度*/
signalLampStandardWidth: 1.2,
/** 设备距离区段的距离*/
signalDistance: 5,
/** 信号灯按钮边线*/
signalButtonDashColor: '#FFFFFF',
/** 信号灯按钮颜色*/
signalButtonColor: 'darkgreen',
/** 信号灯按钮闪烁颜色*/
signalButtonLightenColor: '#E4EF50',
/** 信号灯字体颜色*/
signalTextColor: '#007600',
/** 信号灯灯柱颜色*/
signalLampStandardColor: '#5578B6',
/** 信号灯锁闭*/
signalBlockColor: '#EF0C08',
/** 信号灯灰色*/
signalLampGrayColor: '#7F7F7F',
/** 信号灯红色*/
signalLampRedColor: '#FF0000',
/** 信号灯绿色*/
signalLampGreenColor: '#00FF00',
/** 信号灯黄色*/
signalLampYellowColor: '#FFFF00',
/** 信号灯白色*/
signalLampWhiteColor: '#FFFFFF',
/** 信号灯蓝色*/
signalLampBlueColor: '#0070C0'
};
}
}