Merge branch 'master' of https://git.cloud.tencent.com/joylink/jl-nclient
# Conflicts: # src/jmap/config/deviceStyle.js # src/jmap/config/deviceType.js # src/jmap/shape/factory.js # src/jmap/utils/parser.js
This commit is contained in:
fan
commit
b35470c513
@ -11,38 +11,92 @@ deviceRender[deviceType.Link] = {
|
||||
/** Section渲染配置*/
|
||||
deviceRender[deviceType.Section] = {
|
||||
zlevel: 1,
|
||||
progressive: 2,
|
||||
}
|
||||
progressive: 2
|
||||
};
|
||||
|
||||
/** Signal渲染配置*/
|
||||
deviceRender[deviceType.Signal] = {
|
||||
zlevel: 1,
|
||||
progressive: 3,
|
||||
}
|
||||
progressive: 3
|
||||
};
|
||||
|
||||
/** Switch渲染配置*/
|
||||
deviceRender[deviceType.Switch] = {
|
||||
zlevel: 3,
|
||||
progressive: 5,
|
||||
}
|
||||
progressive: 5
|
||||
};
|
||||
|
||||
/** Station渲染配置*/
|
||||
deviceRender[deviceType.Station] = {
|
||||
zlevel: 1,
|
||||
progressive: 4,
|
||||
}
|
||||
progressive: 4
|
||||
};
|
||||
|
||||
/** StationStand渲染配置*/
|
||||
deviceRender[deviceType.StationStand] = {
|
||||
zlevel: 1,
|
||||
progressive: 5,
|
||||
}
|
||||
progressive: 5
|
||||
};
|
||||
|
||||
/** StationControl渲染配置*/
|
||||
deviceRender[deviceType.StationControl] = {
|
||||
zlevel: 1,
|
||||
progressive: 4,
|
||||
}
|
||||
progressive: 4
|
||||
};
|
||||
|
||||
/** ImageControl渲染配置*/
|
||||
deviceRender[deviceType.ImageControl] = {
|
||||
zlevel: 1,
|
||||
progressive: 5
|
||||
};
|
||||
|
||||
/** ZcControl渲染配置*/
|
||||
deviceRender[deviceType.ZcControl] = {
|
||||
zlevel: 1,
|
||||
progressive: 6
|
||||
};
|
||||
|
||||
/** LcControl渲染配置*/
|
||||
deviceRender[deviceType.LcControl] = {
|
||||
zlevel: 1,
|
||||
progressive: 6
|
||||
};
|
||||
|
||||
/** LimitControl渲染配置*/
|
||||
deviceRender[deviceType.LimitControl] = {
|
||||
zlevel: 1,
|
||||
progressive: 5
|
||||
};
|
||||
|
||||
/** StationDelayUnlock渲染配置*/
|
||||
deviceRender[deviceType.StationDelayUnlock] = {
|
||||
zlevel: 1,
|
||||
progressive: 6
|
||||
};
|
||||
|
||||
/** Train渲染配置*/
|
||||
deviceRender[deviceType.Train] = {
|
||||
zlevel: 1,
|
||||
progressive: 9
|
||||
};
|
||||
|
||||
/** TrainWindow渲染配置*/
|
||||
deviceRender[deviceType.TrainWindow] = {
|
||||
zlevel: 1,
|
||||
progressive: 8
|
||||
};
|
||||
|
||||
/** Line渲染配置*/
|
||||
deviceRender[deviceType.Line] = {
|
||||
zlevel: 1,
|
||||
progressive: 7
|
||||
};
|
||||
|
||||
/** Text渲染配置*/
|
||||
deviceRender[deviceType.Text] = {
|
||||
zlevel: 1,
|
||||
progressive: 7
|
||||
};
|
||||
|
||||
/** TrainWindow渲染配置*/
|
||||
deviceRender[deviceType.TrainWindow] = {
|
||||
|
||||
@ -2,19 +2,329 @@ import deviceType from './deviceType';
|
||||
|
||||
const deviceState = {};
|
||||
|
||||
/** link状态配置*/
|
||||
deviceState[deviceType.Link] = {
|
||||
deviceState[deviceType.Section] = {
|
||||
/** 区段状态*/
|
||||
status: {
|
||||
Default: '01', // 01默认状态
|
||||
State01: '01', // 01状态
|
||||
State02: '02' // 02状态
|
||||
Default: '01', /** 空闲（缺省值）*/
|
||||
State00: '00', /** 未定义状态 */
|
||||
State01: '01', /** 空闲 */
|
||||
State02: '02', /** 通信车占用 */
|
||||
State03: '03', /** 非通信车占用 */
|
||||
State04: '04', /** 进路锁闭 */
|
||||
State05: '05', /** 故障锁闭 */
|
||||
State06: '06', /** 封锁 */
|
||||
State07: '07', /** ATC切除 */
|
||||
State08: '08', /** ATS切除 */
|
||||
State09: '09', /** 进路延续保护 */
|
||||
State10: '10', /** 延时释放 */
|
||||
State11: '11', /** 保护区段锁闭 */
|
||||
State12: '12', /** 保护区段延时解锁 */
|
||||
State13: '13', /** ARB出清检测错误状态 */
|
||||
State14: '14' /** 计轴失效 */
|
||||
},
|
||||
/** 限速*/
|
||||
speedUpperLimit: {
|
||||
Default: -1 /** 不限速*/
|
||||
},
|
||||
/** 是否切除*/
|
||||
cutOff: {
|
||||
Default: false /** 是否切除*/
|
||||
},
|
||||
/** 是否故障*/
|
||||
fault: {
|
||||
Default: false /** 非故障*/
|
||||
}
|
||||
};
|
||||
deviceState[deviceType.Section] = {
|
||||
|
||||
deviceState[deviceType.Switch] = {
|
||||
/** 定位状态*/
|
||||
locateType: {
|
||||
Default: '01', /** 道岔位置类型 - 定位（缺省值）*/
|
||||
State01: '01', /** 道岔位置类型 - 定位 */
|
||||
State02: '02', /** 道岔位置类型 - 反位 */
|
||||
State03: '03', /** 道岔位置类型 - 失去表示 */
|
||||
State04: '04' /** 道岔位置类型 - 挤岔 */
|
||||
},
|
||||
/** 道岔状态*/
|
||||
status: {
|
||||
Default: '01', // 01默认状态
|
||||
State01: '01', // 01状态
|
||||
State02: '02' // 02状态
|
||||
Default: '01', /** 道岔状态类型 - 空闲（缺省值）*/
|
||||
State01: '01', /** 道岔状态类型 - 空闲 */
|
||||
State02: '02', /** 道岔状态类型 - 通信车占用 */
|
||||
State03: '03', /** 道岔状态类型 - 非通信车占用 */
|
||||
State04: '04', /** 道岔状态类型 - 进路锁闭 */
|
||||
State05: '05', /** 道岔状态类型 - 故障锁闭 */
|
||||
State06: '06', /** 道岔状态类型 - 进路延续保护 */
|
||||
State07: '07', /** 道岔状态类型 - 进路延续保护解锁 */
|
||||
State08: '08', /** 道岔状态类型 - ATC切除 */
|
||||
State09: '09', /** 道岔状态类型 - ATS切除 */
|
||||
State10: '10', /** 道岔状态类型 - 人工单锁 */
|
||||
State11: '11', /** 道岔状态类型 - 逻辑锁 */
|
||||
State12: '12', /** 道岔状态类型 - 人工锁+逻辑锁 */
|
||||
State13: '13', /** 道岔状态类型 - 延时释放*/
|
||||
State14: '14' /** 道岔状态类型 - 封锁*/
|
||||
},
|
||||
/** 是否故障*/
|
||||
fault: {
|
||||
Default: false /** 非故障*/
|
||||
},
|
||||
/** 是否切除*/
|
||||
cutOff: {
|
||||
Default: false /** 是否切除*/
|
||||
}
|
||||
};
|
||||
|
||||
deviceState[deviceType.Signal] = {
|
||||
/** 进路性质类型 */
|
||||
natureType: {
|
||||
Default: '00', /** 无状态（缺省值）*/
|
||||
State01: '01', /** 列车进路 */
|
||||
State02: '02', /** 调车进路 */
|
||||
State03: '03' /** 折返进路 */
|
||||
},
|
||||
/** 信号机状态类型 */
|
||||
status: {
|
||||
Default: '01', /** 关闭（缺省值）*/
|
||||
State01: '01', /** 关闭 */
|
||||
State02: '02', /** 开放 */
|
||||
State03: '03', /** 引导 */
|
||||
State04: '04', /** 封锁 */
|
||||
State05: '05' /** 故障 */
|
||||
},
|
||||
/** 信号机状态类型 */
|
||||
lightType: {
|
||||
Default: '01', /** 物理点灯（缺省值）*/
|
||||
State01: '01', /** 物理点灯 */
|
||||
State02: '02' /** 逻辑点灯 */
|
||||
},
|
||||
/** 信号机延时状态类型 */
|
||||
delayType: {
|
||||
Default: '01', /** 未延时解锁（缺省值）*/
|
||||
State01: '01', /** 未延时解锁 */
|
||||
State02: '02', /** 人工闭塞延时解锁 */
|
||||
State03: '03' /** 自动闭塞延时解锁 */
|
||||
},
|
||||
/** 信号机自动信号状态类型 */
|
||||
autoType: {
|
||||
Default: '01', /** 隐藏（缺省值）*/
|
||||
State01: '01', /** 隐藏 */
|
||||
State02: '02', /** 设置自动信号模式状态类型 */
|
||||
State03: '03', /** 设置自动进路模式状态类型 */
|
||||
State04: '04' /** 信号机进路自动触发模式状态类型 */
|
||||
},
|
||||
/** 信号机自动通过信号状态类型 */
|
||||
autoAccessType: {
|
||||
Default: '01', /** 不自动通过（缺省值）*/
|
||||
State01: '01', /** 不自动通过 */
|
||||
State02: '02' /** 自动通过 */
|
||||
},
|
||||
/** 信号机按钮状态类型 */
|
||||
buttonState: {
|
||||
Default: '01', /** 空闲（缺省值）*/
|
||||
State01: '01', /** 空闲 */
|
||||
State02: '02', /** 选择基本进路始端 */
|
||||
State03: '03', /** 选择折返进路始端 */
|
||||
State04: '04', /** 基本进路终端待选 */
|
||||
State05: '05' /** 折返进路终端待选 */
|
||||
},
|
||||
/** 引导信号按钮状态类型 */
|
||||
guideState: {
|
||||
Default: '01', /** 空闲（缺省值）*/
|
||||
State01: '01', /** 空闲 */
|
||||
State02: '02' /** 引导 */
|
||||
|
||||
},
|
||||
/** 道岔定位状态*/
|
||||
switchLocateType: {
|
||||
Default: '01', /** 定位（缺省值）*/
|
||||
State01: '01', /** 定位*/
|
||||
State02: '02' /** 反位*/
|
||||
},
|
||||
/** 信号机进路办理*/
|
||||
routeSetting: {
|
||||
Default: false /** 信号机进路办理*/
|
||||
},
|
||||
/** 是否故障*/
|
||||
fault: {
|
||||
Default: false /** 非故障*/
|
||||
}
|
||||
};
|
||||
|
||||
deviceState[deviceType.Station] = {
|
||||
/** 是否故障*/
|
||||
fault: {
|
||||
Default: false /** 非故障*/
|
||||
}
|
||||
};
|
||||
|
||||
deviceState[deviceType.StationControl] = {
|
||||
/** 控制模式状态 */
|
||||
status: {
|
||||
Default: '01', /** 中控（缺省值）*/
|
||||
State01: '01', /** 中控 */
|
||||
State02: '02', /** 站控 */
|
||||
State03: '03' /** 紧急站控 */
|
||||
},
|
||||
/** 是否故障*/
|
||||
fault: {
|
||||
Default: false /** 非故障*/
|
||||
}
|
||||
};
|
||||
|
||||
deviceState[deviceType.StationDelayUnlock] = {
|
||||
/** 延迟解锁状态*/
|
||||
status: {
|
||||
Default: '01', /** 关闭（默认值）*/
|
||||
State01: '01', /** 关闭 */
|
||||
State02: '02' /** 显示 */
|
||||
|
||||
},
|
||||
/** 是否故障*/
|
||||
fault: {
|
||||
Default: false /** 非故障*/
|
||||
}
|
||||
};
|
||||
|
||||
deviceState[deviceType.StationStand] = {
|
||||
/** 车站状态*/
|
||||
status: {
|
||||
Default: '01', /** 空闲（缺省值）*/
|
||||
State01: '01', /** 空闲 */
|
||||
State02: '02', /** 列车停站 */
|
||||
State05: '03' /** 站台紧急关闭 */
|
||||
},
|
||||
/** 屏蔽门状态*/
|
||||
screenDoorState: {
|
||||
Default: '01', /** 关门（缺省值）*/
|
||||
State01: '01', /** 正常 */
|
||||
State02: '02', /** 故障 */
|
||||
State03: '03' /** 切除 */
|
||||
},
|
||||
/** 屏蔽门开门状态*/
|
||||
screenDoorOpenState: {
|
||||
Default: '01', /** 关门（缺省值）*/
|
||||
State01: '01', /** 关门 */
|
||||
State02: '02' /** 开门 */
|
||||
},
|
||||
/** 扣车状态*/
|
||||
holdState: {
|
||||
Default: '01', /** 未设置扣车（缺省值）*/
|
||||
State01: '01', /** 未设置扣车*/
|
||||
State02: '02', /** 车站扣车*/
|
||||
State03: '03', /** 中心扣车*/
|
||||
State04: '04' /** 中心+车站扣车*/
|
||||
},
|
||||
/** 跳停*/
|
||||
jumpStopState: {
|
||||
Default: '01', /** 未设置跳停（缺省值）*/
|
||||
State01: '01', /** 未设置跳停 */
|
||||
State02: '02', /** 指定列车跳停 */
|
||||
State03: '03' /** 全部跳停 */
|
||||
},
|
||||
/** 停站时间*/
|
||||
parkingTime: {
|
||||
Default: -1 /** 无停站时间*/
|
||||
},
|
||||
/** 运行等级*/
|
||||
intervalRunTime: {
|
||||
Default: -1 /** 无运行等级*/
|
||||
},
|
||||
/** 折返策略*/
|
||||
reentryStrategy: {
|
||||
Default: '01', /** 默认（缺省值）*/
|
||||
State01: '01', /** 无折返策略 */
|
||||
State02: '02', /** 无人折返 */
|
||||
State03: '03', /** 自动换端 */
|
||||
State04: '04' /** 默认 */
|
||||
},
|
||||
/** 是否故障*/
|
||||
fault: {
|
||||
Default: false /** 非故障*/
|
||||
}
|
||||
};
|
||||
|
||||
deviceState[deviceType.Train] = {
|
||||
/** 列车类型*/
|
||||
type: {
|
||||
Default: '01', /** 计划车-指运行图编制出的有车组号、表号、车次号的列车（缺省值）*/
|
||||
State01: '01', /** 计划车-指运行图编制出的有车组号、表号、车次号的列车*/
|
||||
State02: '02', /** 头码车-指赋予了车组号和运行目的地的非计划列车*/
|
||||
State03: '03' /** 人工车-指由调度员手工添加的并人工组织运行的只赋予车组号的非计划列车*/
|
||||
},
|
||||
/** 服务号状态类型*/
|
||||
serverNoType: {
|
||||
Default: '01', /** 显示服务号，白色（缺省值）*/
|
||||
State01: '01', /** 显示服务号，白色 */
|
||||
State02: '02', /** 显示车组号（计划车、头码车），黄色 */
|
||||
State03: '03' /** 显示车组号（人工车），粉色 */
|
||||
},
|
||||
/** 目的地状态类型*/
|
||||
destinationState: {
|
||||
Default: '01', /** 准点（缺省值）*/
|
||||
State01: '01', /** 准点*/
|
||||
State02: '02', /** 早点*/
|
||||
State03: '03', /** 严重早点*/
|
||||
State04: '04', /** 晚点*/
|
||||
State05: '05', /** 严重晚点*/
|
||||
State06: '06', /** 头码车*/
|
||||
State07: '07' /** ATP切除*/
|
||||
},
|
||||
/** 运行方向状态类型*/
|
||||
directionType: {
|
||||
Default: '01', /** 未知方向（缺省值）*/
|
||||
State01: '01', /** 未知方向 */
|
||||
State02: '02', /** 从左向右 */
|
||||
State03: '03' /** 从右向左 */
|
||||
},
|
||||
/** 运行状态*/
|
||||
runState: {
|
||||
Default: '01', /** 停止（缺省值）*/
|
||||
State01: '01', /** 停止 */
|
||||
State02: '02' /** 运行 */
|
||||
},
|
||||
/** 运行模式*/
|
||||
runMode: {
|
||||
Default: '01', /** 未知模式（缺省值）*/
|
||||
State01: '01', /** 未知模式 */
|
||||
State02: '02', /** ATO自动驾驶模式 AM */
|
||||
State03: '03', /** ATP监控下的人工驾驶模式 CM */
|
||||
State04: '04', /** 限制人工驾驶模式 RM */
|
||||
State05: '05' /** 非限制人工驾驶模式 RM */
|
||||
},
|
||||
/** 运行控制状态类型*/
|
||||
runControlState: {
|
||||
Default: '01', /** 正常（缺省值）*/
|
||||
State01: '01', /** 正常 */
|
||||
State02: '02', /** 扣车 */
|
||||
State03: '03' /** 跳停 */
|
||||
},
|
||||
/** 车门状态 */
|
||||
doorState: {
|
||||
Default: '01', /** 关门（缺省值）*/
|
||||
State01: '01', /** 关门 */
|
||||
State02: '02', /** 开门 */
|
||||
State03: '03' /** 故障 */
|
||||
},
|
||||
/** 通信状态类型*/
|
||||
communicationState: {
|
||||
Default: '01', /** 正常（缺省值）*/
|
||||
State01: '01', /** 正常 */
|
||||
State02: '02' /** 故障 */
|
||||
},
|
||||
/** 计划冲突状态*/
|
||||
planConflictState: {
|
||||
Default: '01', /** 无冲突（缺省值）*/
|
||||
State01: '01', /** 无冲突 */
|
||||
State02: '02' /** 有冲突 */
|
||||
},
|
||||
/** 报警状态*/
|
||||
alarmState: {
|
||||
Default: '01', /** 无报警（缺省值）*/
|
||||
State01: '01', /** 无报警 */
|
||||
State02: '02' /** 有报警 */
|
||||
},
|
||||
/** 是否故障*/
|
||||
fault: {
|
||||
Default: false /** 非故障*/
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
@ -125,10 +125,10 @@ fuzhouSkin[deviceType.Section] = {
|
||||
|
||||
fuzhouSkin[deviceType.Signal] = {
|
||||
/** 信号机宽度 */
|
||||
signalR: 6.5,
|
||||
signalR: 7,
|
||||
|
||||
/** 灯柱宽度*/
|
||||
signalLampStandardWidth: 1.5,
|
||||
signalLampStandardWidth: 1,
|
||||
|
||||
/** 设备距离区段的距离*/
|
||||
signalDistance: 13,
|
||||
@ -149,7 +149,7 @@ fuzhouSkin[deviceType.Signal] = {
|
||||
signalTextGreen: '#00FF00',
|
||||
|
||||
/** 信号灯灯柱颜色*/
|
||||
signalLampStandardColor: '#FFFFFF',
|
||||
signalLampStandardColor: '#606060',
|
||||
|
||||
/** 信号灯灰色*/
|
||||
signalLampGrayColor: '#7F7F7F',
|
||||
@ -164,168 +164,150 @@ fuzhouSkin[deviceType.Signal] = {
|
||||
signalLampWhiteColor: '#FFFFFF',
|
||||
|
||||
/** 信号灯蓝色*/
|
||||
signalLampBlueColor: '#0000FF'
|
||||
};
|
||||
fuzhouSkin[deviceType.StationStand] = {
|
||||
/** 站台空闲颜色*/
|
||||
stationStandSpareColor: '#74747C',
|
||||
|
||||
/** 列车边线颜色*/
|
||||
trainSidelineColor: '#C0C0C0',
|
||||
|
||||
/** 站台和屏蔽门之间的距离*/
|
||||
stationStandDistance: 8,
|
||||
|
||||
/** 站台无人折返*/
|
||||
stationStandNoHumanReentryColor: '#0F16DA',
|
||||
|
||||
/** 站台首端字体大小*/
|
||||
stationStandHeadFontSize: 10,
|
||||
|
||||
/** 中心扣车颜色*/
|
||||
stationStandCenterDetainTrainColor: '#FFFFFF',
|
||||
|
||||
/** 默认字体 族类*/
|
||||
textFontFormat: '宋体', //consolas
|
||||
|
||||
/** 默认背景 颜色*/
|
||||
backgroundColor: '#000000',
|
||||
|
||||
/** 默认字体 大小*/
|
||||
textFontSize: 8.2,
|
||||
|
||||
/** 停站时间字体颜色*/
|
||||
stationStandTimeTextColor: '#FFFFFF',
|
||||
|
||||
/** 站台紧急关闭颜色*/
|
||||
stationStandEmergentCloseColor: '#F61107',
|
||||
|
||||
/** 站台屏蔽门高度*/
|
||||
statonStandSafeHeight: 1.6,
|
||||
|
||||
/** 屏蔽门默认颜色*/
|
||||
stationStandDoorDefaultColor: '#4DD43F',
|
||||
|
||||
/** 站台列车停站颜色*/
|
||||
stationStandStopColor: '#FEFE00',
|
||||
|
||||
/** 站台指定列车跳停颜色*/
|
||||
stationStandDesignatedJumpStopColor: 'lightSkyBlue',
|
||||
|
||||
/** 站台跳停颜色*/
|
||||
stationStandJumpStopColor: '#9A99FF',
|
||||
|
||||
/** 车站扣除文字颜色*/
|
||||
stationstandDetainTrainTextColor: '#E4EF50',
|
||||
|
||||
/** 屏蔽门切除颜色*/
|
||||
stationStandSplitDoorColor: '#F61107',
|
||||
|
||||
/** 站台自动换端*/
|
||||
stationStandAutoChangeEndsColor: '#0BF400',
|
||||
|
||||
/** 默认border文字背景色*/
|
||||
borderContextBackgroundColor: '#00FFFF',
|
||||
|
||||
/** 默认边线 颜色*/
|
||||
sidelineColor: '#FFFFFF',
|
||||
signalLampBlueColor: '#0000FF',
|
||||
|
||||
/** 信号灯锁闭*/
|
||||
signalBlockColor: '#EF0C08'
|
||||
};
|
||||
|
||||
fuzhouSkin[deviceType.TrainWindow] = {
|
||||
/** 车次窗高度*/
|
||||
trainWindowWidth: 40,
|
||||
fuzhouSkin[deviceType.Switch] = {
|
||||
/** 默认背景 颜色*/
|
||||
backgroundColor: '#000000',
|
||||
|
||||
/** 车次窗高度*/
|
||||
trainWindowHeight: 15,
|
||||
/** 默认提示背景 颜色*/
|
||||
tipBackgroundColor: 'yellow',
|
||||
|
||||
/** 车次窗颜色*/
|
||||
trainWindowColor: '#4DD43F',
|
||||
/** 透明填充 颜色*/
|
||||
transparentColor: 'rgba(0,0,0,0)',
|
||||
|
||||
/** 透明填充 颜色*/
|
||||
transparentColor: 'rgba(0,0,0,0)',
|
||||
/** 默认字体 大小*/
|
||||
textFontSize: 9,
|
||||
|
||||
/** 默认字体 族类*/
|
||||
textFontFormat: 'consolas',
|
||||
|
||||
/** 默认border文字背景色*/
|
||||
borderContextBackgroundColor: '#00FFFF',
|
||||
|
||||
/** 默认border颜色*/
|
||||
borderColor: '#C0C0C0',
|
||||
|
||||
/** 默认名称和设备的距离*/
|
||||
nameDistance: 2,
|
||||
|
||||
/** 区段宽超出宽度*/
|
||||
sectionBeyondWidth: 0,
|
||||
|
||||
/** 区段 宽度*/
|
||||
sectionWidth: 4.4,
|
||||
|
||||
/** 道岔单边长度*/
|
||||
switchLen: 7,
|
||||
|
||||
/** 道岔字体颜色*/
|
||||
switchTextColor: 'lightgreen',
|
||||
|
||||
/** 道岔边框颜色*/
|
||||
switchTextBorderColor: '#FE0000',
|
||||
|
||||
/** 道岔失去颜色*/
|
||||
switchTextLossColor: '#C00808',
|
||||
|
||||
/** 道岔定位颜色*/
|
||||
switchLocateTextColor: '#08C008',
|
||||
|
||||
/** 道岔反位颜色*/
|
||||
switchInversionColor: '#C0C000',
|
||||
|
||||
/** 道岔单锁颜色*/
|
||||
switchMonolockColor: '#FFFFFF',
|
||||
|
||||
/** 道岔封锁*/
|
||||
switchBlockLockColor: '#E20F0A'
|
||||
};
|
||||
fuzhouSkin[deviceType.Station] = {
|
||||
/** 默认字体 族类*/
|
||||
textFontFormat: '宋体' // consolas
|
||||
};
|
||||
fuzhouSkin[deviceType.StationControl] = {
|
||||
nameDistance: 2,
|
||||
/** 默认字体颜色*/
|
||||
textFontColor: '#C0C0C0',
|
||||
|
||||
/** 默认字体阴影颜色*/
|
||||
textShadowColor: '#FFFF00',
|
||||
|
||||
/** 默认字体 族类*/
|
||||
textFontFormat: 'consolas',
|
||||
|
||||
/** 控制模式灯的半径 */
|
||||
stationControlmodeR: 5,
|
||||
|
||||
/** 控制模式之间灯之间的距离*/
|
||||
stationControlDistance: 44,
|
||||
|
||||
/** 控制模式字体大小*/
|
||||
stationControlTextSize: 12,
|
||||
|
||||
/** 控制模式灰色*/
|
||||
stationControlGrayColor: '#74747C',
|
||||
|
||||
/** 控制模式绿色*/
|
||||
stationControlGreenColor: '#4DD43F',
|
||||
|
||||
/** 控制模式红色*/
|
||||
stationControlRedColor: '#EF0C08',
|
||||
|
||||
/** 控制模式黄色*/
|
||||
stationControlYellowColor: '#E4EF50'
|
||||
};
|
||||
fuzhouSkin[deviceType.LcControl] = {
|
||||
nameDistance: 2,
|
||||
zcControlmodeR: 4,
|
||||
lcControlColor: '#FFFF00',
|
||||
stationControlTextSize: 10,
|
||||
textFontFormat: 'consolas',
|
||||
textShadowColor: '#FFFF00',
|
||||
borderColor: '#fff',
|
||||
transparentColor: 'rgba(0,0,0,0)',
|
||||
borderContextBackgroundColor: '#00FFFF'
|
||||
};
|
||||
fuzhouSkin[deviceType.LimitControl] = {
|
||||
nameDistance: 2,
|
||||
zcControlmodeR: 4,
|
||||
lcControlColor: '#FFFF00',
|
||||
stationControlTextSize: 10,
|
||||
textFontFormat: 'consolas',
|
||||
textShadowColor: '#FFFF00',
|
||||
borderColor: '#fff',
|
||||
transparentColor: 'rgba(0,0,0,0)',
|
||||
borderContextBackgroundColor: '#00FFFF',
|
||||
limitControlColor: 4
|
||||
};
|
||||
fuzhouSkin[deviceType.ZcControl] = {
|
||||
nameDistance: 2,
|
||||
zcControlmodeR: 4,
|
||||
stationControlTextSize: 10,
|
||||
textFontFormat: 'consolas',
|
||||
textShadowColor: '#FFFF00',
|
||||
borderColor: '#fff',
|
||||
transparentColor: 'rgba(0,0,0,0)',
|
||||
borderContextBackgroundColor: '#00FFFF',
|
||||
zcControlGrayColor: '#00FF00'
|
||||
};
|
||||
|
||||
fuzhouSkin[deviceType.Train] = {
|
||||
/** 列车长度*/
|
||||
trainWidth: 76,
|
||||
fuzhouSkin[deviceType.StationCounter] = {
|
||||
/** 默认字体 大小*/
|
||||
textFontSize: 9,
|
||||
|
||||
/** 列车高度*/
|
||||
trainHeight: 17,
|
||||
/** 默认字体 族类*/
|
||||
textFontFormat: 'consolas',
|
||||
|
||||
/** 列车字号*/
|
||||
trainTextFontSize: 15,
|
||||
/** 计数器字体颜色*/
|
||||
stationCounterTextColor: '#FFFFFF',
|
||||
|
||||
// 列车文字间距
|
||||
trainTextSpaceBetween: 27,
|
||||
|
||||
|
||||
/** 列车HDSA字号*/
|
||||
trainHSDATextFontSize: 8,
|
||||
|
||||
/** 列车信号的半径*/
|
||||
trainConflictR: 3,
|
||||
|
||||
/** 列车信号距离车的距离*/
|
||||
trainConflictDistance: 5,
|
||||
|
||||
/** 列车车头比车身高出的长度,上下相比车体伸出去的边框*/
|
||||
trainMoreLength: 1,
|
||||
|
||||
/** 列车和车头之间的间距*/
|
||||
trainHeadDistance: 2,
|
||||
|
||||
/** 列车竖杠的宽度*/
|
||||
trainConntWidth: 4,
|
||||
|
||||
/** 列车竖杠和方向之间的间隔*/
|
||||
trainPadding: 1,
|
||||
|
||||
/** 列车方向的宽度*/
|
||||
trainArrowWidth: 6,
|
||||
|
||||
/** 列车和区段之间的距离*/
|
||||
trainDistance: 18,
|
||||
|
||||
/** 列车背景*/
|
||||
trainBackground: 'rgba(0,0,0,0)',
|
||||
|
||||
/** 列车边线颜色*/
|
||||
trainSidelineColor: '#C0C0C0',
|
||||
|
||||
/** 列车文字颜色*/
|
||||
trainTextColor: '#ffffff',
|
||||
|
||||
/** 列车 灰色*/
|
||||
trainGrayColor: '#C0C0C0',
|
||||
|
||||
/** 列车 白色*/
|
||||
trainWitheColor: '#FFFFFF',
|
||||
|
||||
/** 列车 棕色*/
|
||||
trainBrownColor: '#9B4A09',
|
||||
|
||||
/** 列车 黄色*/
|
||||
trainYellowColor: '#FFFF00',
|
||||
|
||||
/** 列车 绿色*/
|
||||
trainGreenColor: '#00AF50',
|
||||
|
||||
/** 列车 蓝色*/
|
||||
trainBlueColor: '#3265FF',
|
||||
|
||||
/** 列车 红色*/
|
||||
trainRedColor: '#EF0C08',
|
||||
|
||||
/** 列车 橘色*/
|
||||
trainOrangeColor: '#EA700D',
|
||||
|
||||
/** 列车 紫色*/
|
||||
trainPurpleColor: 'purple',
|
||||
|
||||
/** 列车 粉色*/
|
||||
trainPinkColor: 'pink',
|
||||
/** 计数器边框颜色*/
|
||||
stationCounterBorderColor: '#E4EF50'
|
||||
};
|
||||
/** 皮肤配置*/
|
||||
const deviceSkin = {
|
||||
|
||||
@ -1,12 +1,21 @@
|
||||
const deviceType = {
|
||||
Link: 'Link',
|
||||
Section: 'Section',
|
||||
Switch: 'Switch',
|
||||
Signal: 'Signal',
|
||||
ZcControl: 'ZcControl',
|
||||
LcControl: 'LcControl',
|
||||
LimitControl: 'LimitControl',
|
||||
ImageControl: 'ImageControl',
|
||||
Station: 'Station',
|
||||
StationControl: 'StationControl',
|
||||
StationStand: 'StationStand',
|
||||
TrainWindow:'TrainWindow',
|
||||
Train:'Train',
|
||||
StationControl: 'StationControl',
|
||||
StationCounter: 'StationCounter',
|
||||
StationDelayUnlock: 'StationDelayUnlock',
|
||||
Train: 'Train',
|
||||
TrainWindow: 'TrainWindow',
|
||||
Line: 'Line',
|
||||
Text: 'Text'
|
||||
};
|
||||
|
||||
export default deviceType;
|
||||
|
||||
@ -73,7 +73,7 @@ class Jmap {
|
||||
this.styleDict = this.loadStyle(this.skinStyle);
|
||||
|
||||
// 解析地图数据
|
||||
this.mapDevice = parser(data, this.defaultStateDict);
|
||||
this.mapDevice = parser(data, this);
|
||||
|
||||
// 生成代理对象
|
||||
this.proxyData = new Proxy(this.mapDevice, new ProxyHandle(this.$painter));
|
||||
@ -125,6 +125,10 @@ class Jmap {
|
||||
if (this.methods.optionsUpdate instanceof Function) { this.methods.optionsUpdate(); }
|
||||
}
|
||||
|
||||
setLevelInvisible(list) {
|
||||
this.$painter.setLevelInvisible(list);
|
||||
}
|
||||
|
||||
render(list) {
|
||||
(list || []).forEach(elem => {
|
||||
const type = elem.type;
|
||||
@ -166,6 +170,10 @@ class Jmap {
|
||||
switch (type) {
|
||||
case deviceType.Link: prop = 'linkList'; break;
|
||||
case deviceType.Sction: prop = 'sectionList'; break;
|
||||
case deviceType.Station: prop = 'stationList'; break;
|
||||
case deviceType.StationControl: prop = 'stationControlList'; break;
|
||||
case deviceType.LcControl: prop = 'LcControlList'; break;
|
||||
case deviceType.LimitControl: prop = 'tempSpeedLimitList'; break;
|
||||
}
|
||||
|
||||
const list = this.data[prop];
|
||||
@ -207,6 +215,14 @@ class Jmap {
|
||||
return this.mapDevice;
|
||||
}
|
||||
|
||||
getDeviceByCode(code) {
|
||||
return this.mapDevice[code];
|
||||
}
|
||||
|
||||
getViewInstanceByCode(code) {
|
||||
return this.$painter.getViewInstanceByCode(code);
|
||||
}
|
||||
|
||||
refresh() {
|
||||
this.$painter.refresh();
|
||||
}
|
||||
|
||||
@ -64,7 +64,7 @@ class Painter {
|
||||
add(device) {
|
||||
const type = device._type;
|
||||
const code = device._code;
|
||||
const view = shapefactory(type, device, this.$jmap.getStyleDict());
|
||||
const view = shapefactory(type, device, this.$jmap);
|
||||
if (view) {
|
||||
this.$zoomHandle.transformView(view);
|
||||
this.viewInstance[code] = view;
|
||||
@ -94,7 +94,7 @@ class Painter {
|
||||
const code = device._code;
|
||||
const view = this.viewInstance[code];
|
||||
if (view) {
|
||||
view.setState(device);
|
||||
view.setState(device.state);
|
||||
}
|
||||
}
|
||||
|
||||
@ -106,6 +106,21 @@ class Painter {
|
||||
this.$zoomHandle.updateTransform(zoom);
|
||||
}
|
||||
|
||||
/**
|
||||
* 设置图层显隐
|
||||
* @param {*} code
|
||||
*/
|
||||
setLevelInvisible(list) {
|
||||
zrUtil.each(Object.values(deviceType), type => {
|
||||
const level = this.viewLevelMap[type];
|
||||
if (list.includes(type)) {
|
||||
level.hide();
|
||||
} else {
|
||||
level.show();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 视图是否存在
|
||||
* @param {*} code
|
||||
@ -114,6 +129,13 @@ class Painter {
|
||||
return this.viewInstance[code];
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取视图实例
|
||||
*/
|
||||
getViewInstanceByCode(code) {
|
||||
return this.viewInstance[code];
|
||||
}
|
||||
|
||||
/**
|
||||
* 刷新画布，将在下一个渲染帧的时候被刷新。
|
||||
*/
|
||||
|
||||
71
src/jmap/shape/ImageControl.js
Normal file
71
src/jmap/shape/ImageControl.js
Normal file
@ -0,0 +1,71 @@
|
||||
/*
|
||||
* 图片list
|
||||
*/
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Image from 'zrender/src/graphic/Image';
|
||||
|
||||
export default class ImageControl extends Group {
|
||||
constructor({ _code, _type, zlevel, model, state }, style) {
|
||||
super({name: _code});
|
||||
this._code = _code;
|
||||
this._type = _type;
|
||||
this.zlevel = zlevel;
|
||||
this.model = model;
|
||||
this.state = state;
|
||||
this.style = style;
|
||||
this.z = model.zIndex || 5;
|
||||
this._create();
|
||||
}
|
||||
|
||||
_create() {
|
||||
const model = this.model;
|
||||
this.image = new Image({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
origin: {
|
||||
x: model.position.x,
|
||||
y: model.position.y
|
||||
},
|
||||
rotation: -Math.PI / 180 * model.rotate,
|
||||
style: {
|
||||
image: model.url,
|
||||
x: model.position.x,
|
||||
y: model.position.y,
|
||||
width: model.width,
|
||||
height: model.height
|
||||
}
|
||||
});
|
||||
this.add(this.image);
|
||||
// 旋转
|
||||
if (model.rotate) {
|
||||
this.transformRotation(this.image);
|
||||
}
|
||||
}
|
||||
|
||||
setState(model) {
|
||||
|
||||
}
|
||||
|
||||
// 整体图片
|
||||
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();
|
||||
}
|
||||
}
|
||||
|
||||
getShapeTipPoint() {
|
||||
if (this.image) {
|
||||
var distance = 2;
|
||||
var rect = this.image.getBoundingRect();
|
||||
return {
|
||||
x: rect.x + rect.width / 2,
|
||||
y: rect.y - distance
|
||||
};
|
||||
}
|
||||
return null;
|
||||
}
|
||||
}
|
||||
@ -1,6 +1,5 @@
|
||||
import Line from 'zrender/src/graphic/shape/Line';
|
||||
import Group from 'zrender/src/container/Group';
|
||||
// import { stat } from 'fs';
|
||||
|
||||
class Link extends Group {
|
||||
constructor({ _code, _type, zlevel, model, state }, style) {
|
||||
@ -43,17 +42,9 @@ class Link extends Group {
|
||||
}
|
||||
|
||||
setState({ _code, _type, zlevel, model, state }) {
|
||||
switch (state.status) {
|
||||
case '01': this.link.setStyle('stroke', 'green'); break;
|
||||
case '02': this.link.setStyle('stroke', 'yellow'); break;
|
||||
}
|
||||
}
|
||||
|
||||
tipBasePoint() {
|
||||
return {
|
||||
x: (this.link.shape.x1 + this.link.shape.x2) / 2,
|
||||
y: (this.link.shape.y1 + this.link.shape.y2) / 2
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -13,7 +13,7 @@ import { arrows, triangular } from './libs/ShapePoints';
|
||||
|
||||
class Lamp extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
super({name: `${model.name}`});
|
||||
this.model = model;
|
||||
this.zlevel = model.zlevel;
|
||||
this.z = 10;
|
||||
@ -38,44 +38,44 @@ class Lamp extends Group {
|
||||
}
|
||||
});
|
||||
|
||||
let shapeDate = null;
|
||||
if (model.highType === '01') {
|
||||
// 矮柱
|
||||
if (model.drict != 1) {
|
||||
// 左侧
|
||||
shapeDate = {
|
||||
x: model.origin.x + model.drict * model.lampCount * 2 * model.style.signalR - 2.5,
|
||||
y: model.origin.y + model.drict * model.style.signalR - 1,
|
||||
width: model.style.signalR * 2 * model.lampCount + 2,
|
||||
height: model.style.signalR * 2 + 2
|
||||
};
|
||||
} else {
|
||||
shapeDate = {
|
||||
x: model.origin.x - model.drict + 1.5,
|
||||
y: model.origin.y - model.drict * model.style.signalR - 1,
|
||||
width: model.style.signalR * 2 * model.lampCount + 2,
|
||||
height: model.style.signalR * 2 + 2
|
||||
};
|
||||
}
|
||||
} else {
|
||||
// 高柱
|
||||
if (model.drict != 1) {
|
||||
// 左侧
|
||||
shapeDate = {
|
||||
x: model.origin.x + model.drict * model.lampCount * 2 * model.style.signalR - 2.5 - 3,
|
||||
y: model.origin.y + model.drict * model.style.signalR - 1,
|
||||
width: model.style.signalR * 2 * model.lampCount + 2,
|
||||
height: model.style.signalR * 2 + 2
|
||||
};
|
||||
} else {
|
||||
shapeDate = {
|
||||
x: model.origin.x - model.drict + 1.5 + 3,
|
||||
y: model.origin.y - model.drict * model.style.signalR - 1,
|
||||
width: model.style.signalR * 2 * model.lampCount + 2,
|
||||
height: model.style.signalR * 2 + 2
|
||||
};
|
||||
}
|
||||
}
|
||||
// let shapeDate = null;
|
||||
// if (model.highType === '01') {
|
||||
// // 矮柱
|
||||
// if (model.drict != 1) {
|
||||
// // 左侧
|
||||
// shapeDate = {
|
||||
// x: model.origin.x + model.drict * model.lampCount * 2 * model.style.signalR - 2.5,
|
||||
// y: model.origin.y + model.drict * model.style.signalR - 1,
|
||||
// width: model.style.signalR * 2 * model.lampCount + 2,
|
||||
// height: model.style.signalR * 2 + 2
|
||||
// };
|
||||
// } else {
|
||||
// shapeDate = {
|
||||
// x: model.origin.x - model.drict + 1.5,
|
||||
// y: model.origin.y - model.drict * model.style.signalR - 1,
|
||||
// width: model.style.signalR * 2 * model.lampCount + 2,
|
||||
// height: model.style.signalR * 2 + 2
|
||||
// };
|
||||
// }
|
||||
// } else {
|
||||
// // 高柱
|
||||
// if (model.drict != 1) {
|
||||
// // 左侧
|
||||
// shapeDate = {
|
||||
// x: model.origin.x + model.drict * model.lampCount * 2 * model.style.signalR - 2.5 - 3,
|
||||
// y: model.origin.y + model.drict * model.style.signalR - 1,
|
||||
// width: model.style.signalR * 2 * model.lampCount + 2,
|
||||
// height: model.style.signalR * 2 + 2
|
||||
// };
|
||||
// } else {
|
||||
// shapeDate = {
|
||||
// x: model.origin.x - model.drict + 1.5 + 3,
|
||||
// y: model.origin.y - model.drict * model.style.signalR - 1,
|
||||
// width: model.style.signalR * 2 * model.lampCount + 2,
|
||||
// height: model.style.signalR * 2 + 2
|
||||
// };
|
||||
// }
|
||||
// }
|
||||
|
||||
this.lstop = new Line({
|
||||
zlevel: this.zlevel + 1,
|
||||
@ -134,7 +134,7 @@ class Lamp extends Group {
|
||||
// 自动进路箭头
|
||||
class AutoSig extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
super({name: `${model.name}`});
|
||||
this.model = model;
|
||||
this.zlevel = model.zlevel;
|
||||
this.z = 10;
|
||||
@ -196,7 +196,7 @@ class AutoSig extends Group {
|
||||
// 运行方向三角
|
||||
class JSigDrict extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
super({name: `${model.name}`});
|
||||
this.model = model;
|
||||
this.zlevel = model.zlevel;
|
||||
this.z = 10;
|
||||
@ -226,12 +226,12 @@ class JSigDrict extends Group {
|
||||
// 信号灯 几灯、高柱等
|
||||
class JSiglamp extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
super({name: `${model.name}`});
|
||||
this.model = model;
|
||||
this.zlevel = model.zlevel;
|
||||
this.z = 10;
|
||||
this.lamps = new Group();
|
||||
this.poles = new Group();
|
||||
this.lamps = new Group({name: `${model.name}_Lamps`});
|
||||
this.poles = new Group({name: `${model.name}_Poles`});
|
||||
this._subType = 'SignalLamp';
|
||||
this._val = '3'; /** 信号机*/
|
||||
this._create();
|
||||
@ -246,7 +246,7 @@ class JSiglamp extends Group {
|
||||
style: {
|
||||
x: model.position.x + model.namePosition.x,
|
||||
y: model.position.y + model.posit * (model.style.signalR + model.namePosition.y),
|
||||
text: model.name,
|
||||
text: model.signalName,
|
||||
textAlign: 'middle',
|
||||
textVerticalAlign: model.posit === 1 ? 'top' : 'bottom',
|
||||
textFont: 'bold ' + (model.style.textFontSize + 1) + 'px ' + model.style.textFontFormat,
|
||||
@ -328,6 +328,7 @@ class JSiglamp extends Group {
|
||||
const lamp = new Lamp({
|
||||
style: model.style,
|
||||
zlevel: this.zlevel,
|
||||
name: `${this._code}_Lamp_${i}`,
|
||||
lampCount: model.lampCount,
|
||||
position: {
|
||||
x: highPosition.x + i * model.drict * model.style.signalR * 2,
|
||||
@ -362,6 +363,7 @@ class JSiglamp extends Group {
|
||||
this.sigDriction = new JSigDrict({
|
||||
style: model.style,
|
||||
zlevel: this.zlevel,
|
||||
name: `${this._code}_JSigDrict`,
|
||||
position: {
|
||||
x: highPosition.x + model.drict * (model.lampCount * model.style.signalR * 2 + model.style.signalR - 1),
|
||||
y: model.position.y
|
||||
@ -377,6 +379,7 @@ class JSiglamp extends Group {
|
||||
this.autoSig = new AutoSig({
|
||||
style: model.style,
|
||||
zlevel: this.zlevel,
|
||||
name: `${this._code}_AutoSig`,
|
||||
position: {
|
||||
x: highPosition.x,
|
||||
y: highPosition.y
|
||||
@ -514,7 +517,7 @@ class JSiglamp extends Group {
|
||||
/** 按钮*/
|
||||
class SigButton extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
super({name: `${model.name}`});
|
||||
this.model = model;
|
||||
this.zlevel = model.zlevel;
|
||||
this._subType = 'SignalButton';
|
||||
@ -711,7 +714,7 @@ class SigButton extends Group {
|
||||
|
||||
export default class Signal extends Group {
|
||||
constructor({ _code, _type, zlevel, model, state }, style) {
|
||||
super();
|
||||
super({name: _code});
|
||||
this._code = _code;
|
||||
this._type = _type;
|
||||
this.zlevel = zlevel;
|
||||
@ -729,6 +732,7 @@ export default class Signal extends Group {
|
||||
|
||||
_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;
|
||||
@ -737,13 +741,14 @@ export default class Signal extends Group {
|
||||
this.siglamp = new JSiglamp({
|
||||
style: style,
|
||||
zlevel: this.zlevel,
|
||||
name: `${this._code}_JSiglamp`,
|
||||
position: {
|
||||
x: model.position.x,
|
||||
y: model.position.y + posit * style.signalDistance
|
||||
},
|
||||
drict: drict,
|
||||
posit: posit,
|
||||
name: model.name,
|
||||
signalName: model.name,
|
||||
namePosition: model.namePosition,
|
||||
isShowName: model.nameShow,
|
||||
highType: model.lampPostType,
|
||||
@ -757,6 +762,7 @@ export default class Signal extends Group {
|
||||
this.sigButton = new SigButton({
|
||||
style: style,
|
||||
zlevel: this.zlevel,
|
||||
name: `${this._code}_SigButton`,
|
||||
position: {
|
||||
x: model.buttonPosition.x,
|
||||
y: model.buttonPosition.y - posit * style.signalDistance
|
||||
@ -768,7 +774,7 @@ export default class Signal extends Group {
|
||||
this.add(this.siglamp);
|
||||
|
||||
this.mouseStateRecover();
|
||||
this.setState(model);
|
||||
this.setState(state);
|
||||
}
|
||||
|
||||
setButtonStatus(model) {
|
||||
@ -938,50 +944,49 @@ export default class Signal extends Group {
|
||||
this.siglamp.setRecover();
|
||||
}
|
||||
|
||||
setState(model) {
|
||||
setState(state) {
|
||||
this.recover();
|
||||
|
||||
/** 设置状态 (点灯类型)*/
|
||||
switch (model.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.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 (model.natureType) {
|
||||
case '01': { this.trainRoute(); } break; // 列车进路
|
||||
case '02': { this.shuntRoute(); } break; // 调车进路
|
||||
switch (state.natureType) {
|
||||
case '01': this.trainRoute(); break; // 列车进路
|
||||
case '02': this.shuntRoute(); break; // 调车进路
|
||||
}
|
||||
|
||||
/** 设置点灯类型*/
|
||||
switch (model.lightType) {
|
||||
case '01': { this.logicalLight(); } break; // 设置逻辑点灯
|
||||
case '02': { this.physicsLight(); } break; // 设置物理点灯
|
||||
switch (state.lightType) {
|
||||
case '01': this.logicalLight(); break; // 设置逻辑点灯
|
||||
case '02': this.physicsLight(); break; // 设置物理点灯
|
||||
}
|
||||
|
||||
/** 设置自动类型*/
|
||||
switch (model.autoType) {
|
||||
case '01': { this.setAutoClose(); } break; // 隐藏 隐藏自动信号和自动进路
|
||||
case '02': { this.setAutoSignalOpen(); } break; // 显示 设置自动信号模式状态类型
|
||||
case '03': { this.setAutoRouteOpen(); } break; // 显示 设置自动进路模式状态类型
|
||||
case '04': { this.setAutoAccessOpen(); } break; // 显示 信号机进路自动触发模式状态类型
|
||||
switch (state.autoType) {
|
||||
case '01': this.setAutoClose(); break; // 隐藏 隐藏自动信号和自动进路
|
||||
case '02': this.setAutoSignalOpen(); break; // 显示 设置自动信号模式状态类型
|
||||
case '03': this.setAutoRouteOpen(); break; // 显示 设置自动进路模式状态类型
|
||||
case '04': this.setAutoAccessOpen(); break; // 显示 信号机进路自动触发模式状态类型
|
||||
}
|
||||
|
||||
/** 延时解锁*/
|
||||
model.delayType = '02';
|
||||
switch (model.delayType) {
|
||||
case '01': { } // 未延时解锁
|
||||
case '02': { } // 人工闭塞延时解锁
|
||||
case '03': { } // 自动闭塞延时解锁
|
||||
state.delayType = '02';
|
||||
switch (state.delayType) {
|
||||
case '01': break; // 未延时解锁
|
||||
case '02': break; // 人工闭塞延时解锁
|
||||
case '03': break; // 自动闭塞延时解锁
|
||||
}
|
||||
|
||||
/** 信号机进路办理，先停止动画，再判断当前颜色是否闪烁*/
|
||||
if (model.routeSetting && (model.autoType == '03' || model.autoType == '04')) {
|
||||
if (state.routeSetting && (state.autoType == '03' || state.autoType == '04')) {
|
||||
this.setAutoFlicker();
|
||||
}
|
||||
}
|
||||
|
||||
222
src/jmap/shape/StationControl.js
Normal file
222
src/jmap/shape/StationControl.js
Normal file
@ -0,0 +1,222 @@
|
||||
/*
|
||||
* 控制模式
|
||||
*/
|
||||
import Arc from 'zrender/src/graphic/shape/Arc';
|
||||
import Text from 'zrender/src/graphic/Text';
|
||||
import Group from 'zrender/src/container/Group';
|
||||
|
||||
/** 单个控制灯*/
|
||||
class SingleControl extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
this.model = model;
|
||||
this.zlevel = model.zlevel;
|
||||
this._subType = model._subType;
|
||||
this.z = 20;
|
||||
this._create(model);
|
||||
}
|
||||
|
||||
_create(model) {
|
||||
var _subType = 'ControlSignal';
|
||||
var _val = '0';
|
||||
if (model.pop) {
|
||||
_subType = 'ControlButton';
|
||||
_val = '1';
|
||||
}
|
||||
this.control = new Arc({
|
||||
pop: model.pop,
|
||||
_subType: _subType,
|
||||
_val: _val,
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
shape: {
|
||||
cx: model.point.x,
|
||||
cy: model.point.y,
|
||||
r: model.style.stationControlmodeR
|
||||
},
|
||||
style: {
|
||||
lineWidth: 0.5,
|
||||
fill: model.style.stationControlGrayColor,
|
||||
stroke: model.style.stationControlGrayColor
|
||||
}
|
||||
});
|
||||
|
||||
this.text = new Text({
|
||||
pop: model.pop,
|
||||
_subType: _subType,
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
position: [0, 0],
|
||||
style: {
|
||||
x: model.point.x,
|
||||
y: model.point.y + model.style.stationControlmodeR + model.style.nameDistance,
|
||||
text: model.context,
|
||||
textFill: model.style.textFontColor,
|
||||
textFont: model.style.textFontSize + 'px ' + model.style.textFontFormat,
|
||||
textAlign: 'middle',
|
||||
textVerticalAlign: 'top'
|
||||
}
|
||||
});
|
||||
|
||||
this.add(this.control);
|
||||
this.add(this.text);
|
||||
}
|
||||
|
||||
setColor(color) {
|
||||
if (color) {
|
||||
this.control.setStyle('fill', color);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/** 控制模式*/
|
||||
export default class StationControl extends Group {
|
||||
constructor({ _code, _type, zlevel, model, state }, style) {
|
||||
super();
|
||||
this.selected = false;
|
||||
this._code = _code;
|
||||
this._type = _type;
|
||||
this.zlevel = zlevel;
|
||||
this.model = model;
|
||||
this.state = state;
|
||||
this.style = style;
|
||||
this._create();
|
||||
this.on('mouseout', this.mouseleave);
|
||||
this.on('mouseover', this.mouseenter);
|
||||
}
|
||||
|
||||
_create() {
|
||||
const model = this.model;
|
||||
this.emergencyControl = new SingleControl({
|
||||
_subType: 'emergency',
|
||||
style: this.style,
|
||||
zlevel: this.zlevel,
|
||||
point: {
|
||||
x: model.position.x - this.style.stationControlDistance,
|
||||
y: model.position.y
|
||||
},
|
||||
context: model.jjzkContent,
|
||||
pop: false
|
||||
});
|
||||
|
||||
this.centerControl = new SingleControl({
|
||||
_subType: 'center',
|
||||
style: this.style,
|
||||
zlevel: this.zlevel,
|
||||
point: {
|
||||
x: model.position.x,
|
||||
y: model.position.y
|
||||
},
|
||||
context: model.zokContent,
|
||||
pop: false
|
||||
});
|
||||
|
||||
this.substationControl = new SingleControl({
|
||||
_subType: 'substation',
|
||||
style: this.style,
|
||||
zlevel: this.zlevel,
|
||||
point: {
|
||||
x: model.position.x + this.style.stationControlDistance,
|
||||
y: model.position.y
|
||||
},
|
||||
context: model.zakContent,
|
||||
pop: false
|
||||
});
|
||||
|
||||
this.textShadow = new Text({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z + 1,
|
||||
position: [0, -4],
|
||||
silent: true,
|
||||
style: {
|
||||
x: model.position.x,
|
||||
y: model.position.y,
|
||||
text: '',
|
||||
textFill: this.style.textShadowColor, // 黄色
|
||||
textAlign: 'middle',
|
||||
textVerticalAlign: 'top',
|
||||
textFont: 'bold ' + (this.style.stationControlTextSize + 1) + 'px ' + this.style.textFontFormat
|
||||
}
|
||||
});
|
||||
|
||||
this.add(this.substationControl);
|
||||
this.add(this.centerControl);
|
||||
this.add(this.emergencyControl);
|
||||
this.add(this.textShadow);
|
||||
this.setState(this.state);
|
||||
this.mouseStatusRecover();
|
||||
}
|
||||
|
||||
// 设置状态
|
||||
setState(state) {
|
||||
switch (state.status) {
|
||||
case '00': // 无状态
|
||||
this.emergencyControl.setColor(this.style.stationControlGrayColor);
|
||||
this.substationControl.setColor(this.style.stationControlGrayColor);
|
||||
this.centerControl.setColor(this.style.stationControlGrayColor);
|
||||
break;
|
||||
case '01': // 中控
|
||||
this.emergencyControl.setColor(this.style.stationControlGrayColor);
|
||||
this.substationControl.setColor(this.style.stationControlGrayColor);
|
||||
this.centerControl.setColor(this.style.stationControlGreenColor);
|
||||
break;
|
||||
case '02': // 站控
|
||||
this.emergencyControl.setColor(this.style.stationControlGrayColor);
|
||||
this.substationControl.setColor(this.style.stationControlYellowColor);
|
||||
this.centerControl.setColor(this.style.stationControlGrayColor);
|
||||
break;
|
||||
case '03': // 紧急站控
|
||||
this.emergencyControl.setColor(this.style.stationControlRedColor);
|
||||
this.substationControl.setColor(this.style.stationControlGrayColor);
|
||||
this.centerControl.setColor(this.style.stationControlGrayColor);
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
/** 按钮是否按下*/
|
||||
isPop(e) {
|
||||
for (var i = 0; i < this.childCount(); i++) {
|
||||
var rect = this.childAt(i).getBoundingRect();
|
||||
if (rect.contain(e.offsetX, e.offsetY) && this.childAt(i).pop) {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
getShapeTipPoint() {
|
||||
if (this.stationControl) {
|
||||
var distance = 2;
|
||||
var rect = this.stationControl.getBoundingRect();
|
||||
return {
|
||||
x: rect.x + rect.width / 2,
|
||||
y: rect.y - distance
|
||||
};
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
mouseStatusVisible(subType) {
|
||||
switch (subType) {
|
||||
case 'emergency': this.textShadow.setStyle({ text: this.model.jjzkContent }); break;
|
||||
case 'center': this.textShadow.setStyle({ text: this.model.zokContent }); break;
|
||||
case 'substation': this.textShadow.setStyle({ text: this.model.zakContent }); break;
|
||||
}
|
||||
this.textShadow.show();
|
||||
}
|
||||
|
||||
mouseStatusRecover() {
|
||||
this.textShadow.hide();
|
||||
}
|
||||
|
||||
mouseenter(e) {
|
||||
if (e.target.parent && e.target.parent._subType) {
|
||||
this.mouseStatusVisible(e.target.parent._subType);
|
||||
}
|
||||
}
|
||||
|
||||
mouseleave(e) {
|
||||
if (e.target._subType) {
|
||||
this.mouseStatusRecover();
|
||||
}
|
||||
}
|
||||
}
|
||||
88
src/jmap/shape/StationCounter.js
Normal file
88
src/jmap/shape/StationCounter.js
Normal file
@ -0,0 +1,88 @@
|
||||
/*
|
||||
* 计数器
|
||||
*/
|
||||
import Polyline from 'zrender/src/graphic/shape/Polyline';
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Text from 'zrender/src/graphic/Text';
|
||||
|
||||
export default class StationCounter extends Group {
|
||||
constructor({ _code, _type, zlevel, model, state }, style) {
|
||||
super();
|
||||
this._code = _code;
|
||||
this._type = _type;
|
||||
this.model = model;
|
||||
this.state = state;
|
||||
this.style = style;
|
||||
this.zlevel = zlevel;
|
||||
this.z = 30;
|
||||
this._create();
|
||||
}
|
||||
|
||||
_create() {
|
||||
const model = this.model;
|
||||
const style = this.style;
|
||||
const state = this.state;
|
||||
this.counter = new Text({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
position: [0, 0],
|
||||
style: {
|
||||
x: model.position.x,
|
||||
y: model.position.y,
|
||||
text: model.val,
|
||||
textFill: style.stationCounterTextColor,
|
||||
textAlign: 'middle',
|
||||
textStrokeWidth: 1,
|
||||
textFont: style.textFontSize + 'px ' + style.textFontFormat
|
||||
}
|
||||
});
|
||||
|
||||
this.rect = this.counter.getBoundingRect();
|
||||
|
||||
this.vPadding = 0;
|
||||
this.lPadding = 2;
|
||||
this.table = new Polyline({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
shape: {
|
||||
points: [
|
||||
[this.rect.x - this.lPadding, this.rect.y - this.vPadding],
|
||||
[this.rect.x + this.lPadding + this.rect.width, this.rect.y - this.vPadding],
|
||||
[this.rect.x + this.lPadding + this.rect.width, this.rect.y + this.vPadding + this.rect.height],
|
||||
[this.rect.x - this.lPadding, this.rect.y + this.vPadding + this.rect.height],
|
||||
[this.rect.x - this.lPadding, this.rect.y - this.vPadding]]
|
||||
},
|
||||
style: {
|
||||
stroke: style.stationCounterBorderColor
|
||||
}
|
||||
});
|
||||
|
||||
this.counterName = new Text({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
position: [0, 0],
|
||||
style: {
|
||||
x: model.position.x,
|
||||
y: model.position.y + this.rect.width + this.vPadding + style.textFontSize + style.nameDistance,
|
||||
text: model.name,
|
||||
textFill: style.stationCounterTextColor,
|
||||
textAlign: 'middle',
|
||||
textVerticalAlign: 'top',
|
||||
textStrokeWidth: 1,
|
||||
textFont: style.textFontSize + 'px ' + style.textFontFormat
|
||||
}
|
||||
});
|
||||
this.add(this.counterName);
|
||||
this.add(this.table);
|
||||
this.add(this.counter);
|
||||
this.setStatus(state);
|
||||
}
|
||||
|
||||
setStatus(state) {
|
||||
}
|
||||
|
||||
getShapeTipPoint() {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
106
src/jmap/shape/StationDelayUnlock.js
Normal file
106
src/jmap/shape/StationDelayUnlock.js
Normal file
@ -0,0 +1,106 @@
|
||||
/*
|
||||
* 延迟解锁
|
||||
*/
|
||||
import Rect from 'zrender/src/graphic/shape/Rect';
|
||||
import Text from 'zrender/src/graphic/Text';
|
||||
import Group from 'zrender/src/container/Group';
|
||||
|
||||
export default class StationDelayUnlock extends Group {
|
||||
constructor({ _code, _type, zlevel, model, state }, style) {
|
||||
super();
|
||||
this._code = _code;
|
||||
this._type = _type;
|
||||
this.model = model;
|
||||
this.state = state;
|
||||
this.style = style;
|
||||
this.zlevel = zlevel;
|
||||
this.z = 1;
|
||||
this._create();
|
||||
}
|
||||
|
||||
_create() {
|
||||
const model = this.model;
|
||||
const style = this.style;
|
||||
const state = this.state;
|
||||
this.text = new Text({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z + 1,
|
||||
position: [0, 0],
|
||||
style: {
|
||||
x: model.position.x,
|
||||
y: model.position.y,
|
||||
text: model.deviceName + ' ',
|
||||
textFill: style.stationDelayUnlockTextColor,
|
||||
textStrokeWidth: 1,
|
||||
textFont: model.textFont + 'px ' + style.textFontFormat,
|
||||
textAlign: 'left'
|
||||
}
|
||||
});
|
||||
|
||||
const fontSize = parseInt(model.textFont.split(' ')[0]) || 30;
|
||||
this.time = new Text({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z + 1,
|
||||
position: [0, 0],
|
||||
style: {
|
||||
x: model.position.x,
|
||||
y: model.position.y + fontSize + style.stationDelayUnlockDistance,
|
||||
text: model.remainTime || '',
|
||||
textFill: style.stationDelayUnlockTextColor,
|
||||
textStrokeWidth: 1,
|
||||
textFont: model.textFont + 'px ' + style.textFontFormat,
|
||||
textAlign: 'left'
|
||||
}
|
||||
});
|
||||
this.add(this.text);
|
||||
this.add(this.time);
|
||||
|
||||
this.lPadding = 3;
|
||||
this.vPadding = 3;
|
||||
this.rect = this.getBoundingRect();
|
||||
if (this.rect.width < 35) this.rect.width = 35;
|
||||
if (this.rect.height < 20) this.rect.height = 20;
|
||||
|
||||
this.table = new Rect({
|
||||
zlevel: this.zlevel - 1,
|
||||
z: this.z,
|
||||
shape: {
|
||||
x: model.position.x - this.lPadding,
|
||||
y: model.position.y - this.vPadding,
|
||||
width: this.rect.width + this.lPadding * 2,
|
||||
height: this.rect.height + this.vPadding * 2
|
||||
},
|
||||
style: {
|
||||
stroke: style.stationDelayUnlockBorderColor,
|
||||
fill: style.backgroundColor
|
||||
}
|
||||
});
|
||||
this.add(this.table);
|
||||
|
||||
this.setStatus(state);
|
||||
}
|
||||
|
||||
/** 延时解锁关闭*/
|
||||
delayClose() {
|
||||
this.time.setStyle('text', '');
|
||||
this.text.setStyle('text', '');
|
||||
this.table.setStyle('stroke', this.style.backgroundColor);
|
||||
}
|
||||
|
||||
/** 延时解锁计数*/
|
||||
delayUnlock() {
|
||||
this.table.setStyle('stroke', this.style.sidelineColor);
|
||||
this.time.setStyle('text', '' + this.model.remainTime);
|
||||
}
|
||||
|
||||
setStatus(state) {
|
||||
switch (state.status) {
|
||||
case '01': this.delayClose(); break; // 关闭
|
||||
case '02': this.delayUnlock(); break; // 延迟解锁
|
||||
}
|
||||
}
|
||||
|
||||
getShapeTipPoint() {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
606
src/jmap/shape/Switch.js
Normal file
606
src/jmap/shape/Switch.js
Normal file
@ -0,0 +1,606 @@
|
||||
/*
|
||||
* 道岔
|
||||
*/
|
||||
import Text from 'zrender/src/graphic/Text';
|
||||
import Rect from 'zrender/src/graphic/shape/Rect';
|
||||
import Line from 'zrender/src/graphic/shape/Line';
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Polygon from 'zrender/src/graphic/shape/Polygon';
|
||||
import JTriangle from '../utils/JTriangle';
|
||||
|
||||
export default class Switch extends Group {
|
||||
constructor({ _code, _type, zlevel, model, state }, style, jmap) {
|
||||
super();
|
||||
this._code = _code;
|
||||
this._type = _type;
|
||||
this.model = model;
|
||||
this.state = state;
|
||||
this.style = style;
|
||||
this.jmap = jmap;
|
||||
this.selected = false;
|
||||
this.zlevel = zlevel;
|
||||
this.z = 8;
|
||||
|
||||
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;
|
||||
this.triangle = new JTriangle(model.intersection, model.skew);
|
||||
this.createSwitch();
|
||||
this.createNameText();
|
||||
this.craeteSwitchBorder();
|
||||
this.setState(state);
|
||||
this.mouseStateRecover();
|
||||
}
|
||||
|
||||
/** 道岔实体，不显示，响应鼠标事件*/
|
||||
createSwitch() {
|
||||
const model = this.model;
|
||||
const style = this.style;
|
||||
|
||||
var halfWidth = style.sectionWidth / 2; // 一般宽度
|
||||
var switchWidth = style.sectionWidth + style.sectionBeyondWidth*2 + 0.8; // 道岔宽度, 增大遮挡宽度0.8
|
||||
var swPadding = style.switchLen; // 定位和反位时区段距离岔芯的距离
|
||||
var directx = this.triangle.drictx;
|
||||
var directy = this.triangle.dricty;
|
||||
var direct = -this.triangle.drictx * this.triangle.dricty;
|
||||
var coverLength = switchWidth * 1.5;
|
||||
|
||||
// 道岔遮挡
|
||||
var line = new Line({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
silent: true,
|
||||
shape: {
|
||||
x1: model.intersection.x - coverLength,
|
||||
y1: model.intersection.y,
|
||||
x2: model.intersection.x + coverLength,
|
||||
y2: model.intersection.y
|
||||
},
|
||||
style: {
|
||||
lineWidth: switchWidth,
|
||||
stroke: style.backgroundColor
|
||||
}
|
||||
});
|
||||
var skewLine = new Line({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
silent: true,
|
||||
shape: {
|
||||
x1: model.intersection.x,
|
||||
y1: model.intersection.y,
|
||||
x2: model.intersection.x + directx * this.triangle.getCotRate() * coverLength,
|
||||
y2: model.intersection.y + directy * coverLength
|
||||
},
|
||||
style: {
|
||||
lineWidth: switchWidth,
|
||||
stroke: style.backgroundColor
|
||||
}
|
||||
});
|
||||
this.switchView = new Group();
|
||||
this.switchView.add(line);
|
||||
this.switchView.add(skewLine);
|
||||
|
||||
// 定位遮挡
|
||||
halfWidth += 0.3;
|
||||
var point1 = [model.intersection.x - directx * halfWidth, model.intersection.y + directy * halfWidth];
|
||||
var point2 = [point1[0] + directx * switchWidth / this.triangle.getSinRate(), point1[1]];
|
||||
var point3 = [point2[0] + directx * this.triangle.getCotRate() * swPadding, point2[1] + directy * swPadding];
|
||||
var point4 = [point3[0] + direct * this.triangle.getSin(switchWidth), point3[1] - direct * this.triangle.getCos(switchWidth)];
|
||||
|
||||
this.locShelter = new Polygon({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
shape: {
|
||||
points: [
|
||||
point1, point2, point3, point4
|
||||
]
|
||||
},
|
||||
style: {
|
||||
fill: style.backgroundColor
|
||||
},
|
||||
cursor: 'pointer',
|
||||
onmouseover: () => { this.arrowText.show(); },
|
||||
onmouseout: () => { this.arrowText.hide(); }
|
||||
});
|
||||
var lpx = Math.abs(this.triangle.getCos(1));
|
||||
this.locShelter.position = [directx * lpx, -directy * 0.2];
|
||||
this.locShelter.show();
|
||||
|
||||
// 反位遮挡
|
||||
var slen = switchWidth / this.triangle.getSinRate(); // 斜切长度
|
||||
var rpoint1 = [model.intersection.x + directx * halfWidth, model.intersection.y - directy * halfWidth];
|
||||
var rpoint2 = [rpoint1[0] + directx * (swPadding + switchWidth * this.triangle.getCotRate()), rpoint1[1]];
|
||||
var rpoint3 = [rpoint2[0], rpoint2[1] + directy * switchWidth];
|
||||
var rpoint4 = [rpoint1[0] + this.triangle.getCos(slen), rpoint1[1] + this.triangle.getSin(slen)];
|
||||
this.relocShelter = new Polygon({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
shape: {
|
||||
points: [
|
||||
rpoint1, rpoint2, rpoint3, rpoint4
|
||||
]
|
||||
},
|
||||
style: {
|
||||
fill: style.backgroundColor
|
||||
},
|
||||
cursor: 'pointer',
|
||||
onmouseover: () => { this.arrowText.show(); },
|
||||
onmouseout: () => { this.arrowText.hide(); }
|
||||
});
|
||||
var rpx = Math.abs(this.triangle.getCos(halfWidth)) + 0.2;
|
||||
this.relocShelter.position = [-directx * rpx, -directy * 0.2];
|
||||
this.relocShelter.hide();
|
||||
|
||||
// 反位/平行四边形 遮挡
|
||||
var sinX = style.sectionWidth / this.triangle.getSinRate();
|
||||
var switchWidth1 = style.sectionWidth / 2;
|
||||
var width1 = switchWidth1 * this.triangle.getSinRate();
|
||||
var height1 = switchWidth1 * this.triangle.getCosRate();
|
||||
var width2 = (height1 + switchWidth1) / this.triangle.getTanRate();
|
||||
var width3 = sinX - width2 - width1;
|
||||
var switchPoint1 = [model.intersection.x + directx * width3, model.intersection.y - directy * switchWidth1];
|
||||
var switchPoint2 = [switchPoint1[0] - directx * (width2 + width1) - directx * width3, switchPoint1[1]];
|
||||
var switchPoint3 = [model.intersection.x - directx * width3, model.intersection.y + directy * switchWidth1];
|
||||
var switchPoint4 = [switchPoint1[0] + directx * (width2 + width1) - directx * width3, switchPoint3[1]];
|
||||
this.reserveSection = new Polygon({
|
||||
zlevel: this.zlevel,
|
||||
shape: {
|
||||
points: [
|
||||
switchPoint1, switchPoint2, switchPoint3, switchPoint4
|
||||
]
|
||||
},
|
||||
style: {
|
||||
fill: style.sectionSpareColor
|
||||
},
|
||||
cursor: 'pointer',
|
||||
onmouseover: () => { this.arrowText.show(); },
|
||||
onmouseout: () => { this.arrowText.hide(); }
|
||||
});
|
||||
this.reserveSection.hide();
|
||||
|
||||
// 失去
|
||||
// this.release = new Line({
|
||||
// zlevel: this.zlevel,
|
||||
// z: this.z + 2,
|
||||
// shape: {
|
||||
// x1: model.intersection.x - (coverLength * this.triangle.getCotRate()),
|
||||
// y1: model.intersection.y,
|
||||
// x2: model.intersection.x + (coverLength * this.triangle.getCotRate()),
|
||||
// y2: model.intersection.y
|
||||
// },
|
||||
// style: {
|
||||
// lineWidth: style.sectionWidth,
|
||||
// stroke: style.sectionTimeReleaseColor,
|
||||
// }
|
||||
// });
|
||||
|
||||
// 释放解锁
|
||||
this.releaseBackground = new Line({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
shape: {
|
||||
x1: model.intersection.x - (coverLength * this.triangle.getCotRate()),
|
||||
y1: model.intersection.y,
|
||||
x2: model.intersection.x + (coverLength * this.triangle.getCotRate()),
|
||||
y2: model.intersection.y
|
||||
},
|
||||
style: {
|
||||
lineWidth: style.sectionWidth + style.sectionBeyondWidth + 1,
|
||||
stroke: style.backgroundColor
|
||||
}
|
||||
});
|
||||
|
||||
// 添加
|
||||
this.add(this.switchView);
|
||||
this.add(this.locShelter);
|
||||
this.add(this.relocShelter);
|
||||
this.add(this.reserveSection);
|
||||
// this.add(this.release);
|
||||
this.add(this.releaseBackground);
|
||||
}
|
||||
|
||||
/** 创建道岔边框*/
|
||||
craeteSwitchBorder() {
|
||||
const sectionA = this.getSectionInstance(this.model.sectionACode);
|
||||
const sectionB = this.getSectionInstance(this.model.sectionBCode);
|
||||
const sectionC = this.getSectionInstance(this.model.sectionCCode);
|
||||
const rect = this.getBoundingRect();
|
||||
|
||||
sectionA && rect.union(sectionA.getBoundingRect());
|
||||
sectionB && rect.union(sectionB.getBoundingRect());
|
||||
sectionC && rect.union(sectionC.getBoundingRect());
|
||||
|
||||
this.switchBorder = new Rect({
|
||||
zlevel: this.model.zlevel,
|
||||
z: this.z,
|
||||
silent: true,
|
||||
shape: Object.assign({ r: 4 }, rect),
|
||||
style: {
|
||||
lineDash: [3, 3],
|
||||
stroke: this.style.borderColor,
|
||||
fill: this.style.transparentColor
|
||||
}
|
||||
});
|
||||
|
||||
this.add(this.switchBorder);
|
||||
}
|
||||
|
||||
/** 道岔名称，显示，响应鼠标事件*/
|
||||
createNameText() {
|
||||
const model = this.model;
|
||||
const style = this.style;
|
||||
|
||||
// 描述文字
|
||||
this.arrowText = new Text({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
position: [0, 0],
|
||||
style: {
|
||||
x: model.intersection.x + 10,
|
||||
y: model.intersection.y + 15,
|
||||
text: `道岔区段名称: ${model.sectionName}`,
|
||||
textFill: '#000',
|
||||
textAlign: 'letf',
|
||||
textFont: 10 + 'px consolas',
|
||||
textPadding: 3,
|
||||
textBackgroundColor: style.tipBackgroundColor
|
||||
}
|
||||
});
|
||||
this.arrowText.hide();
|
||||
this.add(this.arrowText);
|
||||
|
||||
// 创建道岔名称
|
||||
this.nameText = new Text({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z + 3,
|
||||
style: {
|
||||
x: model.namePosition.x + model.intersection.x + this.triangle.drictx * (style.sectionWidth * 3 + style.nameDistance) * this.triangle.getCotRate(),
|
||||
y: model.namePosition.y + model.intersection.y + this.triangle.dricty * (style.nameDistance),
|
||||
text: model.name,
|
||||
textAlign: this.triangle.drictx === 1 ? 'left' : 'right',
|
||||
textVerticalAlign: this.triangle.dricty === 1 ? 'top' : 'bottom',
|
||||
textFont: style.textFontSize + 'px ' + style.textFontFormat,
|
||||
textFill: style.switchTextLossColor
|
||||
}
|
||||
});
|
||||
// 添加道岔名称视图
|
||||
this.add(this.nameText);
|
||||
// 设置道岔名称视图显隐
|
||||
model.nameShow ? this.nameText.show() : this.nameText.hide();
|
||||
|
||||
// 创建锁闭文字框
|
||||
const rect = this.nameText.getBoundingRect();
|
||||
let textWidth = rect.width * 0.8;
|
||||
if (this.triangle.drictx !== 1) {
|
||||
rect.x += rect.width;
|
||||
textWidth = -textWidth;
|
||||
}
|
||||
|
||||
this.textRect = new Rect({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z + 2,
|
||||
silent: true,
|
||||
shape: {
|
||||
x: rect.x,
|
||||
y: rect.y,
|
||||
width: textWidth,
|
||||
height: rect.height
|
||||
},
|
||||
style: {
|
||||
lineWidth: 0,
|
||||
lineDash: [3, 3],
|
||||
stroke: style.switchTextBorderColor,
|
||||
fill: style.transparentColor
|
||||
}
|
||||
});
|
||||
this.add(this.textRect);
|
||||
}
|
||||
|
||||
/** 名称动画*/
|
||||
nameTextAnimation() {
|
||||
this.nameText.animateStyle(true)
|
||||
.when(0, { textFill: this.style.backgroundColor })
|
||||
.when(1000, { textFill: this.style.switchTextLossColor })
|
||||
.when(2000, { textFill: this.style.backgroundColor })
|
||||
.start();
|
||||
|
||||
this.textRect.animateStyle(true)
|
||||
.when(0, { textFill: this.style.backgroundColor })
|
||||
.when(1000, { textFill: this.style.switchTextBorderColor })
|
||||
.when(2000, { textFill: this.style.backgroundColor })
|
||||
.start();
|
||||
}
|
||||
|
||||
/** 设置岔芯是否隐藏*/
|
||||
setSwitchCoreInvisible(invisible) {
|
||||
if (invisible) {
|
||||
this.switchView.hide();
|
||||
} else {
|
||||
this.switchView.show();
|
||||
}
|
||||
}
|
||||
|
||||
/** 设置岔芯颜色*/
|
||||
setSwitchCoreColor(color) {
|
||||
this.switchView.eachChild(child => {
|
||||
child.setStyle({ stroke: color });
|
||||
});
|
||||
}
|
||||
|
||||
/** 设置道岔文字颜色*/
|
||||
setTextColor(color) {
|
||||
this.nameText.setStyle('textFill', color);
|
||||
}
|
||||
|
||||
/** 设置道岔文字边框颜色 */
|
||||
setHasTextBorder(width) {
|
||||
this.textRect.setStyle('lineWidth', width);
|
||||
}
|
||||
|
||||
/** 恢复状态*/
|
||||
recover() {
|
||||
this.setSwitchCoreColor(this.style.backgroundColor);
|
||||
this.nameText.stopAnimation(false);
|
||||
// this.release.stopAnimation(false);
|
||||
this.reserveSection.stopAnimation(false);
|
||||
this.switchView.eachChild((child) => {
|
||||
child.stopAnimation(false);
|
||||
});
|
||||
|
||||
// this.release.hide();
|
||||
this.relocShelter.hide();
|
||||
this.releaseBackground.hide();
|
||||
|
||||
this.setHasTextBorder(0);
|
||||
switch (this.state.locateType) {
|
||||
case '01': // 定位
|
||||
this.setTextColor(this.style.switchLocateTextColor);
|
||||
break;
|
||||
case '02': // 反位
|
||||
this.setTextColor(this.style.switchInversionColor);
|
||||
break;
|
||||
default: // 其他
|
||||
this.setTextColor(this.style.switchTextLossColor);
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
/** 定位*/
|
||||
setLocationAction() {
|
||||
this.recover();
|
||||
this.setSwitchCoreInvisible(true);
|
||||
this.locShelter.show();
|
||||
this.relocShelter.hide();
|
||||
this.reserveSection.hide();
|
||||
}
|
||||
|
||||
/** 反位*/
|
||||
setInversionAction() {
|
||||
this.recover();
|
||||
this.setSwitchCoreInvisible(true);
|
||||
this.locShelter.hide();
|
||||
this.relocShelter.show();
|
||||
this.reserveSection.show();
|
||||
}
|
||||
|
||||
/** 失去*/
|
||||
setLossAction(nameFlicker) {
|
||||
this.recover();
|
||||
this.locShelter.hide();
|
||||
this.relocShelter.hide();
|
||||
this.reserveSection.hide();
|
||||
this.setSwitchCoreInvisible(false);
|
||||
nameFlicker && this.nameTextAnimation();
|
||||
}
|
||||
|
||||
/** 挤叉*/
|
||||
setForkAction() {
|
||||
this.setLossAction(true);
|
||||
this.switchView.eachChild((child) => {
|
||||
child.animateStyle(true)
|
||||
.when(0, { stroke: this.style.backgroundColor })
|
||||
.when(1000, { stroke: 'red' })
|
||||
.when(2000, { stroke: this.style.backgroundColor })
|
||||
.start();
|
||||
});
|
||||
}
|
||||
|
||||
/** 空闲*/
|
||||
spare() {
|
||||
}
|
||||
|
||||
/** 单锁*/
|
||||
setMonolock() {
|
||||
this.setTextColor(this.style.switchMonolockColor);
|
||||
}
|
||||
|
||||
/** 封锁 */
|
||||
block() {
|
||||
this.setHasTextBorder(1);
|
||||
}
|
||||
|
||||
/** 延时释放*/
|
||||
timeRelease() {
|
||||
this.setSwitchCoreInvisible(true);
|
||||
// this.release.show();
|
||||
this.releaseBackground.show();
|
||||
// this.release.setStyle('stroke', this.style.sectionTimeReleaseColor);
|
||||
// this.release.animateStyle(true)
|
||||
// .when(0, { stroke: this.style.sectionTimeReleaseColor })
|
||||
// .when(1000, { stroke: this.style.backgroundColor })
|
||||
// .start();
|
||||
|
||||
}
|
||||
|
||||
/** 设置道岔切除*/
|
||||
setSwitchCutOff() {
|
||||
this.setSwitchCoreInvisible(true);
|
||||
switch (this.model.locateType) {
|
||||
case '01': // 定位
|
||||
// this.release.show();
|
||||
this.releaseBackground.hide();
|
||||
this.setSectionState(this.release, 'stroke', this.model.sectionAstatus);
|
||||
// this.release.animateStyle(true)
|
||||
// .when(1000, { stroke: this.style.backgroundColor })
|
||||
// .start();
|
||||
break;
|
||||
case '02': // 反位
|
||||
this.reserveSection.animateStyle(true)
|
||||
.when(1000, { fill: this.style.backgroundColor })
|
||||
.start();
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
setSectionState(section, style, state) {
|
||||
if (section) {
|
||||
switch (state) {
|
||||
case '00': break;
|
||||
case '01': /** 空闲*/
|
||||
section.setStyle(style, this.style.sectionSpareColor);
|
||||
break;
|
||||
case '02': /** 通信车占用*/
|
||||
section.setStyle(style, this.style.sectionCommunicationOccupiedColor);
|
||||
break;
|
||||
case '03': /** 非通信车占用*/
|
||||
section.setStyle(style, this.style.sectionUnCommunicationOccupiedColor);
|
||||
break;
|
||||
case '04': /** 进路锁闭*/
|
||||
section.setStyle(style, this.style.sectionRouteLockColor);
|
||||
break;
|
||||
case '05': /** 故障锁闭*/
|
||||
section.setStyle(style, this.style.sectionFaultLockColor);
|
||||
break;
|
||||
case '06': /** 封锁*/
|
||||
section.setStyle(style, this.style.sectionBlockColor);
|
||||
break;
|
||||
case '07': /** ATC切除*/
|
||||
section.setStyle(style, this.style.sectionAtcExcisionColor);
|
||||
break;
|
||||
case '08': /** ATS切除*/
|
||||
section.setStyle(style, this.style.sectionAtsExcisionColor);
|
||||
section.animateStyle(true)
|
||||
.when(1000, { fill: this.style.backgroundColor })
|
||||
.when(2000, { fill: this.style.sectionAtsExcisionColor })
|
||||
.start();
|
||||
break;
|
||||
case '09': /** 进路延续保护 */
|
||||
section.setStyle(style, this.style.sectionProtectiveLockColor);
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
setLocateType(state) {
|
||||
this.setSectionState(this.reserveSection, 'fill', this.model.sectionCstatus);
|
||||
switch (state.locateType) {
|
||||
case '01':
|
||||
this.setLocationAction(); /** 定位*/
|
||||
break;
|
||||
case '02':
|
||||
this.setInversionAction(); /** 反位*/
|
||||
break;
|
||||
case '03':
|
||||
this.setLossAction(true); /** 失去*/
|
||||
break;
|
||||
case '04':
|
||||
this.setForkAction(); /** 挤岔*/
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
setState(state) {
|
||||
this.setLocateType(state);
|
||||
switch (state.status) {
|
||||
case '01':
|
||||
this.spare(); /** 空闲*/
|
||||
break;
|
||||
case '10':
|
||||
this.setMonolock(); /** 单锁*/
|
||||
break;
|
||||
case '13':
|
||||
this.timeRelease(); /** 延时释放*/
|
||||
break;
|
||||
case '14':
|
||||
this.block(); /** 封锁*/
|
||||
break;
|
||||
}
|
||||
|
||||
/** 区段切除*/
|
||||
if (state.cutOff) {
|
||||
this.setSwitchCutOff();
|
||||
}
|
||||
}
|
||||
|
||||
getShapeTipPoint() {
|
||||
var rect = null;
|
||||
rect = this.nameText.getBoundingRect();
|
||||
if (rect) {
|
||||
return {
|
||||
x: rect.x + rect.width / 2,
|
||||
y: rect.y
|
||||
};
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
getSectionInstance(code) {
|
||||
return this.jmap.getViewInstanceByCode(code);
|
||||
}
|
||||
|
||||
mouseStateVisible() {
|
||||
const section = this.getSectionInstance(this.model.switchSectionCode);
|
||||
section && section.setTrainWindowEventShow(true);
|
||||
|
||||
this.switchBorder.show();
|
||||
this.setLossAction(false);
|
||||
this.setSwitchCoreColor(this.style.borderContextBackgroundColor);
|
||||
this.setTextColor(this.style.backgroundColor);
|
||||
this.textRect.setStyle({
|
||||
lineWidth: 1,
|
||||
stroke: this.style.borderColor,
|
||||
fill: this.style.borderContextBackgroundColor
|
||||
});
|
||||
}
|
||||
|
||||
mouseStateRecover() {
|
||||
const section = this.getSectionInstance(this.model.switchSectionCode);
|
||||
section && section.setTrainWindowEventShow(false);
|
||||
|
||||
this.switchBorder.hide();
|
||||
this.setSwitchCoreColor(this.style.backgroundColor);
|
||||
this.textRect.setStyle({
|
||||
lineWidth: 0,
|
||||
stroke: this.style.switchTextBorderColor,
|
||||
fill: this.style.transparentColor
|
||||
});
|
||||
this.setState(this.model);
|
||||
}
|
||||
|
||||
mouseclick(e) {
|
||||
if ([3].includes(e.which)) {
|
||||
this.selected = !this.selected;
|
||||
if (this.selected) {
|
||||
this.mouseStateVisible();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
mouseenter(e) {
|
||||
if (!this.selected) {
|
||||
this.mouseStateVisible();
|
||||
}
|
||||
}
|
||||
|
||||
mouseleave(e) {
|
||||
if (!this.selected) {
|
||||
this.mouseStateRecover();
|
||||
}
|
||||
}
|
||||
}
|
||||
167
src/jmap/shape/ZcControl.js
Normal file
167
src/jmap/shape/ZcControl.js
Normal file
@ -0,0 +1,167 @@
|
||||
/*
|
||||
* ZC区域控制模式
|
||||
*/
|
||||
import Arc from 'zrender/src/graphic/shape/Arc';
|
||||
import Rect from 'zrender/src/graphic/shape/Rect';
|
||||
import Text from 'zrender/src/graphic/Text';
|
||||
import Group from 'zrender/src/container/Group';
|
||||
|
||||
export default class ZcControl extends Group {
|
||||
constructor({ _code, _type, zlevel, model, state }, style) {
|
||||
super({name: _code});
|
||||
this.z = 20;
|
||||
this._code = _code;
|
||||
this._type = _type;
|
||||
this.zlevel = zlevel;
|
||||
this.model = model;
|
||||
this.state = state;
|
||||
this.style = style;
|
||||
this._create(model);
|
||||
console.log('zc');
|
||||
this.on('mouseout', this.mouseleave);
|
||||
this.on('mouseover', this.mouseenter);
|
||||
}
|
||||
|
||||
_create(model) {
|
||||
this.control = new Arc({
|
||||
_subType: 'Control',
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
shape: {
|
||||
cx: model.position.x,
|
||||
cy: model.position.y,
|
||||
r: this.style.zcControlmodeR
|
||||
},
|
||||
style: {
|
||||
lineWidth: 0,
|
||||
fill: this.style.zcControlGrayColor
|
||||
}
|
||||
});
|
||||
|
||||
this.text = new Text({
|
||||
_subType: 'Text',
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
position: [0, 0],
|
||||
style: {
|
||||
x: model.position.x,
|
||||
y: model.position.y + this.style.zcControlmodeR + this.style.nameDistance,
|
||||
text: model.name,
|
||||
textFill: '#fff',
|
||||
textAlign: 'middle',
|
||||
textVerticalAlign: 'top',
|
||||
textFont: this.style.stationControlTextSize + 'px ' + this.style.textFontFormat
|
||||
}
|
||||
});
|
||||
|
||||
if (this.model.visible) {
|
||||
this.add(this.control);
|
||||
this.add(this.text);
|
||||
}
|
||||
|
||||
this.textShadow = new Text({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z + 1,
|
||||
position: [4, -4],
|
||||
silent: true,
|
||||
style: {
|
||||
x: model.position.x,
|
||||
y: model.position.y + this.style.zcControlmodeR + this.style.nameDistance,
|
||||
text: model.name,
|
||||
textFill: this.style.textShadowColor, // 黄色
|
||||
textAlign: 'middle',
|
||||
textVerticalAlign: 'top',
|
||||
textFont: 'bold ' + (this.style.stationControlTextSize + 1) + 'px ' + this.style.textFontFormat
|
||||
}
|
||||
});
|
||||
this.controlBorder = new Rect({
|
||||
zlevel: model.zlevel,
|
||||
z: this.z - 1,
|
||||
silent: true,
|
||||
shape: this.control.getBoundingRect(),
|
||||
style: {
|
||||
lineDash: [3, 3],
|
||||
stroke: this.style.borderColor,
|
||||
fill: this.style.transparentColor
|
||||
}
|
||||
});
|
||||
|
||||
this.textBorder = new Rect({
|
||||
zlevel: model.zlevel,
|
||||
z: this.z - 1,
|
||||
silent: true,
|
||||
shape: this.text.getBoundingRect(),
|
||||
style: {
|
||||
lineDash: [3, 3],
|
||||
stroke: this.style.borderColor,
|
||||
fill: this.style.borderContextBackgroundColor
|
||||
}
|
||||
});
|
||||
|
||||
this.add(this.control);
|
||||
this.add(this.text);
|
||||
this.add(this.textShadow);
|
||||
this.add(this.textBorder);
|
||||
this.add(this.controlBorder);
|
||||
this.setState(this.state);
|
||||
this.mouseStatusRecover();
|
||||
}
|
||||
|
||||
setControlColor(color) {
|
||||
if (color) {
|
||||
this.control.setStyle('fill', color);
|
||||
}
|
||||
}
|
||||
|
||||
// 设置状态
|
||||
setState(state) {
|
||||
|
||||
}
|
||||
|
||||
getShapeTipPoint() {
|
||||
if (this.control) {
|
||||
var distance = 2;
|
||||
var rect = this.control.getBoundingRect();
|
||||
return {
|
||||
x: rect.x + rect.width / 2,
|
||||
y: rect.y - distance
|
||||
};
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
mouseStatusVisible(subType) {
|
||||
if (subType == 'Text') {
|
||||
this.textShadow.show();
|
||||
}
|
||||
|
||||
if (subType == 'Control') {
|
||||
this.textBorder.show();
|
||||
this.controlBorder.show();
|
||||
this.text.setStyle({ textFill: '#000' });
|
||||
this.control.setStyle({ fill: this.style.borderContextBackgroundColor });
|
||||
}
|
||||
}
|
||||
|
||||
mouseStatusRecover() {
|
||||
this.textShadow.hide();
|
||||
this.textBorder.hide();
|
||||
this.controlBorder.hide();
|
||||
this.text.setStyle({ textFill: '#fff' });
|
||||
this.control.setStyle({ fill: this.style.zcControlGrayColor });
|
||||
this.setState(this.state);
|
||||
}
|
||||
|
||||
mouseenter(e) {
|
||||
if (e.target._subType) {
|
||||
this.mouseStatusRecover();
|
||||
this.mouseStatusVisible(e.target._subType);
|
||||
}
|
||||
}
|
||||
|
||||
mouseleave(e) {
|
||||
if (e.target._subType) {
|
||||
this.mouseStatusRecover();
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -2,23 +2,36 @@ import deviceType from '../config/deviceType';
|
||||
import Link from './Link';
|
||||
import Section from './section';
|
||||
import Signal from './Signal';
|
||||
import StationStand from "./StationStand";
|
||||
import TrainWindow from "./TrainWindow";
|
||||
import Train from "./Train";
|
||||
import Station from './station';
|
||||
import StationControl from './StationControl';
|
||||
import ImageControl from './ImageControl';
|
||||
import LcControl from './lcControl';
|
||||
import LimitControl from './limitControl';
|
||||
import Switch from './Switch';
|
||||
import ZcControl from './ZcControl';
|
||||
import StationCounter from './StationCounter';
|
||||
import StationDelayUnlock from './StationDelayUnlock';
|
||||
|
||||
/** 图库*/
|
||||
const mapShape = {};
|
||||
mapShape[deviceType.Link] = Link;
|
||||
mapShape[deviceType.Section] = Section;
|
||||
mapShape[deviceType.Signal] = Signal;
|
||||
mapShape[deviceType.StationStand] = StationStand;
|
||||
mapShape[deviceType.TrainWindow] = TrainWindow;
|
||||
mapShape[deviceType.Train] = Train;
|
||||
mapShape[deviceType.Station] = Station;
|
||||
mapShape[deviceType.StationControl] = StationControl;
|
||||
mapShape[deviceType.ImageControl] = ImageControl;
|
||||
mapShape[deviceType.LcControl] = LcControl;
|
||||
mapShape[deviceType.LimitControl] = LimitControl;
|
||||
mapShape[deviceType.Switch] = Switch;
|
||||
mapShape[deviceType.ZcControl] = ZcControl;
|
||||
mapShape[deviceType.StationCounter] = StationCounter;
|
||||
mapShape[deviceType.StationDelayUnlock] = StationDelayUnlock;
|
||||
|
||||
function shapefactory(type, device, style) {
|
||||
function shapefactory(type, device, jmap) {
|
||||
const style = jmap.getStyleDict();
|
||||
const shape = mapShape[type];
|
||||
if (shape instanceof Function) {
|
||||
return new shape(device, style[type]);
|
||||
return new shape(device, style[type], jmap);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
157
src/jmap/shape/lcControl.js
Normal file
157
src/jmap/shape/lcControl.js
Normal file
@ -0,0 +1,157 @@
|
||||
/*
|
||||
* lC区域控制模式
|
||||
*/
|
||||
import Arc from 'zrender/src/graphic/shape/Arc';
|
||||
import Rect from 'zrender/src/graphic/shape/Rect';
|
||||
import Text from 'zrender/src/graphic/Text';
|
||||
import Group from 'zrender/src/container/Group';
|
||||
|
||||
export default class LcControl extends Group {
|
||||
constructor({ _code, _type, zlevel, model, state }, style) {
|
||||
super({name: _code});
|
||||
this.z = 20;
|
||||
this._code = _code;
|
||||
this._type = _type;
|
||||
this.zlevel = zlevel;
|
||||
this.model = model;
|
||||
this.state = state;
|
||||
this.style = style;
|
||||
this._create(model);
|
||||
|
||||
this.on('mouseout', this.mouseleave);
|
||||
this.on('mouseover', this.mouseenter);
|
||||
}
|
||||
|
||||
_create(model) {
|
||||
this.control = new Arc({
|
||||
_subType: 'Control',
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
shape: {
|
||||
cx: model.position.x,
|
||||
cy: model.position.y,
|
||||
r: this.style.zcControlmodeR
|
||||
},
|
||||
style: {
|
||||
lineWidth: 0,
|
||||
fill: ''
|
||||
}
|
||||
});
|
||||
|
||||
this.text = new Text({
|
||||
_subType: 'Text',
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
position: [0, 0],
|
||||
style: {
|
||||
x: model.position.x,
|
||||
y: model.position.y + this.style.zcControlmodeR + this.style.nameDistance,
|
||||
text: model.name,
|
||||
textFill: '',
|
||||
textAlign: 'middle',
|
||||
textVerticalAlign: 'top',
|
||||
textFont: this.style.stationControlTextSize + 'px ' + this.style.textFontFormat
|
||||
}
|
||||
});
|
||||
|
||||
this.textShadow = new Text({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z + 1,
|
||||
position: [4, -2],
|
||||
silent: true,
|
||||
style: {
|
||||
x: model.position.x,
|
||||
y: model.position.y + this.style.zcControlmodeR + this.style.nameDistance,
|
||||
text: model.name,
|
||||
textFill: this.style.textShadowColor, // 黄色
|
||||
textAlign: 'middle',
|
||||
textVerticalAlign: 'top',
|
||||
textFont: 'bold ' + (this.style.stationControlTextSize + 1) + 'px ' + this.style.textFontFormat
|
||||
}
|
||||
});
|
||||
this.controlBorder = new Rect({
|
||||
zlevel: model.zlevel,
|
||||
z: this.z - 1,
|
||||
silent: true,
|
||||
shape: this.control.getBoundingRect(),
|
||||
style: {
|
||||
lineDash: [3, 3],
|
||||
stroke: this.style.borderColor,
|
||||
fill: this.style.transparentColor
|
||||
}
|
||||
});
|
||||
|
||||
this.textBorder = new Rect({
|
||||
zlevel: model.zlevel,
|
||||
z: this.z - 1,
|
||||
silent: true,
|
||||
shape: this.text.getBoundingRect(),
|
||||
style: {
|
||||
lineDash: [3, 3],
|
||||
stroke: this.style.borderColor,
|
||||
fill: this.style.borderContextBackgroundColor
|
||||
}
|
||||
});
|
||||
|
||||
this.add(this.control);
|
||||
this.add(this.text);
|
||||
this.add(this.textShadow);
|
||||
this.add(this.textBorder);
|
||||
this.add(this.controlBorder);
|
||||
this.setState(this.state);
|
||||
this.mouseStatusRecover();
|
||||
}
|
||||
|
||||
// 设置状态
|
||||
setState(state) {
|
||||
|
||||
}
|
||||
|
||||
getShapeTipPoint() {
|
||||
if (this.control) {
|
||||
var distance = 2;
|
||||
var rect = this.control.getBoundingRect();
|
||||
return {
|
||||
x: rect.x + rect.width / 2,
|
||||
y: rect.y - distance
|
||||
};
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
mouseStatusVisible(subType) {
|
||||
if (subType == 'Text') {
|
||||
this.textShadow.show();
|
||||
}
|
||||
|
||||
if (subType == 'Control') {
|
||||
this.textBorder.show();
|
||||
this.controlBorder.show();
|
||||
this.text.setStyle({ textFill: '#000' });
|
||||
this.control.setStyle({ fill: this.style.borderContextBackgroundColor });
|
||||
}
|
||||
}
|
||||
|
||||
mouseStatusRecover() {
|
||||
this.textShadow.hide();
|
||||
this.textBorder.hide();
|
||||
this.controlBorder.hide();
|
||||
this.text.setStyle({ textFill: '#fff' });
|
||||
this.control.setStyle({ fill: this.style.lcControlColor });
|
||||
// this.setState(this.state);
|
||||
}
|
||||
|
||||
mouseenter(e) {
|
||||
if (e.target._subType) {
|
||||
console.log(e.target, e.target._subType);
|
||||
// this.mouseStatusRecover();
|
||||
this.mouseStatusVisible(e.target._subType);
|
||||
}
|
||||
}
|
||||
|
||||
mouseleave(e) {
|
||||
if (e.target._subType) {
|
||||
this.mouseStatusRecover();
|
||||
}
|
||||
}
|
||||
}
|
||||
171
src/jmap/shape/limitControl.js
Normal file
171
src/jmap/shape/limitControl.js
Normal file
@ -0,0 +1,171 @@
|
||||
/*
|
||||
* 权限临时限速
|
||||
*/
|
||||
import Arc from 'zrender/src/graphic/shape/Arc';
|
||||
import Rect from 'zrender/src/graphic/shape/Rect';
|
||||
import Text from 'zrender/src/graphic/Text';
|
||||
import Group from 'zrender/src/container/Group';
|
||||
|
||||
export default class LimitControl extends Group {
|
||||
constructor({ _code, _type, zlevel, model, state }, style) {
|
||||
super({name: _code});
|
||||
this.selected = false;
|
||||
this._code = _code;
|
||||
this._type = _type;
|
||||
this.model = model;
|
||||
this.state = state;
|
||||
this.style = style;
|
||||
this.zlevel = zlevel;
|
||||
this.z = 20;
|
||||
this._create(model);
|
||||
|
||||
this.on('mousedown', this.mouseclick);
|
||||
this.on('mouseout', this.mouseleave);
|
||||
this.on('mouseover', this.mouseenter);
|
||||
}
|
||||
|
||||
_create(model) {
|
||||
this.control = new Arc({
|
||||
_subType: 'Control',
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
shape: {
|
||||
cx: model.position.x,
|
||||
cy: model.position.y,
|
||||
r: this.style.zcControlmodeR
|
||||
},
|
||||
style: {
|
||||
lineWidth: 0,
|
||||
fill: ''
|
||||
}
|
||||
});
|
||||
|
||||
this.text = new Text({
|
||||
_subType: 'Text',
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
position: [0, 0],
|
||||
style: {
|
||||
x: model.position.x,
|
||||
y: model.position.y + this.style.zcControlmodeR + this.style.nameDistance,
|
||||
text: model.name,
|
||||
textFill: '',
|
||||
textAlign: 'middle',
|
||||
textVerticalAlign: 'top',
|
||||
textFont: this.style.stationControlTextSize + 'px ' + this.style.textFontFormat
|
||||
}
|
||||
});
|
||||
|
||||
this.textShadow = new Text({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z + 1,
|
||||
position: [4, -4],
|
||||
silent: true,
|
||||
style: {
|
||||
x: model.position.x,
|
||||
y: model.position.y + this.style.zcControlmodeR + this.style.nameDistance,
|
||||
text: model.name,
|
||||
textFill: this.style.textShadowColor, // 黄色
|
||||
textAlign: 'middle',
|
||||
textVerticalAlign: 'top',
|
||||
textFont: 'bold ' + (this.style.stationControlTextSize + 1) + 'px ' + this.style.textFontFormat
|
||||
}
|
||||
});
|
||||
|
||||
this.controlBorder = new Rect({
|
||||
zlevel: model.zlevel,
|
||||
z: this.z - 1,
|
||||
silent: true,
|
||||
shape: this.control.getBoundingRect(),
|
||||
style: {
|
||||
lineDash: [3, 3],
|
||||
stroke: this.style.borderColor,
|
||||
fill: this.style.transparentColor
|
||||
}
|
||||
});
|
||||
|
||||
this.textBorder = new Rect({
|
||||
zlevel: model.zlevel,
|
||||
z: this.z - 1,
|
||||
silent: true,
|
||||
shape: this.text.getBoundingRect(),
|
||||
style: {
|
||||
lineDash: [3, 3],
|
||||
stroke: this.style.borderColor,
|
||||
fill: this.style.borderContextBackgroundColor
|
||||
}
|
||||
});
|
||||
|
||||
this.add(this.control);
|
||||
this.add(this.text);
|
||||
this.add(this.textShadow);
|
||||
this.add(this.textBorder);
|
||||
this.add(this.controlBorder);
|
||||
this.setState(this.state);
|
||||
this.mouseStatusRecover();
|
||||
}
|
||||
|
||||
// 设置状态
|
||||
setState(state) {
|
||||
}
|
||||
|
||||
getShapeTipPoint() {
|
||||
if (this.control) {
|
||||
var distance = 2;
|
||||
var rect = this.control.getBoundingRect();
|
||||
return {
|
||||
x: rect.x + rect.width / 2,
|
||||
y: rect.y - distance
|
||||
};
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
mouseStatusVisible(subType) {
|
||||
if (subType == 'Text') {
|
||||
this.textShadow.show();
|
||||
}
|
||||
|
||||
if (subType == 'Control') {
|
||||
this.textBorder.show();
|
||||
this.controlBorder.show();
|
||||
this.text.setStyle({ textFill: '#000' });
|
||||
this.control.setStyle({ fill: this.style.borderContextBackgroundColor });
|
||||
}
|
||||
}
|
||||
|
||||
mouseStatusRecover() {
|
||||
this.textShadow.hide();
|
||||
this.textBorder.hide();
|
||||
this.controlBorder.hide();
|
||||
this.text.setStyle({ textFill: '#fff' });
|
||||
this.control.setStyle({ fill: this.style.limitControlColor });
|
||||
this.setState(this.state);
|
||||
}
|
||||
|
||||
mouseclick(e) {
|
||||
if ([3].includes(e.which)) {
|
||||
this.selected = !this.selected;
|
||||
if (this.selected) {
|
||||
// this.mouseStatusRecover();
|
||||
this.mouseStatusVisible('Control');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
mouseenter(e) {
|
||||
if (!this.selected && e.target._subType) {
|
||||
// this.mouseStatusRecover();
|
||||
this.mouseStatusVisible(e.target._subType);
|
||||
}
|
||||
}
|
||||
|
||||
mouseleave(e) {
|
||||
if (e.target && e.target._subType) {
|
||||
if (!this.selected && e.target._subType) {
|
||||
this.mouseStatusRecover();
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
@ -6,13 +6,11 @@ import Line from 'zrender/src/graphic/shape/Line';
|
||||
import BezierCurve from 'zrender/src/graphic/shape/BezierCurve';
|
||||
import Text from 'zrender/src/graphic/Text';
|
||||
import JTriangle from '../utils/JTriangle';
|
||||
import deviceType from '../config/deviceType';
|
||||
import store from '@/store';
|
||||
|
||||
/** 计轴*/
|
||||
class SectionAxle extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
super({name: `${model.name}`});
|
||||
this.model = model;
|
||||
this.zlevel = model.zlevel;
|
||||
this.z = 5;
|
||||
@ -63,7 +61,7 @@ class SectionAxle extends Group {
|
||||
/** 分隔符*/
|
||||
class SectionSeparator extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
super({name: `${model.name}`});
|
||||
this.model = model;
|
||||
this.zlevel = model.zlevel;
|
||||
this.z = 6;
|
||||
@ -161,7 +159,7 @@ class SectionSeparator extends Group {
|
||||
/** 创建区段限速限集合*/
|
||||
class LimitLines extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
super({name: `${model.name}`});
|
||||
this.model = model;
|
||||
this.zlevel = model.zlevel;
|
||||
this.z = model.z;
|
||||
@ -296,7 +294,7 @@ class LimitLines extends Group {
|
||||
/** 创建区段线集合*/
|
||||
class Lines extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
super({name: `${model.name}`});
|
||||
this.model = model;
|
||||
this.zlevel = model.zlevel;
|
||||
this.z = model.z;
|
||||
@ -408,8 +406,8 @@ class Lines extends Group {
|
||||
|
||||
/** 区段*/
|
||||
export default class Section extends Group {
|
||||
constructor({ _code, _type, zlevel, model, state }, style) {
|
||||
super();
|
||||
constructor({ _code, _type, zlevel, model, state }, style, jmap) {
|
||||
super({name: _code});
|
||||
this._code = _code;
|
||||
this._type = _type;
|
||||
this.zlevel = zlevel;
|
||||
@ -418,6 +416,7 @@ export default class Section extends Group {
|
||||
this.state = state;
|
||||
this.style = style;
|
||||
this.selected = false;
|
||||
this.jmap = jmap;
|
||||
this._create();
|
||||
|
||||
// this.on('mousedown', this.mouseclick);
|
||||
@ -427,21 +426,22 @@ export default class Section extends Group {
|
||||
|
||||
_create() {
|
||||
const model = this.model;
|
||||
const state = this.state;
|
||||
// 01:物理区段；02逻辑区段；03道岔区段
|
||||
this.createSectionText(); // 创建区段文字
|
||||
this.createSectionText(); // 创建区段文字
|
||||
if (model.type === '01' && (
|
||||
model.logicSectionNum.length <= 0 ||
|
||||
model.logicSectionNum.length == 1 && model.logicSectionNum[0] == 0) ||
|
||||
model.type === '02') {
|
||||
this.createSection(); // 创建区段
|
||||
this.createSeparator(); // 创建分隔符
|
||||
this.createSection(); // 创建区段
|
||||
this.createSeparator(); // 创建分隔符
|
||||
if (model.type === '01') {
|
||||
this.createAxles(); // 创建计轴
|
||||
}
|
||||
this.setState(model);
|
||||
this.setState(state);
|
||||
}
|
||||
|
||||
// this.mouseStateRecover();
|
||||
this.mouseStateRecover();
|
||||
}
|
||||
|
||||
/** 创建区段*/
|
||||
@ -453,6 +453,7 @@ export default class Section extends Group {
|
||||
this.section = new Lines({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
name: `${this._code}_Lines`,
|
||||
isSwitchSection: model.isSwitchSection,
|
||||
isCurve: model.isCurve,
|
||||
points: model.points,
|
||||
@ -485,6 +486,7 @@ export default class Section extends Group {
|
||||
this.speedLimitLeft = new LimitLines({
|
||||
zlevel: this.zlevel + 4,
|
||||
z: this.z,
|
||||
name: `${this._code}_LimitLines_L`,
|
||||
position: [x, -y],
|
||||
isCurve: model.isCurve,
|
||||
points: model.points,
|
||||
@ -496,6 +498,7 @@ export default class Section extends Group {
|
||||
this.speedLimitRight = new LimitLines({
|
||||
zlevel: this.zlevel + 4,
|
||||
z: this.z,
|
||||
name: `${this._code}_LimitLines_R`,
|
||||
position: [-x, y],
|
||||
isCurve: model.isCurve,
|
||||
points: model.points,
|
||||
@ -522,22 +525,22 @@ export default class Section extends Group {
|
||||
|
||||
/** 区段名称*/
|
||||
if (model.nameShow) {
|
||||
const tempx = x;
|
||||
const tempy = y - (style.sectionWidth + style.textFontSize + style.nameDistance);
|
||||
let tempx = x;
|
||||
let tempy = y - (style.sectionWidth + style.textFontSize + style.nameDistance);
|
||||
|
||||
// 如果不是道岔区段
|
||||
// if (model.type !== '03') {
|
||||
// // 如果逻辑区段，让名称和区段距离减少
|
||||
// const traingle = new JTriangle(model.points[0], model.points[model.points.length - 1]);
|
||||
// if (model.type === '02') {
|
||||
// tempx += traingle.getSin(style.textFontSize * 0.8 + style.nameDistance);
|
||||
// tempy += traingle.getCos(style.textFontSize * 0.8 + style.nameDistance) - style.textFontSize * 2;
|
||||
// const parent = store.getters['map/getDeviceByCode'](model.parentCode);
|
||||
// if (parent) {
|
||||
// model.name = `${parent.name}-${model.name}`;
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
if (model.type !== '03') {
|
||||
// 如果逻辑区段，让名称和区段距离减少
|
||||
const traingle = new JTriangle(model.points[0], model.points[model.points.length - 1]);
|
||||
if (model.type === '02') {
|
||||
tempx += traingle.getSin(style.textFontSize * 0.8 + style.nameDistance);
|
||||
tempy += traingle.getCos(style.textFontSize * 0.8 + style.nameDistance) - style.textFontSize * 2;
|
||||
const parent = this.jmap.getDeviceByCode(model.parentCode);
|
||||
if (parent) {
|
||||
model.name = `${parent.name}-${model.name}`;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 创建区段名称
|
||||
const fontSize = style.type == '02' ? style.textFontSize + 2 : style.textFontSize;
|
||||
@ -696,6 +699,7 @@ export default class Section extends Group {
|
||||
this.lUpAxle = new SectionAxle({
|
||||
style: style,
|
||||
zlevel: this.zlevel,
|
||||
name: `${this._code}_SectionAxle_LU`,
|
||||
point: {
|
||||
x: model.points[0].x,
|
||||
y: model.points[0].y
|
||||
@ -707,6 +711,7 @@ export default class Section extends Group {
|
||||
this.lBottomAxle = new SectionAxle({
|
||||
style: style,
|
||||
zlevel: this.zlevel,
|
||||
name: `${this._code}_SectionAxle_LB`,
|
||||
point: {
|
||||
x: model.points[0].x,
|
||||
y: model.points[0].y
|
||||
@ -720,6 +725,7 @@ export default class Section extends Group {
|
||||
this.rUpAxle = new SectionAxle({
|
||||
style: style,
|
||||
zlevel: this.zlevel,
|
||||
name: `${this._code}_SectionAxle_RU`,
|
||||
point: {
|
||||
x: model.points[model.points.length - 1].x,
|
||||
y: model.points[model.points.length - 1].y
|
||||
@ -731,6 +737,7 @@ export default class Section extends Group {
|
||||
this.rBottomAxle = new SectionAxle({
|
||||
style: style,
|
||||
zlevel: this.zlevel,
|
||||
name: `${this._code}_SectionAxle_RB`,
|
||||
point: {
|
||||
x: model.points[model.points.length - 1].x,
|
||||
y: model.points[model.points.length - 1].y
|
||||
@ -758,6 +765,7 @@ export default class Section extends Group {
|
||||
traingle = new JTriangle(model.points[0], model.points[1]);
|
||||
this.lPartition = new SectionSeparator({
|
||||
style: style,
|
||||
name: `${this._code}_SectionSeparator_L`,
|
||||
borderBorderShow: model.borderBorderShow,
|
||||
zlevel: this.zlevel - 2,
|
||||
traingle: traingle,
|
||||
@ -772,6 +780,7 @@ export default class Section extends Group {
|
||||
/** 创建右侧分隔符*/
|
||||
traingle = new JTriangle(model.points[model.points.length - 2], model.points[model.points.length - 1]);
|
||||
this.rPartition = new SectionSeparator({
|
||||
name: `${this._code}_SectionSeparator_R`,
|
||||
style: style,
|
||||
borderBorderShow: model.borderBorderShow,
|
||||
zlevel: this.zlevel - 2,
|
||||
@ -990,9 +999,9 @@ export default class Section extends Group {
|
||||
}
|
||||
|
||||
/** 设置状态*/
|
||||
setState(model) {
|
||||
setState(state) {
|
||||
this.recover();
|
||||
switch (model.status) {
|
||||
switch (state.status) {
|
||||
case '00': /** 未定义*/
|
||||
this.undefine();
|
||||
break;
|
||||
@ -1040,12 +1049,12 @@ export default class Section extends Group {
|
||||
}
|
||||
|
||||
/** 区段切除*/
|
||||
if (model.cutOff) {
|
||||
if (state.cutOff) {
|
||||
this.sectionCutOff();
|
||||
}
|
||||
|
||||
/** 是否限速*/
|
||||
if (model.speedUpperLimit >= 0) {
|
||||
if (state.speedUpperLimit >= 0) {
|
||||
this.setSpeedUpperLimit();
|
||||
}
|
||||
}
|
||||
@ -1072,13 +1081,13 @@ export default class Section extends Group {
|
||||
setTrainWindowEventShow(show) {
|
||||
let trainWindowCode = this.model.trainWindowCode;
|
||||
if (this.model.isSwitchSection && this.model.parentCode) {
|
||||
const device = store.getters['map/getDeviceByCode'](this.model.parentCode);
|
||||
const device = this.jmap.getDeviceByCode(this.model.parentCode);
|
||||
if (device) {
|
||||
trainWindowCode = device.trainWindowCode;
|
||||
}
|
||||
}
|
||||
|
||||
const trainWindow = store.getters['map/getViewInstanceByDevice']({ _type: deviceType.TrainWindow, _code: trainWindowCode });
|
||||
const trainWindow = this.jmap.getViewInstanceByCode(trainWindowCode);
|
||||
if (trainWindow) {
|
||||
trainWindow.setTrainWindowEventShow(show);
|
||||
}
|
||||
@ -1091,7 +1100,7 @@ export default class Section extends Group {
|
||||
this.sectionTextShadow && this.sectionTextShadow.show();
|
||||
} else {
|
||||
// 道岔区段
|
||||
const refSwitch = store.getters['map/getViewInstanceByDevice']({ _type: deviceType.Switch, _code: this.model.relSwitchCode });
|
||||
const refSwitch = this.jmap.getViewInstanceByCode(this.model.relSwitchCode);
|
||||
refSwitch && refSwitch.mouseStateVisible();
|
||||
}
|
||||
} else {
|
||||
@ -1109,7 +1118,7 @@ export default class Section extends Group {
|
||||
this.sectionTextShadow && this.sectionTextShadow.hide();
|
||||
if (this.model.isSwitchSection) {
|
||||
// 道岔区段
|
||||
const refSwitch = store.getters['map/getViewInstanceByDevice']({ _type: deviceType.Switch, _code: this.model.relSwitchCode });
|
||||
const refSwitch = this.jmap.getViewInstanceByCode(this.model.relSwitchCode);
|
||||
refSwitch && refSwitch.mouseStateRecover();
|
||||
} else {
|
||||
this.section && this.section.setBorderVisible(false);
|
||||
|
||||
77
src/jmap/shape/station.js
Normal file
77
src/jmap/shape/station.js
Normal file
@ -0,0 +1,77 @@
|
||||
/*
|
||||
* 车站
|
||||
*/
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Text from 'zrender/src/graphic/Text';
|
||||
|
||||
export default class Station extends Group {
|
||||
constructor({ _code, _type, zlevel, model, state }, style) {
|
||||
super();
|
||||
this.z = 40;
|
||||
this._code = _code;
|
||||
this._type = _type;
|
||||
this.zlevel = zlevel;
|
||||
this.model = model;
|
||||
this.state = state;
|
||||
this.style = style;
|
||||
this._create();
|
||||
}
|
||||
|
||||
_create() {
|
||||
const model = this.model;
|
||||
const style = this.style;
|
||||
if (model.visible) {
|
||||
this.stationText = new Text({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
position: [0, 0],
|
||||
style: {
|
||||
x: model.position.x,
|
||||
y: model.position.y,
|
||||
text: model.name,
|
||||
textAlign: 'middle',
|
||||
textVerticalAlign: 'top',
|
||||
textFont: model.nameFont || '18px ' + style.textFontFormat,
|
||||
textFill: model.nameFontColor
|
||||
}
|
||||
});
|
||||
|
||||
this.mileageText = new Text({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
position: [0, 0],
|
||||
style: {
|
||||
x: model.position.x,
|
||||
y: model.position.y + parseInt(model.nameFont) + 2,
|
||||
text: model.kmPost,
|
||||
textAlign: 'middle',
|
||||
textVerticalAlign: 'top',
|
||||
textFont: model.kmPostFont || '12px ' + style.textFontFormat,
|
||||
textFill: model.kmPostFontColor
|
||||
}
|
||||
});
|
||||
|
||||
this.add(this.stationText);
|
||||
this.add(this.mileageText);
|
||||
this.setShowMileageText(model.kmPostShow);
|
||||
this.setState(this.state);
|
||||
}
|
||||
}
|
||||
|
||||
/** 设置公里标是否显示*/
|
||||
setShowMileageText(show) {
|
||||
if (show) {
|
||||
this.mileageText.show();
|
||||
} else {
|
||||
this.mileageText.hide();
|
||||
}
|
||||
}
|
||||
|
||||
// eslint-disable-next-line no-unused-vars
|
||||
setState(state) {
|
||||
}
|
||||
|
||||
getShapeTipPoint() {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
@ -12,29 +12,104 @@ export function deviceFactory(type, defaultStateDict, elem) {
|
||||
}, deviceRender[type]);
|
||||
}
|
||||
|
||||
export function parser(data, defaultStateDict) {
|
||||
export function parser(data, jmap) {
|
||||
const mapDevice = {};
|
||||
const defaultStateDict = jmap.getDefaultStateDict();
|
||||
|
||||
if (data) {
|
||||
// zrUtil.each(data.linkList || [], (elem) => {
|
||||
// mapDevice[elem.code] = deviceFactory(deviceType.Link, defaultStateDict, elem);
|
||||
// });
|
||||
console.log('data',data);
|
||||
zrUtil.each(data.sectionList || [], (elem) => {
|
||||
zrUtil.each(data.linkList || [], elem => {
|
||||
mapDevice[elem.code] = deviceFactory(deviceType.Link, defaultStateDict, elem);
|
||||
});
|
||||
|
||||
zrUtil.each(data.sectionList || [], elem => {
|
||||
mapDevice[elem.code] = deviceFactory(deviceType.Section, defaultStateDict, elem);
|
||||
});
|
||||
zrUtil.each(data.signalList || [], (elem) => {
|
||||
|
||||
zrUtil.each(data.signalList || [], elem => {
|
||||
mapDevice[elem.code] = deviceFactory(deviceType.Signal, defaultStateDict, elem);
|
||||
});
|
||||
zrUtil.each(data.stationStandList || [],(elem) => {
|
||||
mapDevice[elem.code] = deviceFactory(deviceType.StationStand, defaultStateDict, elem);
|
||||
});
|
||||
zrUtil.each(data.trainWindowList || [],(elem) => {
|
||||
mapDevice[elem.code] = deviceFactory(deviceType.TrainWindow, defaultStateDict, elem);
|
||||
});
|
||||
zrUtil.each(data.trainList || [],(elem) => {
|
||||
mapDevice[elem.code] = deviceFactory(deviceType.TrainWindow, defaultStateDict, elem);
|
||||
});
|
||||
|
||||
zrUtil.each(data.stationList || [], elem => {
|
||||
mapDevice[elem.code] = deviceFactory(deviceType.Station, defaultStateDict, elem);
|
||||
});
|
||||
|
||||
zrUtil.each(data.stationStandList || [], elem => {
|
||||
mapDevice[elem.code] = deviceFactory(deviceType.StationStand, defaultStateDict, elem);
|
||||
});
|
||||
|
||||
zrUtil.each(data.stationControlList || [], elem => {
|
||||
mapDevice[elem.code] = deviceFactory(deviceType.StationControl, defaultStateDict, elem);
|
||||
});
|
||||
|
||||
zrUtil.each(data.counterList || [], elem => {
|
||||
mapDevice[elem.code] = deviceFactory(deviceType.StationCounter, defaultStateDict, elem);
|
||||
});
|
||||
|
||||
zrUtil.each(data.delayShowList || [], elem => {
|
||||
mapDevice[elem.code] = deviceFactory(deviceType.StationDelayUnlock, defaultStateDict, elem);
|
||||
});
|
||||
|
||||
zrUtil.each(data.lineList || [], elem => {
|
||||
mapDevice[elem.code] = deviceFactory(deviceType.Line, defaultStateDict, elem);
|
||||
});
|
||||
|
||||
zrUtil.each(data.textList || [], elem => {
|
||||
mapDevice[elem.code] = deviceFactory(deviceType.Text, defaultStateDict, elem);
|
||||
});
|
||||
|
||||
zrUtil.each(data.zcList || [], elem => {
|
||||
console.log(elem);
|
||||
mapDevice[elem.code] = deviceFactory(deviceType.ZcControl, defaultStateDict, elem);
|
||||
});
|
||||
|
||||
zrUtil.each(data.lcList || [], elem => {
|
||||
mapDevice[elem.code] = deviceFactory(deviceType.LcControl, defaultStateDict, elem);
|
||||
});
|
||||
|
||||
zrUtil.each(data.tempSpeedLimitList || [], elem => {
|
||||
mapDevice[elem.code] = deviceFactory(deviceType.LimitControl, defaultStateDict, elem);
|
||||
});
|
||||
|
||||
zrUtil.each(data.resourceList || [], elem => {
|
||||
mapDevice[elem.code] = deviceFactory(deviceType.ImageControl, defaultStateDict, elem);
|
||||
});
|
||||
|
||||
zrUtil.each(data.trainList || [], elem => {
|
||||
mapDevice[elem.code] = deviceFactory(deviceType.Train, defaultStateDict, elem);
|
||||
});
|
||||
|
||||
zrUtil.each(data.trainWindowList || [], elem => {
|
||||
mapDevice[elem.code] = deviceFactory(deviceType.TrainWindow, defaultStateDict, elem);
|
||||
});
|
||||
|
||||
zrUtil.each(data.switchList || [], elem => {
|
||||
const cnodeSection = mapDevice[elem.sectionACode];
|
||||
const lnodeSection = mapDevice[elem.sectionBCode];
|
||||
const rnodeSection = mapDevice[elem.sectionCCode];
|
||||
if (cnodeSection && lnodeSection && rnodeSection) {
|
||||
const cnode = mapDevice[cnodeSection.model.linkCode];
|
||||
if (cnode && cnode.model.leftFdCode === lnodeSection.model.linkCode && cnode.model.leftSdCode === rnodeSection.model.linkCode) {
|
||||
elem.intersection = {
|
||||
x: cnodeSection.model.points[0].x,
|
||||
y: cnodeSection.model.points[0].y
|
||||
};
|
||||
elem.skew = {
|
||||
x: rnodeSection.model.points[rnodeSection.model.points.length - 2].x,
|
||||
y: rnodeSection.model.points[rnodeSection.model.points.length - 2].y
|
||||
};
|
||||
} else if (cnode && cnode.model.rightFdCode === lnodeSection.model.linkCode && cnode.model.rightSdCode === rnodeSection.model.linkCode) {
|
||||
elem.intersection = {
|
||||
x: cnodeSection.model.points[cnodeSection.model.points.length - 1].x,
|
||||
y: cnodeSection.model.points[cnodeSection.model.points.length - 1].y
|
||||
};
|
||||
elem.skew = {
|
||||
x: rnodeSection.model.points[1].x,
|
||||
y: rnodeSection.model.points[1].y
|
||||
};
|
||||
}
|
||||
}
|
||||
mapDevice[elem.code] = deviceFactory(deviceType.Switch, defaultStateDict, elem);
|
||||
});
|
||||
}
|
||||
|
||||
return mapDevice;
|
||||
|
||||
@ -4,6 +4,7 @@
|
||||
|
||||
<script>
|
||||
import Jmaps from '@/jmap/maps';
|
||||
import deviceType from '@/jmap/config/deviceType';
|
||||
import { getPublishMapDetail } from '@/api/test.js';
|
||||
|
||||
export default {
|
||||
@ -56,6 +57,7 @@ export default {
|
||||
getPublishMapDetail('03').then(resp => {
|
||||
this.jmap.loadData(resp.data);
|
||||
this.jmap.setDefaultState();
|
||||
this.jmap.setLevelInvisible([deviceType.Link]);
|
||||
});
|
||||
|
||||
// this.jmap.render([
|
||||
|
||||
Loading…
Reference in New Issue
Block a user