调整区段配置

This commit is contained in:
zyy 2020-09-15 17:40:57 +08:00
parent 072a6282b0
commit 4b2939ff0a
27 changed files with 1232 additions and 1542 deletions

View File

@ -6,11 +6,12 @@ class SkinCode extends defaultStyle {
super(); super();
this.fontFamily = '宋体'; this.fontFamily = '宋体';
this[deviceType.Section] = { this[deviceType.Section] = {
elemnetType:['name', 'standTrackText', 'reentryTrackText', 'transferTrackText', 'destinationText', 'line', 'separator', 'speedLimit'],
active: { active: {
routeColor: false // 进路触发颜色 routeColor: false // 进路触发颜色
}, },
text: { // 物理区段名称 name: { // 物理区段名称
show: true, // 物理区段名称显示 z: 2,
position: -1, // 区段名称位置 1 上面 -1 下面 0 对称 position: -1, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 11, // 文字离区段距离 distance: 11, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
@ -21,7 +22,7 @@ class SkinCode extends defaultStyle {
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
logicText: { // 逻辑区段名称 logicText: { // 逻辑区段名称
show: false, // 逻辑区段名称显示 z: 2,
position: -1, // 区段名称位置 1 上面 -1 下面 0 对称 position: -1, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 11, // 文字离区段距离 distance: 11, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
@ -31,8 +32,8 @@ class SkinCode extends defaultStyle {
textPosition: 'inside', // 文字位置 textPosition: 'inside', // 文字位置
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
standText: { // 站台轨名称 standTrackText: { // 站台轨名称
show: true, // 站台轨名称显示 z: 2,
position: 1, // 区段名称位置 1 上面 -1 下面 0 对称 position: 1, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 11, // 文字离区段距离 distance: 11, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
@ -42,8 +43,8 @@ class SkinCode extends defaultStyle {
textPosition: 'inside', // 文字位置 textPosition: 'inside', // 文字位置
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
reentryText: { // 折返轨名称 reentryTrackText: { // 折返轨名称
show: true, // 折返轨名称显示 z: 2,
position: 1, // 区段名称位置 1 上面 -1 下面 0 对称 position: 1, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 11, // 文字离区段距离 distance: 11, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
@ -53,8 +54,8 @@ class SkinCode extends defaultStyle {
textPosition: 'inside', // 文字位置 textPosition: 'inside', // 文字位置
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
transferText: { // 转换轨名称 transferTrackText: { // 转换轨名称
show: true, // 转换轨名称显示 z: 2,
position: 1, // 区段名称位置 1 上面 -1 下面 0 对称 position: 1, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 11, // 文字离区段距离 distance: 11, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
@ -65,7 +66,7 @@ class SkinCode extends defaultStyle {
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
destinationText: { // 目的码名称 destinationText: { // 目的码名称
show: true, // 目的码名称显示 z: 2,
position: 1, // 区段名称位置 1 上面 -1 下面 0 对称 position: 1, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 11, // 文字离区段距离 distance: 11, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
@ -84,6 +85,7 @@ class SkinCode extends defaultStyle {
lineWidthMore: 2.5 lineWidthMore: 2.5
}, },
line: { line: {
z: 0,
width: 5, // 区段宽度 width: 5, // 区段宽度
beyondWidth: 0, // 区段宽超出宽度 beyondWidth: 0, // 区段宽超出宽度
invadeColor: '#EF0C08', // 区段侵入颜色 invadeColor: '#EF0C08', // 区段侵入颜色
@ -104,8 +106,8 @@ class SkinCode extends defaultStyle {
logicalColor: '#FFFF00', // 逻辑区段颜色 (未用) logicalColor: '#FFFF00', // 逻辑区段颜色 (未用)
logicalTextColor: '#C0C0C0' // 逻辑区段名称颜色 (未用) logicalTextColor: '#C0C0C0' // 逻辑区段名称颜色 (未用)
}, },
axle: {}, // 计轴
speedLimit: { // 限速元素 speedLimit: { // 限速元素
z: 2,
width: 1, // 限速线的宽度 width: 1, // 限速线的宽度
distance: 5, // 限速线距离区段距离 distance: 5, // 限速线距离区段距离
lineColor: '#FFFF00', // 限速线颜色 lineColor: '#FFFF00', // 限速线颜色
@ -119,9 +121,6 @@ class SkinCode extends defaultStyle {
color: '#7F7F7F', // 区段边界符颜色 color: '#7F7F7F', // 区段边界符颜色
halfHeight: 5 // 区段分隔符高度的一半 halfHeight: 5 // 区段分隔符高度的一半
}, },
block: {
special: false // 区段特殊显示
},
trainPosition:{ trainPosition:{
display: false // 列车实时位置显示 display: false // 列车实时位置显示
} }

View File

@ -6,11 +6,12 @@ class SkinCode extends defaultStyle {
super(); super();
this.fontFamily = '宋体'; this.fontFamily = '宋体';
this[deviceType.Section] = { this[deviceType.Section] = {
elemnetType:['name', 'standTrackText', 'reentryTrackText', 'transferTrackText', 'destinationText', 'line', 'separator', 'speedLimit', 'speedLimitName'],
active: { active: {
routeColor: false // 进路触发颜色 routeColor: false // 进路触发颜色
}, },
text: { name: {
show: true, // 物理区段名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 10, // 文字离区段距离 distance: 10, // 文字离区段距离
fontSize: 12, // 字体大小 fontSize: 12, // 字体大小
@ -21,7 +22,7 @@ class SkinCode extends defaultStyle {
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
logicText: { // 逻辑区段名称 logicText: { // 逻辑区段名称
show: false, // 逻辑区段名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 12, // 文字离区段距离 distance: 12, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
@ -31,8 +32,8 @@ class SkinCode extends defaultStyle {
textPosition: 'inside', // 文字位置 textPosition: 'inside', // 文字位置
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
standText: { // 站台 standTrackText: { // 站台
show: true, // 站台轨名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 24, // 文字离区段距离 distance: 24, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
@ -42,8 +43,8 @@ class SkinCode extends defaultStyle {
textPosition: 'inside', // 文字位置 textPosition: 'inside', // 文字位置
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
reentryText: { // 折返 reentryTrackText: { // 折返
show: true, // 折返轨名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 36, // 文字离区段距离 distance: 36, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
@ -53,8 +54,8 @@ class SkinCode extends defaultStyle {
textPosition: 'inside', // 文字位置 textPosition: 'inside', // 文字位置
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
transferText: { // 转换轨 transferTrackText: { // 转换轨
show: true, // 转换轨名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 36, // 文字离区段距离 distance: 36, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
@ -65,7 +66,7 @@ class SkinCode extends defaultStyle {
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
destinationText: { // 目的地 destinationText: { // 目的地
show: true, // 目的码名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 12, // 文字离区段距离 distance: 12, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
@ -76,6 +77,7 @@ class SkinCode extends defaultStyle {
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
line: { line: {
z: 0,
width: 5, // 区段宽度 width: 5, // 区段宽度
beyondWidth: 0, // 区段宽超出宽度 beyondWidth: 0, // 区段宽超出宽度
invadeColor: '#FFFFFF', // 区段侵入颜色 invadeColor: '#FFFFFF', // 区段侵入颜色
@ -96,17 +98,20 @@ class SkinCode extends defaultStyle {
logicalTextColor: '#C0C0C0', // 逻辑区段名称颜色 (未用) logicalTextColor: '#C0C0C0', // 逻辑区段名称颜色 (未用)
invalidColor: '#A0522D' // 计轴故障 invalidColor: '#A0522D' // 计轴故障
}, },
axle: {}, // 计轴
speedLimit: { // 限速元素 speedLimit: { // 限速元素
z: 2,
width: 1, // 限速线的宽度 width: 1, // 限速线的宽度
distance: 5, // 限速线距离区段距离 distance: 5, // 限速线距离区段距离
lineColor: '#C0C000', // 限速线颜色 (黄色透明光) lineColor: '#C0C000', // 限速线颜色 (黄色透明光)
nameBackground: '#C0C000', // 限速名称背景颜色 nameShow: true // 名称显示
nameShow: true, // 名称显示 },
nameNumberColor: '#C00808', // 限速值颜色 speedLimitName: {
nameNumberFontSize: 11, // 限速值大小 z: 10,
kilometerColor: '#fff', // 公里标颜色
kilometerFontSize: 8, // 公里标大小 kilometerFontSize: 8, // 公里标大小
kilometerColor: '#fff', // 公里标颜色
nameNumberFontSize: 11, // 限速值大小
nameNumberColor: '#C00808', // 限速值颜色
nameBackground: '#C0C000', // 限速名称背景颜色
drogueWidth: 19, // 浮标宽度 drogueWidth: 19, // 浮标宽度
drogueHeight: 12 // 浮标高度 drogueHeight: 12 // 浮标高度
}, },
@ -118,9 +123,6 @@ class SkinCode extends defaultStyle {
color: 'white', // 区段边界符颜色 color: 'white', // 区段边界符颜色
halfHeight: 5 // 区段分隔符高度的一半 halfHeight: 5 // 区段分隔符高度的一半
}, },
block: {
special: false // 区段特殊显示
},
trainPosition:{ trainPosition:{
display: true // 列车实时位置显示 display: true // 列车实时位置显示
} }

View File

@ -6,11 +6,12 @@ class SkinCode extends defaultStyle {
super(); super();
this.fontFamily = '宋体'; this.fontFamily = '宋体';
this[deviceType.Section] = { this[deviceType.Section] = {
elemnetType:['name', 'standTrackText', 'reentryTrackText', 'transferTrackText', 'line', 'separator', 'speedLimit', 'speedLimitName'],
active: { active: {
routeColor: true // 进路触发颜色 routeColor: true // 进路触发颜色
}, },
text: { name: {
show: true, // 物理区段名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 10, // 文字离区段距离 distance: 10, // 文字离区段距离
fontSize: 12, // 字体大小 fontSize: 12, // 字体大小
@ -21,7 +22,7 @@ class SkinCode extends defaultStyle {
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
logicText: { logicText: {
show: false, // 逻辑区段名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 12, // 文字离区段距离 distance: 12, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
@ -31,8 +32,8 @@ class SkinCode extends defaultStyle {
textPosition: 'inside', // 文字位置 textPosition: 'inside', // 文字位置
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
standText: { standTrackText: {
show: true, // 站台轨名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 24, // 文字离区段距离 distance: 24, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
@ -42,8 +43,8 @@ class SkinCode extends defaultStyle {
textPosition: 'inside', // 文字位置 textPosition: 'inside', // 文字位置
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
reentryText: { reentryTrackText: {
show: true, // 折返轨名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 36, // 文字离区段距离 distance: 36, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
@ -53,8 +54,8 @@ class SkinCode extends defaultStyle {
textPosition: 'inside', // 文字位置 textPosition: 'inside', // 文字位置
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
transferText: { transferTrackText: {
show: true, // 转换轨名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 36, // 文字离区段距离 distance: 36, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
@ -65,7 +66,7 @@ class SkinCode extends defaultStyle {
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
destinationText: { destinationText: {
show: false, // 目的码名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 12, // 文字离区段距离 distance: 12, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
@ -76,6 +77,7 @@ class SkinCode extends defaultStyle {
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
line: { line: {
z: 0,
width: 5, // 区段宽度 width: 5, // 区段宽度
beyondWidth: 0, // 区段宽超出宽度 beyondWidth: 0, // 区段宽超出宽度
invadeColor: '#FFFFFF', // 区段侵入颜色 invadeColor: '#FFFFFF', // 区段侵入颜色
@ -96,17 +98,20 @@ class SkinCode extends defaultStyle {
logicalTextColor: '#C0C0C0', // 逻辑区段名称颜色 (未用) logicalTextColor: '#C0C0C0', // 逻辑区段名称颜色 (未用)
invalidColor: '#B18E38' // 区段ARB故障颜色 invalidColor: '#B18E38' // 区段ARB故障颜色
}, },
axle: {}, // 计轴
speedLimit: { // 限速元素 speedLimit: { // 限速元素
z: 2,
width: 1, // 限速线的宽度 width: 1, // 限速线的宽度
distance: 5, // 限速线距离区段距离 distance: 5, // 限速线距离区段距离
lineColor: '#C0C000', // 限速线颜色 (黄色透明光) lineColor: '#C0C000', // 限速线颜色 (黄色透明光)
nameBackground: '#C0C000', // 限速名称背景颜色 nameShow: true // 名称显示
nameShow: true, // 名称显示 },
nameNumberColor: '#C00808', // 限速值颜色 speedLimitName: {
nameNumberFontSize: 11, // 限速值大小 z: 10,
kilometerColor: '#fff', // 公里标颜色
kilometerFontSize: 8, // 公里标大小 kilometerFontSize: 8, // 公里标大小
kilometerColor: '#fff', // 公里标颜色
nameNumberFontSize: 11, // 限速值大小
nameNumberColor: '#C00808', // 限速值颜色
nameBackground: '#C0C000', // 限速名称背景颜色
drogueWidth: 19, // 浮标宽度 drogueWidth: 19, // 浮标宽度
drogueHeight: 12 // 浮标高度 drogueHeight: 12 // 浮标高度
}, },
@ -118,11 +123,11 @@ class SkinCode extends defaultStyle {
color: '#FFFFFF', // 区段边界符颜色 color: '#FFFFFF', // 区段边界符颜色
halfHeight: 5 // 区段分隔符高度的一半 halfHeight: 5 // 区段分隔符高度的一半
}, },
// shuttleBack: { // 折返进路 (存在此对象 显示折返箭头) shuttleBack: { // 折返进路 (存在此对象 显示折返箭头)
// distance: 5 // 限速线距离区段距离 z: 10,
// }, width: 1.5,
block: { color: '#FFFFFF',
special: false // 区段特殊显示 distance: 5 // 限速线距离区段距离
}, },
trainPosition:{ trainPosition:{
display: false // 列车实时位置显示 display: false // 列车实时位置显示

View File

@ -6,11 +6,12 @@ class SkinCode extends defaultStyle {
super(); super();
this.fontFamily = '宋体'; this.fontFamily = '宋体';
this[deviceType.Section] = { this[deviceType.Section] = {
elemnetType:['name', 'logicText', 'standTrackText', 'reentryTrackText', 'transferTrackText', 'destinationText', 'line', 'separator', 'speedLimit'],
active: { active: {
routeColor: false // 进路触发颜色 routeColor: false // 进路触发颜色
}, },
text: { name: {
show: true, // 物理区段名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 18, // 文字离区段距离 distance: 18, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
@ -21,7 +22,7 @@ class SkinCode extends defaultStyle {
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
logicText: { logicText: {
show: true, // 逻辑区段名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 6, // 文字离区段距离 distance: 6, // 文字离区段距离
fontSize: 8, // 字体大小 fontSize: 8, // 字体大小
@ -31,8 +32,8 @@ class SkinCode extends defaultStyle {
textPosition: 'inside', // 文字位置 textPosition: 'inside', // 文字位置
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
standText: { standTrackText: {
show: true, // 站台轨名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 30, // 文字离区段距离 distance: 30, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
@ -42,8 +43,8 @@ class SkinCode extends defaultStyle {
textPosition: 'inside', // 文字位置 textPosition: 'inside', // 文字位置
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
reentryText: { reentryTrackText: {
show: true, // 折返轨名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 30, // 文字离区段距离 distance: 30, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
@ -53,8 +54,8 @@ class SkinCode extends defaultStyle {
textPosition: 'inside', // 文字位置 textPosition: 'inside', // 文字位置
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
transferText: { transferTrackText: {
show: true, // 转换轨名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 28, // 文字离区段距离 distance: 28, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
@ -65,7 +66,7 @@ class SkinCode extends defaultStyle {
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
destinationText: { destinationText: {
show: true, // 目的码名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 10, // 文字离区段距离 distance: 10, // 文字离区段距离
fontSize: 10, // 字体大小 fontSize: 10, // 字体大小
@ -76,6 +77,7 @@ class SkinCode extends defaultStyle {
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
line: { line: {
z: 0,
width: 5, // 区段宽度 width: 5, // 区段宽度
beyondWidth: 0, // 区段宽超出宽度 beyondWidth: 0, // 区段宽超出宽度
invadeColor: '#EF0C08', // 区段侵入颜色 invadeColor: '#EF0C08', // 区段侵入颜色
@ -96,8 +98,8 @@ class SkinCode extends defaultStyle {
logicalTextColor: '#FFFFFF', // 逻辑区段名称颜色 (未用) logicalTextColor: '#FFFFFF', // 逻辑区段名称颜色 (未用)
invalidColor: '#A25100' // 区段ARB故障颜色 invalidColor: '#A25100' // 区段ARB故障颜色
}, },
axle: {}, // 计轴
speedLimit: { // 限速元素 speedLimit: { // 限速元素
z: 2,
width: 1, // 限速线的宽短 width: 1, // 限速线的宽短
distance: 5, // 限速线距离区段距离 distance: 5, // 限速线距离区段距离
lineColor: '#FFFF00', // 限速线颜色 lineColor: '#FFFF00', // 限速线颜色
@ -111,9 +113,6 @@ class SkinCode extends defaultStyle {
color: '#3149C3', // 区段边界符颜色 color: '#3149C3', // 区段边界符颜色
halfHeight: 5 // 区段分隔符高度的一半 halfHeight: 5 // 区段分隔符高度的一半
}, },
block: {
special: false // 区段特殊显示
},
trainPosition:{ trainPosition:{
display: false // 列车实时位置显示 display: false // 列车实时位置显示
} }

View File

@ -6,11 +6,12 @@ class SkinCode extends defaultStyle {
super(); super();
this.fontFamily = '宋体'; this.fontFamily = '宋体';
this[deviceType.Section] = { this[deviceType.Section] = {
elemnetType:['name', 'logicText', 'standTrackText', 'reentryTrackText', 'transferTrackText', 'destinationText', 'line', 'separator', 'speedLimit'],
active: { active: {
routeColor: false // 进路触发颜色 routeColor: false // 进路触发颜色
}, },
text: { name: {
show: true, // 物理区段名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 18, // 文字离区段距离 distance: 18, // 文字离区段距离
fontSize: 12, // 字体大小 fontSize: 12, // 字体大小
@ -21,7 +22,7 @@ class SkinCode extends defaultStyle {
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
logicText: { logicText: {
show: true, // 逻辑区段名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 6, // 文字离区段距离 distance: 6, // 文字离区段距离
fontSize: 12, // 字体大小 fontSize: 12, // 字体大小
@ -31,8 +32,8 @@ class SkinCode extends defaultStyle {
textPosition: 'inside', // 文字位置 textPosition: 'inside', // 文字位置
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
standText: { standTrackText: {
show: true, // 站台轨名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 30, // 文字离区段距离 distance: 30, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
@ -42,8 +43,8 @@ class SkinCode extends defaultStyle {
textPosition: 'inside', // 文字位置 textPosition: 'inside', // 文字位置
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
reentryText: { reentryTrackText: {
show: true, // 折返轨名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 30, // 文字离区段距离 distance: 30, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
@ -53,8 +54,8 @@ class SkinCode extends defaultStyle {
textPosition: 'inside', // 文字位置 textPosition: 'inside', // 文字位置
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
transferText: { transferTrackText: {
show: true, // 转换轨名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 28, // 文字离区段距离 distance: 28, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
@ -65,7 +66,7 @@ class SkinCode extends defaultStyle {
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
destinationText: { destinationText: {
show: true, // 目的码名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 10, // 文字离区段距离 distance: 10, // 文字离区段距离
fontSize: 10, // 字体大小 fontSize: 10, // 字体大小
@ -76,6 +77,7 @@ class SkinCode extends defaultStyle {
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
line: { line: {
z: 0,
width: 5, // 区段宽度 width: 5, // 区段宽度
beyondWidth: 0, // 区段宽超出宽度 beyondWidth: 0, // 区段宽超出宽度
invadeColor: '#EF0C08', // 区段侵入颜色 invadeColor: '#EF0C08', // 区段侵入颜色
@ -96,8 +98,8 @@ class SkinCode extends defaultStyle {
logicalTextColor: '#FFFFFF', // 逻辑区段名称颜色 (未用) logicalTextColor: '#FFFFFF', // 逻辑区段名称颜色 (未用)
invalidColor: '#A25100' // 区段ARB故障颜色 invalidColor: '#A25100' // 区段ARB故障颜色
}, },
axle: {}, // 计轴
speedLimit: { // 限速元素 speedLimit: { // 限速元素
z: 2,
width: 1, // 限速线的宽短 width: 1, // 限速线的宽短
distance: 5, // 限速线距离区段距离 distance: 5, // 限速线距离区段距离
lineColor: '#FFFF00', // 限速线颜色 lineColor: '#FFFF00', // 限速线颜色
@ -111,9 +113,6 @@ class SkinCode extends defaultStyle {
color: '#3149C3', // 区段边界符颜色 color: '#3149C3', // 区段边界符颜色
halfHeight: 5 // 区段分隔符高度的一半 halfHeight: 5 // 区段分隔符高度的一半
}, },
block: {
special: false // 区段特殊显示
},
trainPosition:{ trainPosition:{
display: false // 列车实时位置显示 display: false // 列车实时位置显示
} }

View File

@ -6,11 +6,12 @@ class SkinCode extends defaultStyle {
super(); super();
this.fontFamily = '宋体'; this.fontFamily = '宋体';
this[deviceType.Section] = { this[deviceType.Section] = {
elemnetType:['name', 'logicText', 'standTrackText', 'reentryTrackText', 'transferTrackText', 'line', 'lineBorder', 'sectionBlock', 'speedLimit'],
active: { active: {
routeColor: false // 进路触发颜色 routeColor: false // 进路触发颜色
}, },
text: { name: {
show: true, // 物理区段名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 18, // 文字离区段距离 distance: 18, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
@ -21,7 +22,7 @@ class SkinCode extends defaultStyle {
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
logicText: { logicText: {
show: true, // 逻辑区段名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 6, // 文字离区段距离 distance: 6, // 文字离区段距离
fontSize: 8, // 字体大小 fontSize: 8, // 字体大小
@ -31,8 +32,8 @@ class SkinCode extends defaultStyle {
textPosition: 'inside', // 文字位置 textPosition: 'inside', // 文字位置
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
standText: { standTrackText: {
show: true, // 站台轨名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 30, // 文字离区段距离 distance: 30, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
@ -42,8 +43,8 @@ class SkinCode extends defaultStyle {
textPosition: 'inside', // 文字位置 textPosition: 'inside', // 文字位置
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
reentryText: { reentryTrackText: {
show: true, // 折返轨名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 30, // 文字离区段距离 distance: 30, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
@ -53,8 +54,8 @@ class SkinCode extends defaultStyle {
textPosition: 'inside', // 文字位置 textPosition: 'inside', // 文字位置
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
transferText: { transferTrackText: {
show: true, // 转换轨名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 28, // 文字离区段距离 distance: 28, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
@ -65,7 +66,7 @@ class SkinCode extends defaultStyle {
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
destinationText: { destinationText: {
show: false, // 目的码名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 10, // 文字离区段距离 distance: 10, // 文字离区段距离
fontSize: 10, // 字体大小 fontSize: 10, // 字体大小
@ -76,7 +77,7 @@ class SkinCode extends defaultStyle {
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
line: { line: {
isActiveShow: true, // 哈尔滨点击元素显示 z: 0,
width: 5, // 区段宽度 width: 5, // 区段宽度
beyondWidth: 0, // 区段宽超出宽度 beyondWidth: 0, // 区段宽超出宽度
invadeColor: '#EF0C08', // 区段侵入颜色 invadeColor: '#EF0C08', // 区段侵入颜色
@ -97,8 +98,15 @@ class SkinCode extends defaultStyle {
logicalColor: '#FFFF00', // 逻辑区段颜色 (未用) logicalColor: '#FFFF00', // 逻辑区段颜色 (未用)
logicalTextColor: '#FFFFFF' // 逻辑区段名称颜色 (未用) logicalTextColor: '#FFFFFF' // 逻辑区段名称颜色 (未用)
}, },
axle: {}, // 计轴 lineBorder: { // 哈尔滨点击背景 元素
z: -1,
activeStroke: '#2EBFBF'
},
sectionBlock: {
z: 2
}, // 计轴
speedLimit: { // 限速元素 speedLimit: { // 限速元素
z: 2,
width: 1, // 限速线的宽短 width: 1, // 限速线的宽短
distance: 5, // 限速线距离区段距离 distance: 5, // 限速线距离区段距离
lineColor: '#FFFF00', // 限速线颜色 lineColor: '#FFFF00', // 限速线颜色
@ -112,9 +120,6 @@ class SkinCode extends defaultStyle {
color: '#3149C3', // 区段边界符颜色 color: '#3149C3', // 区段边界符颜色
halfHeight: 5 // 区段分隔符高度的一半 halfHeight: 5 // 区段分隔符高度的一半
}, },
block: {
special: true // 区段特殊显示
},
trainPosition:{ trainPosition:{
display: false // 列车实时位置显示 display: false // 列车实时位置显示
} }

View File

@ -6,11 +6,12 @@ class SkinCode extends defaultStyle {
super(); super();
this.fontFamily = '宋体'; this.fontFamily = '宋体';
this[deviceType.Section] = { this[deviceType.Section] = {
elemnetType:['name', 'standTrackText', 'reentryTrackText', 'transferTrackText', 'destinationText', 'line', 'separator', 'speedLimit'],
active: { active: {
routeColor: false // 进路触发颜色 routeColor: false // 进路触发颜色
}, },
text: { name: {
show: true, // 物理区段名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 10, // 文字离区段距离 distance: 10, // 文字离区段距离
fontSize: 12, // 字体大小 fontSize: 12, // 字体大小
@ -21,7 +22,7 @@ class SkinCode extends defaultStyle {
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
logicText: { // 逻辑区段名称 logicText: { // 逻辑区段名称
show: false, // 逻辑区段名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 12, // 文字离区段距离 distance: 12, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
@ -31,8 +32,8 @@ class SkinCode extends defaultStyle {
textPosition: 'inside', // 文字位置 textPosition: 'inside', // 文字位置
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
standText: { // 站台 standTrackText: { // 站台
show: true, // 站台轨名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 24, // 文字离区段距离 distance: 24, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
@ -42,8 +43,8 @@ class SkinCode extends defaultStyle {
textPosition: 'inside', // 文字位置 textPosition: 'inside', // 文字位置
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
reentryText: { // 折返 reentryTrackText: { // 折返
show: true, // 折返轨名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 36, // 文字离区段距离 distance: 36, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
@ -53,8 +54,8 @@ class SkinCode extends defaultStyle {
textPosition: 'inside', // 文字位置 textPosition: 'inside', // 文字位置
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
transferText: { // 转换轨 transferTrackText: { // 转换轨
show: true, // 转换轨名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 36, // 文字离区段距离 distance: 36, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
@ -65,7 +66,7 @@ class SkinCode extends defaultStyle {
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
destinationText: { // 目的地 destinationText: { // 目的地
show: true, // 目的码名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 12, // 文字离区段距离 distance: 12, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
@ -76,6 +77,7 @@ class SkinCode extends defaultStyle {
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
line: { line: {
z: 0,
width: 5, // 区段宽度 width: 5, // 区段宽度
beyondWidth: 0, // 区段宽超出宽度 beyondWidth: 0, // 区段宽超出宽度
invadeColor: '#FFFFFF', // 区段侵入颜色 invadeColor: '#FFFFFF', // 区段侵入颜色
@ -96,19 +98,12 @@ class SkinCode extends defaultStyle {
logicalColor: '#FFFF00', // 逻辑区段颜色 (未用) logicalColor: '#FFFF00', // 逻辑区段颜色 (未用)
logicalTextColor: 'white' // 逻辑区段名称颜色 (未用) logicalTextColor: 'white' // 逻辑区段名称颜色 (未用)
}, },
axle: {}, // 计轴
speedLimit: { // 限速元素 speedLimit: { // 限速元素
z: 2,
width: 1, // 限速线的宽度 width: 1, // 限速线的宽度
distance: 5, // 限速线距离区段距离 distance: 5, // 限速线距离区段距离
lineColor: '#C0C000', // 限速线颜色 (黄色透明光) lineColor: '#C0C000', // 限速线颜色 (黄色透明光)
nameBackground: '#C0C000', // 限速名称背景颜色 nameShow: false // 名称显示
nameShow: false, // 名称显示
nameNumberColor: '#C00808', // 限速值颜色
nameNumberFontSize: 11, // 限速值大小
kilometerColor: '#fff', // 公里标颜色
kilometerFontSize: 8, // 公里标大小
drogueWidth: 19, // 浮标宽度
drogueHeight: 12 // 浮标高度
}, },
separator: { separator: {
z: 3, // 分割符层级 z: 3, // 分割符层级
@ -119,7 +114,6 @@ class SkinCode extends defaultStyle {
halfHeight: 5 // 区段分隔符高度的一半 halfHeight: 5 // 区段分隔符高度的一半
}, },
block: { block: {
special: false, // 区段特殊显示
blockGlint: true // 区段封锁闪烁显示 blockGlint: true // 区段封锁闪烁显示
}, },
trainPosition:{ trainPosition:{

View File

@ -7,11 +7,12 @@ class SkinCode extends defaultStyle {
this.fontFamily = '宋体'; this.fontFamily = '宋体';
this.backgroundColor = '#808080'; this.backgroundColor = '#808080';
this[deviceType.Section] = { this[deviceType.Section] = {
elemnetType:['name', 'standTrackText', 'reentryTrackText', 'transferTrackText', 'destinationText', 'line', 'stopRouteImg', 'separator', 'speedLimit'],
active: { active: {
routeColor: false // 进路触发颜色 routeColor: false // 进路触发颜色
}, },
text: { name: {
show: true, // 物理区段名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 10, // 文字离区段距离 distance: 10, // 文字离区段距离
fontSize: 12, // 字体大小 fontSize: 12, // 字体大小
@ -22,7 +23,7 @@ class SkinCode extends defaultStyle {
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
logicText: { // 逻辑区段名称 logicText: { // 逻辑区段名称
show: false, // 逻辑区段名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 12, // 文字离区段距离 distance: 12, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
@ -32,8 +33,8 @@ class SkinCode extends defaultStyle {
textPosition: 'inside', // 文字位置 textPosition: 'inside', // 文字位置
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
standText: { // 站台 standTrackText: { // 站台
show: true, // 站台轨名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 24, // 文字离区段距离 distance: 24, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
@ -43,8 +44,8 @@ class SkinCode extends defaultStyle {
textPosition: 'inside', // 文字位置 textPosition: 'inside', // 文字位置
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
reentryText: { // 折返 reentryTrackText: { // 折返
show: true, // 折返轨名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 36, // 文字离区段距离 distance: 36, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
@ -54,8 +55,8 @@ class SkinCode extends defaultStyle {
textPosition: 'inside', // 文字位置 textPosition: 'inside', // 文字位置
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
transferText: { // 转换轨 transferTrackText: { // 转换轨
show: true, // 转换轨名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 36, // 文字离区段距离 distance: 36, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
@ -66,7 +67,7 @@ class SkinCode extends defaultStyle {
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
destinationText: { // 目的地 destinationText: { // 目的地
show: true, // 目的码名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 12, // 文字离区段距离 distance: 12, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
@ -77,6 +78,7 @@ class SkinCode extends defaultStyle {
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
line: { line: {
z: 0,
width: 8, // 区段宽度 width: 8, // 区段宽度
beyondWidth: 0, // 区段宽超出宽度 beyondWidth: 0, // 区段宽超出宽度
invadeColor: '#FFFFFF', // 区段侵入颜色 invadeColor: '#FFFFFF', // 区段侵入颜色
@ -127,19 +129,12 @@ class SkinCode extends defaultStyle {
cancelMauLineStroke: '#000' cancelMauLineStroke: '#000'
}, },
stopRouteImg: {}, stopRouteImg: {},
axle: {}, // 计轴
speedLimit: { // 限速元素 speedLimit: { // 限速元素
z: 2,
width: 1, // 限速线的宽度 width: 1, // 限速线的宽度
distance: 5, // 限速线距离区段距离 distance: 5, // 限速线距离区段距离
lineColor: '#C0C000', // 限速线颜色 (黄色透明光) lineColor: '#C0C000', // 限速线颜色 (黄色透明光)
nameBackground: '#C0C000', // 限速名称背景颜色 nameShow: false // 名称显示
nameShow: false, // 名称显示
nameNumberColor: '#C00808', // 限速值颜色
nameNumberFontSize: 11, // 限速值大小
kilometerColor: '#fff', // 公里标颜色
kilometerFontSize: 8, // 公里标大小
drogueWidth: 19, // 浮标宽度
drogueHeight: 12 // 浮标高度
}, },
separator: { separator: {
z: -1, // 分割符层级 z: -1, // 分割符层级
@ -150,7 +145,6 @@ class SkinCode extends defaultStyle {
halfHeight: 8 // 区段分隔符高度的一半 halfHeight: 8 // 区段分隔符高度的一半
}, },
block: { block: {
special: false, // 区段特殊显示
blockGlint: true // 区段封锁闪烁显示 blockGlint: true // 区段封锁闪烁显示
}, },
trainPosition:{ trainPosition:{

View File

@ -6,11 +6,12 @@ class SkinCode extends defaultStyle {
super(); super();
this.fontFamily = '宋体'; this.fontFamily = '宋体';
this[deviceType.Section] = { this[deviceType.Section] = {
elemnetType:['name', 'logicText', 'standTrackText', 'reentryTrackText', 'transferTrackText', 'destinationText', 'line', 'separator', 'speedLimit'],
active: { active: {
routeColor: false // 进路触发颜色 routeColor: false // 进路触发颜色
}, },
text: { name: {
show: true, // 物理区段名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 18, // 文字离区段距离 distance: 18, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
@ -21,7 +22,7 @@ class SkinCode extends defaultStyle {
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
logicText: { logicText: {
show: true, // 逻辑区段名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 6, // 文字离区段距离 distance: 6, // 文字离区段距离
fontSize: 8, // 字体大小 fontSize: 8, // 字体大小
@ -31,8 +32,8 @@ class SkinCode extends defaultStyle {
textPosition: 'inside', // 文字位置 textPosition: 'inside', // 文字位置
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
standText: { standTrackText: {
show: true, // 站台轨名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 30, // 文字离区段距离 distance: 30, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
@ -42,8 +43,8 @@ class SkinCode extends defaultStyle {
textPosition: 'inside', // 文字位置 textPosition: 'inside', // 文字位置
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
reentryText: { reentryTrackText: {
show: true, // 折返轨名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 30, // 文字离区段距离 distance: 30, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
@ -53,8 +54,8 @@ class SkinCode extends defaultStyle {
textPosition: 'inside', // 文字位置 textPosition: 'inside', // 文字位置
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
transferText: { transferTrackText: {
show: true, // 转换轨名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 28, // 文字离区段距离 distance: 28, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
@ -65,7 +66,7 @@ class SkinCode extends defaultStyle {
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
destinationText: { destinationText: {
show: true, // 目的码名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 10, // 文字离区段距离 distance: 10, // 文字离区段距离
fontSize: 10, // 字体大小 fontSize: 10, // 字体大小
@ -84,6 +85,7 @@ class SkinCode extends defaultStyle {
lineWidthMore: 5 lineWidthMore: 5
}, },
line: { line: {
z: 0,
width: 5, // 区段宽度 width: 5, // 区段宽度
beyondWidth: 0, // 区段宽超出宽度 beyondWidth: 0, // 区段宽超出宽度
invadeColor: '#EF0C08', // 区段侵入颜色 invadeColor: '#EF0C08', // 区段侵入颜色
@ -104,8 +106,8 @@ class SkinCode extends defaultStyle {
logicalTextColor: '#FFFFFF', // 逻辑区段名称颜色 (未用) logicalTextColor: '#FFFFFF', // 逻辑区段名称颜色 (未用)
invalidColor: '#9C5208' // 区段ARB故障颜色 invalidColor: '#9C5208' // 区段ARB故障颜色
}, },
axle: {}, // 计轴
speedLimit: { // 限速元素 speedLimit: { // 限速元素
z: 2,
width: 1, // 限速线的宽短 width: 1, // 限速线的宽短
distance: 5, // 限速线距离区段距离 distance: 5, // 限速线距离区段距离
lineColor: '#FFFF00', // 限速线颜色 lineColor: '#FFFF00', // 限速线颜色
@ -119,9 +121,6 @@ class SkinCode extends defaultStyle {
color: '#3149C3', // 区段边界符颜色 color: '#3149C3', // 区段边界符颜色
halfHeight: 5 // 区段分隔符高度的一半 halfHeight: 5 // 区段分隔符高度的一半
}, },
block: {
special: false // 区段特殊显示
},
trainPosition:{ trainPosition:{
display: false // 列车实时位置显示 display: false // 列车实时位置显示
} }

View File

@ -6,11 +6,12 @@ class SkinCode extends defaultStyle {
super(); super();
this.fontFamily = '宋体'; this.fontFamily = '宋体';
this[deviceType.Section] = { this[deviceType.Section] = {
elemnetType:['name', 'standTrackText', 'reentryTrackText', 'transferTrackText', 'destinationText', 'line', 'axle', 'speedLimit'],
active: { active: {
routeColor: false // 进路触发颜色 routeColor: false // 进路触发颜色
}, },
text: { name: {
show: true, // 物理区段名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 18, // 文字离区段距离 distance: 18, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
@ -21,7 +22,7 @@ class SkinCode extends defaultStyle {
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
logicText: { // 逻辑区段名称 logicText: { // 逻辑区段名称
show: false, // 逻辑区段名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 6, // 文字离区段距离 distance: 6, // 文字离区段距离
fontSize: 8, // 字体大小 fontSize: 8, // 字体大小
@ -31,8 +32,8 @@ class SkinCode extends defaultStyle {
textPosition: 'inside', // 文字位置 textPosition: 'inside', // 文字位置
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
standText: { // 站台 standTrackText: { // 站台名称
show: true, // 站台轨名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 区段名称位置 1 上面 -1 下面 0 对称
distance: 30, // 文字离区段距离 distance: 30, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
@ -42,9 +43,9 @@ class SkinCode extends defaultStyle {
textPosition: 'inside', // 文字位置 textPosition: 'inside', // 文字位置
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
reentryText: { // 折返 reentryTrackText: { // 折返名称
show: true, // 折返轨名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 名称位置 1 上面 -1 下面 0 对称
distance: 30, // 文字离区段距离 distance: 30, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
fontWeight: 'normal', // 字体粗细 fontWeight: 'normal', // 字体粗细
@ -53,9 +54,9 @@ class SkinCode extends defaultStyle {
textPosition: 'inside', // 文字位置 textPosition: 'inside', // 文字位置
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
transferText: { // 转换轨 transferTrackText: { // 转换轨名称
show: true, // 转换轨名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 名称位置 1 上面 -1 下面 0 对称
distance: 30, // 文字离区段距离 distance: 30, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
fontWeight: 'normal', // 字体粗细 fontWeight: 'normal', // 字体粗细
@ -64,9 +65,9 @@ class SkinCode extends defaultStyle {
textPosition: 'inside', // 文字位置 textPosition: 'inside', // 文字位置
textVerticalAlign: 'middle' // 文字垂直对齐方式 textVerticalAlign: 'middle' // 文字垂直对齐方式
}, },
destinationText: { // 目的地 destinationText: { // 目的地名称
show: true, // 目的码名称显示 z: 2,
position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 position: 0, // 名称位置 1 上面 -1 下面 0 对称
distance: 28, // 文字离区段距离 distance: 28, // 文字离区段距离
fontSize: 11, // 字体大小 fontSize: 11, // 字体大小
fontWeight: 'bold', // 字体粗细 fontWeight: 'bold', // 字体粗细
@ -84,6 +85,7 @@ class SkinCode extends defaultStyle {
lineWidthMore: 6 lineWidthMore: 6
}, },
line: { line: {
z: 0,
width: 4, // 区段宽度 width: 4, // 区段宽度
beyondWidth: 0, // 区段宽超出宽度 beyondWidth: 0, // 区段宽超出宽度
invadeColor: '#FFFFFF', // 区段侵入颜色 invadeColor: '#FFFFFF', // 区段侵入颜色
@ -104,7 +106,7 @@ class SkinCode extends defaultStyle {
logicalTextColor: '#C0C0C0' // 逻辑区段名称颜色 (未用) logicalTextColor: '#C0C0C0' // 逻辑区段名称颜色 (未用)
}, },
axle: { axle: {
show: true, // 计轴是否显示 z: 3,
radius: 3, // 计轴 半径 radius: 3, // 计轴 半径
distance: 4, // 计轴和区段之间的距离 (未用) distance: 4, // 计轴和区段之间的距离 (未用)
color: '#9F9C9C', // 区段计轴颜色 color: '#9F9C9C', // 区段计轴颜色
@ -114,17 +116,11 @@ class SkinCode extends defaultStyle {
lineWidth: 2 lineWidth: 2
}, },
speedLimit: { // 限速元素 speedLimit: { // 限速元素
z: 2,
width: 1, // 限速线的宽度 width: 1, // 限速线的宽度
distance: 5, // 限速线距离区段距离 distance: 5, // 限速线距离区段距离
lineColor: '#C0C000', // 限速线颜色 (黄色透明光) lineColor: '#C0C000', // 限速线颜色 (黄色透明光)
nameBackground: '#C0C000', // 限速名称背景颜色 nameShow: false // 名称显示
nameShow: true, // 名称显示
nameNumberColor: '#C00808', // 限速值颜色
nameNumberFontSize: 11, // 限速值大小
kilometerColor: '#fff', // 公里标颜色
kilometerFontSize: 8, // 公里标大小
drogueWidth: 19, // 浮标宽度
drogueHeight: 12 // 浮标高度
}, },
separator: { separator: {
z: 3, // 分割符层级 z: 3, // 分割符层级
@ -134,9 +130,6 @@ class SkinCode extends defaultStyle {
color: '#AAA9A9', // 区段边界符颜色 color: '#AAA9A9', // 区段边界符颜色
halfHeight: 4 // 区段分隔符高度的一半 halfHeight: 4 // 区段分隔符高度的一半
}, },
block: {
special: false // 区段特殊显示
},
trainPosition:{ trainPosition:{
display: true // 列车实时位置显示 display: true // 列车实时位置显示
} }

View File

@ -453,7 +453,6 @@ class Jlmap {
} else if (elem.deviceType == 'OVERLAP') { } else if (elem.deviceType == 'OVERLAP') {
const overlapRoute = this.mapDevice[elem.code]; const overlapRoute = this.mapDevice[elem.code];
const model = this.mapDevice[overlapRoute.pathList[0].sectionList[0]]; const model = this.mapDevice[overlapRoute.pathList[0].sectionList[0]];
// console.log(overlapRoute.pathList[0].right, model.name, elem.remainTime);
if (overlapRoute.pathList[0].right) { if (overlapRoute.pathList[0].right) {
overlapRoute['points'] = { x: model.points[0].x, y: model.points[0].y }; overlapRoute['points'] = { x: model.points[0].x, y: model.points[0].y };
} else { } else {

View File

@ -164,6 +164,7 @@ class MouseController extends Eventful {
click(e) { click(e) {
var em = this.checkEvent(e); var em = this.checkEvent(e);
// console.log(em, e);
this.trigger(this.events.Selected, em); this.trigger(this.events.Selected, em);
} }

View File

@ -28,9 +28,9 @@ export default class OverAp extends Group {
silent: false, silent: false,
x: model.points.x + 30, x: model.points.x + 30,
y: model.points.y - style.Section.line.width * 2, y: model.points.y - style.Section.line.width * 2,
fontWeight: style.Section.text.fontWeight, fontWeight: style.Section.name.fontWeight,
text: model.remainTime || 30, text: model.remainTime || 30,
textPosition: style.Section.text.textPosition, textPosition: style.Section.name.textPosition,
fontSize: 12, fontSize: 12,
fontFamily: style.fontFamily, fontFamily: style.fontFamily,
textFill: '#FFF', textFill: '#FFF',

View File

@ -2,68 +2,98 @@ import Group from 'zrender/src/container/Group';
import Line from 'zrender/src/graphic/shape/Line'; import Line from 'zrender/src/graphic/shape/Line';
import Circle from 'zrender/src/graphic/shape/Circle'; import Circle from 'zrender/src/graphic/shape/Circle';
import Isogon from 'zrender/src/graphic/shape/Isogon'; import Isogon from 'zrender/src/graphic/shape/Isogon';
// import Path from 'zrender/src/graphic/Path'; import JTriangle from '../../utils/JTriangle';
// 计轴 export default class EAxle extends Group {
// export default Path.extend({
// type: 'EAxle',
// _subType: '',
// buildPath: function (path, shape) {
// if (shape && shape.style && shape.traingle) {
// const axleLength = 2 * shape.style.Section.axle.radius;
// // const positionx = shape.point.x + shape.drictx * (shape.traingle.getCos(axleLength) * 1.2);
// // const positiony = shape.point.y + shape.dricty * (shape.traingle.getCos(axleLength) * 1.2);
// const positionx = shape.point.x + shape.drictx * (shape.traingle.getCos(axleLength) * 1.05);
// const positiony = shape.point.y + shape.dricty * (shape.traingle.getCos(axleLength) * 1.05);
// // 圆弧
// const arcX = positionx - shape.dricty * shape.traingle.getSin(axleLength);
// const arcY = positiony + shape.drictx * shape.traingle.getSin(axleLength);
// const arcR = shape.style.Section.axle.radius;
// path.arc(arcX, arcY, arcR, 0, 2 * Math.PI, false);
// path.closePath();
//
// const x1 = positionx - shape.traingle.getCos(axleLength * shape.multiple1) - shape.dricty * shape.traingle.getSin(axleLength);
// const y1 = positiony + shape.drictx * shape.traingle.getSin(axleLength * shape.multiple1) - shape.traingle.getSin(axleLength);
// const x2 = positionx + shape.traingle.getCos(axleLength * shape.multiple2) - shape.dricty * shape.traingle.getSin(axleLength);
// const y2 = positiony + shape.drictx * shape.traingle.getSin(axleLength * shape.multiple2) + shape.traingle.getSin(axleLength);
// path.moveTo(x1, y1);
// path.lineTo(x2, y2);
// path.closePath();
// }
// }
// });
export default class EAxle111 extends Group {
constructor(model) { constructor(model) {
super(); super();
this.model = model; this.model = model;
this.zlevel = model.zlevel; this.zlevel = model.zlevel;
this._subType = model._subType;
this.style = model.style;
this.z = model.z; this.z = model.z;
this.create(model); this.create();
} }
create(model) { create() {
const axleLength = 2 * model.shape.style.Section.axle.radius; const model = this.model.modelData;
let positionx = model.shape.point.x - model.shape.dricty * (model.shape.traingle.getSin(axleLength) * 1.2); if (model.leftAxlePosition) {
let positiony = model.shape.point.y + model.shape.dricty * (model.shape.traingle.getCos(axleLength) * 1.2); this.createAxleLeft();
if (model.shape.difference === 0) { } else if (model.rightAxlePosition) {
positionx += model.shape.drictx * 1; this.createAxleRight();
} else if (model.shape.difference > 0) { }
positionx -= model.shape.drictx * model.shape.traingle.getSin(1); }
positiony -= model.shape.drictx * model.shape.traingle.getCos(1);
createAxleLeft() {
const model = this.model.modelData;
const traingle = new JTriangle(model.points[0], model.points[1]);
const drictx = 1;
const dricty = model.leftAxlePosition === 1 || model.leftAxlePosition === 2 ? 1 : -1;
const isSpecial = model.leftAxlePosition === -2 || model.leftAxlePosition === 2;
const difference = model.points[0].y - model.points[1].y;
let point = {};
point = {x:model.points[0].x, y: model.points[0].y};
if (model.leftAxleOffset) {
point.x = point.x + model.leftAxleOffset.x || 0;
point.y = point.y + model.leftAxleOffset.y || 0;
}
this.createAxle({
traingle: traingle,
drictx: drictx,
dricty: dricty,
isSpecial: isSpecial,
point: point,
difference: difference
});
}
createAxleRight() {
const model = this.model.modelData;
const length = model.points.length;
const traingle = new JTriangle(model.points[length - 2], model.points[length - 1]);
const drictx = -1;
const dricty = model.rightAxlePosition === 1 || model.rightAxlePosition === 2 ? 1 : -1;
const isSpecial = model.rightAxlePosition === -2 || model.rightAxlePosition === 2;
const difference = model.points[length - 2].y - model.points[length - 1].y;
let point = {};
point = {x:model.points[length - 1].x, y: model.points[length - 1].y};
if (model.rightAxleOffset) {
point.x = point.x + model.rightAxleOffset.x || 0;
point.y = point.y + model.rightAxleOffset.y || 0;
}
this.createAxle({
traingle: traingle,
drictx: drictx,
dricty: dricty,
isSpecial: isSpecial,
point: point,
difference: difference
});
}
createAxle(modelData) {
const style = this.model.style;
const axleLength = 2 * style.Section.axle.radius;
let positionx = modelData.point.x - modelData.dricty * (modelData.traingle.getSin(axleLength) * 1.2);
let positiony = modelData.point.y + modelData.dricty * (modelData.traingle.getCos(axleLength) * 1.2);
if (modelData.difference === 0) {
positionx += modelData.drictx * 1;
} else if (modelData.difference > 0) {
positionx -= modelData.drictx * modelData.traingle.getSin(1);
positiony -= modelData.drictx * modelData.traingle.getCos(1);
} else { } else {
positionx += model.shape.drictx * model.shape.traingle.getSin(1); positionx += modelData.drictx * modelData.traingle.getSin(1);
positiony += model.shape.drictx * model.shape.traingle.getCos(1); positiony += modelData.drictx * modelData.traingle.getCos(1);
} }
const x1 = positionx; const x1 = positionx;
const y1 = positiony; const y1 = positiony;
const x2 = positionx + model.shape.drictx * 9 / 2 * model.shape.style.Section.axle.radius; const x2 = positionx + modelData.drictx * 9 / 2 * style.Section.axle.radius;
const y2 = positiony; const y2 = positiony;
const arcX = positionx + model.shape.drictx * 2 * model.shape.style.Section.axle.radius; const arcX = positionx + modelData.drictx * 2 * style.Section.axle.radius;
const arcY = positiony; const arcY = positiony;
const angle = -model.shape.traingle.getRotation(); const angle = -modelData.traingle.getRotation();
this.line = new Line({ this.add(new Line({
zlevel: this.zlevel, zlevel: this.zlevel,
z: this.z, z: this.z,
origin: [positionx, positiony], origin: [positionx, positiony],
@ -75,58 +105,54 @@ export default class EAxle111 extends Group {
y2:y2 y2:y2
}, },
style: { style: {
lineWidth: this.style.lineWidth, lineWidth: style.Section.axle.lineWidth,
fill: this.style.fill, fill: style.Section.axle.fill,
stroke: this.style.stroke stroke: style.Section.axle.stroke
} }
}); }));
this.add(this.line); // this.add(this.line);
if (model.shape.isSpecial) { if (modelData.isSpecial) {
const brokenLineX1 = positionx + model.shape.drictx * model.shape.style.Section.axle.radius; const brokenLineX1 = positionx + modelData.drictx * style.Section.axle.radius;
const brokenLineY1 = positiony - model.shape.style.Section.axle.radius * 2 / 3; const brokenLineY1 = positiony - style.Section.axle.radius * 2 / 3;
const brokenLineY2 = positiony + model.shape.style.Section.axle.radius * 2 / 3; const brokenLineY2 = positiony + style.Section.axle.radius * 2 / 3;
const brokenLineX2 = positionx + model.shape.drictx * model.shape.style.Section.axle.radius * 4; const brokenLineX2 = positionx + modelData.drictx * style.Section.axle.radius * 4;
const brokenLineY3 = positiony - model.shape.style.Section.axle.radius * 2 / 3; const brokenLineY3 = positiony - style.Section.axle.radius * 2 / 3;
const brokenLineY4 = positiony + model.shape.style.Section.axle.radius * 2 / 3; const brokenLineY4 = positiony + style.Section.axle.radius * 2 / 3;
const brokenLineX3 = positionx + model.shape.drictx * model.shape.style.Section.axle.radius * 4 / 3; const brokenLineX3 = positionx + modelData.drictx * style.Section.axle.radius * 4 / 3;
const brokenLineX4 = positionx + model.shape.drictx * model.shape.style.Section.axle.radius * 11 / 3; const brokenLineX4 = positionx + modelData.drictx * style.Section.axle.radius * 11 / 3;
const brokenLineY5 = positiony - model.shape.style.Section.axle.radius; const brokenLineY5 = positiony - style.Section.axle.radius;
const brokenLineY6 = positiony + model.shape.style.Section.axle.radius; const brokenLineY6 = positiony + style.Section.axle.radius;
this.isogonOutside = new Isogon({ this.add(new Isogon({
zlevel: this.model.zlevel, zlevel: this.zlevel,
z: this.model.z, z: this.z,
origin: [positionx, positiony], origin: [positionx, positiony],
rotation:angle, rotation:angle,
// origin: [arcX, arcY],
// rotation:Math.PI / 8,
shape: { shape: {
x: arcX, x: arcX,
y: arcY, y: arcY,
r: model.shape.style.Section.axle.radius, r: style.Section.axle.radius,
n: 8 n: 8
}, },
style: { style: {
fill: this.style.fill fill: style.Section.axle.fill
} }
}); }));
this.isogonInside = new Isogon({ this.add(new Isogon({
zlevel: this.model.zlevel, zlevel: this.zlevel,
z: this.model.z + 1, z: this.z + 1,
origin: [positionx, positiony], origin: [positionx, positiony],
rotation:angle, rotation:angle,
// origin: [arcX, arcY],
// rotation:Math.PI / 4,
shape: { shape: {
x: arcX, x: arcX,
y: arcY, y: arcY,
r: model.shape.style.Section.axle.radius / 2, r: style.Section.axle.radius / 2,
n: 4 n: 4
}, },
style: { style: {
fill: '#000' fill: '#000'
} }
}); }));
this.line1 = new Line({ this.add(new Line({
zlevel: this.zlevel, zlevel: this.zlevel,
z: this.z, z: this.z,
origin: [positionx, positiony], origin: [positionx, positiony],
@ -139,11 +165,11 @@ export default class EAxle111 extends Group {
}, },
style: { style: {
lineWidth: 1, lineWidth: 1,
fill: this.style.fill, fill: style.Section.axle.fill,
stroke: this.style.stroke stroke: style.Section.axle.stroke
} }
}); }));
this.line2 = new Line({ this.add(new Line({
zlevel: this.zlevel, zlevel: this.zlevel,
z: this.z, z: this.z,
origin: [positionx, positiony], origin: [positionx, positiony],
@ -156,11 +182,11 @@ export default class EAxle111 extends Group {
}, },
style: { style: {
lineWidth: 1, lineWidth: 1,
fill: this.style.fill, fill: style.Section.axle.fill,
stroke: this.style.stroke stroke: style.Section.axle.stroke
} }
}); }));
this.line3 = new Line({ this.add(new Line({
zlevel: this.zlevel, zlevel: this.zlevel,
z: this.z, z: this.z,
origin: [positionx, positiony], origin: [positionx, positiony],
@ -173,11 +199,11 @@ export default class EAxle111 extends Group {
}, },
style: { style: {
lineWidth: 1, lineWidth: 1,
fill: this.style.fill, fill: style.Section.axle.fill,
stroke: this.style.stroke stroke: style.Section.axle.stroke
} }
}); }));
this.line4 = new Line({ this.add(new Line({
zlevel: this.zlevel, zlevel: this.zlevel,
z: this.z, z: this.z,
origin: [positionx, positiony], origin: [positionx, positiony],
@ -190,11 +216,11 @@ export default class EAxle111 extends Group {
}, },
style: { style: {
lineWidth: 1, lineWidth: 1,
fill: this.style.fill, fill: style.Section.axle.fill,
stroke: this.style.stroke stroke: style.Section.axle.stroke
} }
}); }));
this.line5 = new Line({ this.add(new Line({
zlevel: this.zlevel, zlevel: this.zlevel,
z: this.z, z: this.z,
origin: [positionx, positiony], origin: [positionx, positiony],
@ -207,11 +233,11 @@ export default class EAxle111 extends Group {
}, },
style: { style: {
lineWidth: 1, lineWidth: 1,
fill: this.style.fill, fill: style.Section.axle.fill,
stroke: this.style.stroke stroke: style.Section.axle.stroke
} }
}); }));
this.line6 = new Line({ this.add(new Line({
zlevel: this.zlevel, zlevel: this.zlevel,
z: this.z, z: this.z,
origin: [positionx, positiony], origin: [positionx, positiony],
@ -224,49 +250,68 @@ export default class EAxle111 extends Group {
}, },
style: { style: {
lineWidth: 1, lineWidth: 1,
fill: this.style.fill, fill: style.Section.axle.fill,
stroke: this.style.stroke stroke: style.Section.axle.stroke
} }
}); }));
this.add(this.isogonInside); // this.add(this.isogonInside);
this.add(this.isogonOutside); // this.add(this.isogonOutside);
this.add(this.line1); // this.add(this.line1);
this.add(this.line2); // this.add(this.line2);
this.add(this.line3); // this.add(this.line3);
this.add(this.line4); // this.add(this.line4);
this.add(this.line5); // this.add(this.line5);
this.add(this.line6); // this.add(this.line6);
} else { } else {
this.circle = new Circle({ this.add(new Circle({
zlevel: this.model.zlevel, zlevel: this.zlevel,
z: this.model.z, z: this.z,
origin: [positionx, positiony], origin: [positionx, positiony],
rotation:angle, rotation:angle,
shape: { shape: {
cx: arcX, cx: arcX,
cy: arcY, cy: arcY,
r: model.shape.style.Section.axle.radius r: style.Section.axle.radius
}, },
style: { style: {
fill: this.style.fill fill: style.Section.axle.fill
} }
}); }));
this.add(this.circle); // this.add(this.circle);
} }
} }
setStyle(styles) { setStyle(styles) {
if (this.model.shape.isSpecial) { // if (this.isSpecial) {
this.isogonOutside.setStyle(styles); // this.eachChild((child) => {
this.line1.setStyle(styles); // if (child.setStyle) {
this.line2.setStyle(styles); // child.setStyle(styles);
this.line3.setStyle(styles); // }
this.line4.setStyle(styles); // });
this.line5.setStyle(styles); // this.isogonOutside && this.isogonOutside.setStyle(styles);
this.line6.setStyle(styles); // this.isogonInside && this.isogonInside.setStyle(styles);
} else { // this.line1 && this.line1.setStyle(styles);
this.circle.setStyle(styles); // this.line2 && this.line2.setStyle(styles);
} // this.line3 && this.line3.setStyle(styles);
this.line.setStyle(styles); // this.line4 && this.line4.setStyle(styles);
// this.line5 && this.line5.setStyle(styles);
// this.line6 && this.line6.setStyle(styles);
// } else {
// this.circle && this.circle.setStyle(styles);
// }
// this.line && this.line.setStyle(styles);
this.eachChild((child) => {
if (child && child.setStyle) {
child.setStyle(styles);
}
});
}
recover() {
}
setState() {
} }
} }

View File

@ -1,7 +1,91 @@
import Group from 'zrender/src/container/Group';
import Path from 'zrender/src/graphic/Path'; import Path from 'zrender/src/graphic/Path';
export default class EBackArrowGroup extends Group {
constructor(model) {
super();
this.model = model;
this.zlevel = model.zlevel;
this.z = model.z;
this.create();
}
create() {
const model = this.model.modelData;
const style = this.model.style;
if (model.reentryTrack && style.Section.shuttleBack) {
const radius = 3;
model.drict = 1; // 箭头朝向 (是折返轨加一个方向选择) 目前在区段右边
const width = style.Section.line.width * 2;
const height = style.Section.line.width * 1;
const turnBackDistance = style.Section.shuttleBack.distance + radius * 4;
const points = model.points;
let x = -model.drict * width * 1.2;
let y = -turnBackDistance;
if (model.drict < 0) {
x += points[0].x;
y += points[0].y;
} else {
x += points[points.length - 1].x;
y += points[points.length - 1].y;
}
this.turnBack = new EBackArrow({
zlevel: this.zlevel,
z: this.z,
shape: {
drict: model.drict,
width: width,
height: height,
points: {
x: x,
y: y
}
},
style: {
lineWidth: style.Section.shuttleBack.width,
stroke: style.Section.shuttleBack.color,
fill: 'rgba(0, 0, 0, 0)'
}
});
this.turnBackriangle = new EBackArrowTriangle({
zlevel: this.zlevel,
z: this.z,
shape: {
drict: model.drict,
width: width,
height: height,
points: {
x: x,
y: y
}
},
style: {
lineWidth: style.Section.shuttleBack.width,
stroke: style.Section.shuttleBack.color,
fill: style.Section.shuttleBack.color
}
});
this.add(this.turnBack);
this.add(this.turnBackriangle);
this.turnBack.hide();
this.turnBackriangle.hide();
}
}
hide() {
this.turnBack.hide();
this.turnBackriangle.hide();
}
show() {
this.turnBack.show();
this.turnBackriangle.show();
}
}
// 成都三号线 折返进路 // 成都三号线 折返进路
export const EBackArrow = Path.extend({ const EBackArrow = Path.extend({
type: 'EBackArrow', type: 'EBackArrow',
shape: { shape: {
points: null points: null
@ -24,7 +108,7 @@ export const EBackArrow = Path.extend({
}); });
// 箭头 // 箭头
export const EBackArrowTriangle = Path.extend({ const EBackArrowTriangle = Path.extend({
type: 'EBackArrowTriangle', type: 'EBackArrowTriangle',
shape: { shape: {
points: null points: null

View File

@ -3,78 +3,6 @@ import BezierCurve from 'zrender/src/graphic/shape/BezierCurve';
import Line from 'zrender/src/graphic/shape/Line'; import Line from 'zrender/src/graphic/shape/Line';
import JTriangle from '../../utils/JTriangle'; import JTriangle from '../../utils/JTriangle';
import Vue from 'vue'; import Vue from 'vue';
// import Path from 'zrender/src/graphic/Path';
// 创建区段限速限集合
// export default const ELimitLines = Path.extend({
// type: 'ELimitLines',
// shape: {
// points: null
// },
// buildPath: function (ctx, model) {
// /** 创建区段*/
// if (model && model.points.length > 1) {
// if (model.isCurve) {
// ctx.beginPath();
// const shape = {};
// for (let i = 1; i < (model.points.length - 1); i++) {
// shape[`cpx${i}`] = model.points[i].x;
// shape[`cpy${i}`] = model.points[i].y;
// }
// shape[`x1`] = model.points[0].x;
// shape[`y1`] = model.points[0].y;
// shape[`x2`] = model.points[model.points.length - 1].x;
// shape[`y2`] = model.points[model.points.length - 1].y;
// ctx.moveTo(shape[`x1`], shape[`y1`]);
// if (model.points.length <= 3) {
// ctx.quadraticCurveTo(shape[`cpx1`], shape[`cpy1`], shape[`x2`], shape[`y2`]);
// } else {
// ctx.bezierCurveTo(shape[`cpx1`], shape[`cpy1`], shape[`cpx2`], shape[`cpy2`], shape[`x2`], shape[`y2`]);
// }
// } else {
// const swPadding = model.style.Switch.core.length; // 定位和反位时区段距离岔芯的距离
// var switchWidth = model.style.Section.line.width + model.style.Section.line.beyondWidth; // 道岔宽度
// const beg = Object.assign({}, model.points[0]);
// const end = Object.assign({}, model.points[model.points.length - 1]);
// if (model.isSwitchSection && beg.y !== end.y) {
// const swch = model.switch;
// if (swch) {
// const traingle = new JTriangle(swch.intersection, swch.skew);
// if ((swch.intersection.x === beg.x) && (swch.intersection.y === beg.y)) {
// beg.x = beg.x + traingle.drictx * (swPadding + switchWidth) * traingle.getCotRate();
// beg.y = beg.y + traingle.dricty * (swPadding + switchWidth);
// }
// if ((swch.intersection.x === end.x) && (swch.intersection.y === end.y)) {
// end.x = end.x + traingle.drictx * (swPadding + switchWidth) * traingle.getCotRate();
// end.y = end.y + traingle.dricty * (swPadding + switchWidth);
// }
// }
// }
// if (model.points.length == 2) {
// ctx.moveTo(beg.x, beg.y);
// ctx.lineTo(end.x, end.y);
// ctx.closePath();
// } else {
// ctx.moveTo(beg.x, beg.y);
// ctx.lineTo(model.points[1].x, model.points[1].y);
// ctx.closePath();
// for (let i = 1; i < (model.points.length - 2); i++) {
// ctx.moveTo(model.points[i].x, model.points[i].y);
// ctx.lineTo(model.points[i + 1].x, model.points[i + 1].y);
// ctx.closePath();
// }
// ctx.moveTo(model.points[model.points.length - 2].x, model.points[model.points.length - 2].y);
// ctx.lineTo(end.x, end.y);
// ctx.closePath();
// }
// }
// }
// }
// });
export default class ELimitLines extends Group { export default class ELimitLines extends Group {
constructor(model) { constructor(model) {
@ -82,136 +10,185 @@ export default class ELimitLines extends Group {
this.model = model; this.model = model;
this.zlevel = model.zlevel; this.zlevel = model.zlevel;
this.z = model.z; this.z = model.z;
this.create(model); this.create();
} }
create(model) { create() {
const model = this.model.modelData;
const style = this.model.style;
/** 创建区段*/ /** 创建区段*/
if (model && model.points.length > 1) { if (model && model.points.length > 1) {
if (model.isCurve) { const traingle = new JTriangle(model.points[0], model.points[model.points.length - 1]);
const shape = {}; let x = traingle.drictx * (style.Section.speedLimit.distance) * traingle.getSinRate();
for (let i = 1; i < (model.points.length - 1); i++) { let y = traingle.dricty * (style.Section.speedLimit.distance) * traingle.getCosRate();
shape[`cpx${i}`] = model.points[i].x; if (x == Infinity) { x = 0; }
shape[`cpy${i}`] = model.points[i].y; if (y == Infinity) { y = 0; }
// 上侧临时限速线
const speedLimitLeft = this.createLimit({
position: [x, -y],
switch: model.switch,
code: model.code,
isSwitchSection: model.switchSection,
relSwitchCode: model.relSwitchCode,
isCurve: model.curve, // 是否曲线
points: model.points
});
// 下侧临时限速线
const speedLimitRight = this.createLimit({
position: [-x, y],
switch: model.switch,
code: model.code,
isSwitchSection: model.switchSection,
relSwitchCode: model.relSwitchCode,
isCurve: model.curve, // 是否曲线
points: model.points
});
speedLimitLeft.forEach(item => {
this.add(item);
});
speedLimitRight.forEach(item => {
this.add(item);
});
}
}
createLimit(model) {
const style = this.model.style;
const dataList = [];
if (model.isCurve) {
const shape = {};
for (let i = 1; i < (model.points.length - 1); i++) {
shape[`cpx${i}`] = model.points[i].x;
shape[`cpy${i}`] = model.points[i].y;
}
shape[`x1`] = model.points[0].x;
shape[`y1`] = model.points[0].y;
shape[`x2`] = model.points[model.points.length - 1].x;
shape[`y2`] = model.points[model.points.length - 1].y;
dataList.push(new BezierCurve({
isLine: true,
zlevel: this.zlevel,
progressive: model.progressive,
z: this.z,
culling: true,
shape: shape,
position: model.position,
style: {
lineWidth: style.Section.speedLimit.width,
stroke: style.Section.speedLimit.lineColor,
fillOpacity: 0
} }
}));
} else {
const swPadding = style.Switch.core.length; // 定位和反位时区段距离岔芯的距离
var switchWidth = style.Section.line.width + style.Section.line.beyondWidth; // 道岔宽度
const beg = Object.assign({}, model.points[0]);
const end = Object.assign({}, model.points[model.points.length - 1]);
if (model.isSwitchSection && beg.y !== end.y) {
const swch = Vue.prototype.$jlmap.mapDevice[model.switch.code]; // 获取道岔model 及状态数据
shape[`x1`] = model.points[0].x; if (swch && swch.instance) {
shape[`y1`] = model.points[0].y; const traingle = new JTriangle(swch.intersection, swch.skew);
shape[`x2`] = model.points[model.points.length - 1].x; if ((swch.intersection.x === beg.x) && (swch.intersection.y === beg.y) && !swch.normalPosition && swch.sectionCCode == model.code) {
shape[`y2`] = model.points[model.points.length - 1].y; beg.x = beg.x + traingle.drictx * (swPadding + switchWidth) * traingle.getCotRate();
beg.y = beg.y + traingle.dricty * (swPadding + switchWidth);
}
this.add(new BezierCurve({ if ((swch.intersection.x === end.x) && (swch.intersection.y === end.y) && swch.normalPosition && swch.sectionCCode == model.code) {
end.x = end.x + traingle.drictx * (swPadding + switchWidth) * traingle.getCotRate();
end.y = end.y + traingle.dricty * (swPadding + switchWidth);
}
}
}
if (model.points.length == 2) {
dataList.push(new Line({
isLine: true, isLine: true,
zlevel: this.zlevel, zlevel: this.zlevel,
progressive: model.progressive, progressive: model.progressive,
z: this.z, z: this.z,
culling: true,
shape: shape,
position: model.position, position: model.position,
shape: {
x1: beg.x,
y1: beg.y,
x2: end.x,
y2: end.y
},
style: { style: {
lineWidth: model.style.Section.speedLimit.width, lineWidth: style.Section.speedLimit.width,
stroke: model.style.Section.speedLimit.lineColor, stroke: style.Section.speedLimit.lineColor
fillOpacity: 0
} }
})); }));
} else { } else {
const swPadding = model.style.Switch.core.length; // 定位和反位时区段距离岔芯的距离 dataList.push(new Line({
var switchWidth = model.style.Section.line.width + model.style.Section.line.beyondWidth; // 道岔宽度 isLine: true,
const beg = Object.assign({}, model.points[0]); zlevel: this.zlevel,
const end = Object.assign({}, model.points[model.points.length - 1]); progressive: model.progressive,
if (model.isSwitchSection && beg.y !== end.y) { z: this.z,
const swch = Vue.prototype.$jlmap.mapDevice[model.switch.code]; // 获取道岔model 及状态数据 position: model.position,
shape: {
if (swch && swch.instance) { x1: beg.x,
const traingle = new JTriangle(swch.intersection, swch.skew); y1: beg.y,
if ((swch.intersection.x === beg.x) && (swch.intersection.y === beg.y) && !swch.normalPosition && swch.sectionCCode == model.code) { x2: model.points[1].x,
beg.x = beg.x + traingle.drictx * (swPadding + switchWidth) * traingle.getCotRate(); y2: model.points[1].y
beg.y = beg.y + traingle.dricty * (swPadding + switchWidth); },
} style: {
lineWidth: style.Section.speedLimit.width,
if ((swch.intersection.x === end.x) && (swch.intersection.y === end.y) && swch.normalPosition && swch.sectionCCode == model.code) { stroke: style.Section.speedLimit.lineColor
end.x = end.x + traingle.drictx * (swPadding + switchWidth) * traingle.getCotRate();
end.y = end.y + traingle.dricty * (swPadding + switchWidth);
}
} }
} }));
if (model.points.length == 2) { for (let i = 1; i < (model.points.length - 2); i++) {
this.add(new Line({ dataList.push(new Line({
isLine: true,
zlevel: this.zlevel,
progressive: model.progressive,
z: this.z,
position: model.position,
shape: {
x1: beg.x,
y1: beg.y,
x2: end.x,
y2: end.y
},
style: {
lineWidth: model.style.Section.speedLimit.width,
stroke: model.style.Section.speedLimit.lineColor
}
}));
} else {
this.add(new Line({
isLine: true,
zlevel: this.zlevel,
progressive: model.progressive,
z: this.z,
position: model.position,
shape: {
x1: beg.x,
y1: beg.y,
x2: model.points[1].x,
y2: model.points[1].y
},
style: {
lineWidth: model.style.Section.speedLimit.width,
stroke: model.style.Section.speedLimit.lineColor
}
}));
for (let i = 1; i < (model.points.length - 2); i++) {
this.add(new Line({
isLine: true,
zlevel: this.zlevel,
z: this.z,
progressive: model.progressive,
position: model.position,
shape: {
x1: model.points[i].x,
y1: model.points[i].y,
x2: model.points[i + 1].x,
y2: model.points[i + 1].y
},
style: {
lineWidth: model.style.Section.speedLimit.width,
stroke: model.style.Section.speedLimit.lineColor
}
}));
}
this.add(new Line({
isLine: true, isLine: true,
zlevel: this.zlevel, zlevel: this.zlevel,
z: this.z, z: this.z,
position: model.position,
progressive: model.progressive, progressive: model.progressive,
position: model.position,
shape: { shape: {
x1: model.points[model.points.length - 2].x, x1: model.points[i].x,
y1: model.points[model.points.length - 2].y, y1: model.points[i].y,
x2: end.x, x2: model.points[i + 1].x,
y2: end.y y2: model.points[i + 1].y
}, },
style: { style: {
lineWidth: model.style.Section.speedLimit.width, lineWidth: style.Section.speedLimit.width,
stroke: model.style.Section.speedLimit.lineColor stroke: style.Section.speedLimit.lineColor
} }
})); }));
} }
dataList.push(new Line({
isLine: true,
zlevel: this.zlevel,
z: this.z,
position: model.position,
progressive: model.progressive,
shape: {
x1: model.points[model.points.length - 2].x,
y1: model.points[model.points.length - 2].y,
x2: end.x,
y2: end.y
},
style: {
lineWidth: style.Section.speedLimit.width,
stroke: style.Section.speedLimit.lineColor
}
}));
} }
} }
return dataList;
}
hide() {
this.eachChild((child) => {
child.hide();
});
}
show() {
this.eachChild((child) => {
child.show();
});
} }
} }

View File

@ -1,91 +1,110 @@
// import Path from 'zrender/src/graphic/Path';
// 成都三号线 临时限速名称显示
// export const ELimitName = Path.extend({
// type: 'ELimitName',
// shape: {
// points: null
// },
// buildPath: function (ctx, shape) {
// const points = shape.points;
// const y = points.y - 15;
// ctx.moveTo(points.x, y);
// ctx.lineTo(points.x - shape.drict * shape.style.Section.speedLimit.drogueWidth, y);
// ctx.lineTo(points.x - shape.drict * (shape.style.Section.speedLimit.drogueWidth + 5), y - 5);
// ctx.lineTo(points.x - shape.drict * shape.style.Section.speedLimit.drogueWidth, y - 10);
// ctx.lineTo(points.x, y - 10);
// ctx.lineTo(points.x, y);
// }
// });
import Group from 'zrender/src/container/Group'; import Group from 'zrender/src/container/Group';
import Text from 'zrender/src/graphic/Text'; import Text from 'zrender/src/graphic/Text';
import Polygon from 'zrender/src/graphic/shape/Polygon'; import Polygon from 'zrender/src/graphic/shape/Polygon';
export default class ELimitName extends Group { export default class ELimitName extends Group {
constructor(model) { constructor(model) {
super(); super();
this.model = model; this.model = model;
this.zlevel = model.zlevel; this.zlevel = model.zlevel;
this.z = model.z; this.z = model.z;
this.create(model); this.create();
} }
create(model) { create() {
const rectW = model.style.Section.speedLimit.drogueWidth; /** 创建区段*/
const rectH = model.style.Section.speedLimit.drogueHeight; const model = this.model.modelData;
this.add(new Polygon({ // 开头 起点位置
zlevel: this.zlevel, const speedLimitNameLeft = this.createName({
z: this.z + 9, drict: -1,
shape: { x: model.points[0].x,
points: [ y: model.points[0].y - 15
[model.x, model.y], });
[model.x - model.drict * rectW, model.y], // 终点位置
[model.x - model.drict * (rectW + rectH / 2), model.y - rectH / 2], const speedLimitNameRight = this.createName({
[model.x - model.drict * rectW, model.y - rectH], drict: 1,
[model.x, model.y - rectH] x: model.points[model.points.length - 1].x,
] y: model.points[model.points.length - 1].y - 15
}, });
style: { speedLimitNameLeft.forEach(item => {
lineWidth: 0, this.add(item);
fill: model.style.Section.speedLimit.nameBackground });
} speedLimitNameRight.forEach(item => {
})); this.add(item);
});
}
// 公里标内容 createName(model) {
this.add(new Text({ const dataList = [];
zlevel: this.zlevel, const style = this.model.style;
z: this.z + 10,
style: {
x: model.x - model.drict * 2,
y: model.y,
fontWeight: 'normal',
fontSize: model.style.Section.speedLimit.nameNumberFontSize,
fontFamily: model.style.fontFamily,
text: '15',
textFill: model.style.Section.speedLimit.nameNumberColor,
textAlign: model.drict == -1 ? 'left' : 'right',
textPosition: model.style.Section.text.textPosition || 'inside',
textVerticalAlign: 'bottom'
}
}));
// 公里值 const rectW = style.Section.speedLimitName.drogueWidth;
this.add(new Text({ const rectH = style.Section.speedLimitName.drogueHeight;
zlevel: this.zlevel,
z: this.z + 10, dataList.push(new Polygon({
style: { zlevel: this.zlevel,
x: model.x, z: this.z + 9,
y: model.y + 12, shape: {
fontWeight: 'normal', points: [
fontSize: model.style.Section.speedLimit.kilometerFontSize, [model.x, model.y],
fontFamily: model.style.fontFamily, [model.x - model.drict * rectW, model.y],
text: '17.981km', [model.x - model.drict * (rectW + rectH / 2), model.y - rectH / 2],
textFill: model.style.Section.speedLimit.kilometerColor, [model.x - model.drict * rectW, model.y - rectH],
textAlign: model.drict == -1 ? 'left' : 'right', [model.x, model.y - rectH]
textPosition: model.style.Section.text.textPosition || 'inside', ]
textVerticalAlign: 'bottom' },
} style: {
})); lineWidth: 0,
} fill: style.Section.speedLimitName.nameBackground
}
}));
// 公里标内容
dataList.push(new Text({
zlevel: this.zlevel,
z: this.z + 10,
style: {
x: model.x - model.drict * 2,
y: model.y,
fontWeight: 'normal',
fontSize: style.Section.speedLimitName.nameNumberFontSize,
fontFamily: style.fontFamily,
text: '15',
textFill: style.Section.speedLimitName.nameNumberColor,
textAlign: model.drict == -1 ? 'left' : 'right',
textPosition: style.Section.name.textPosition || 'inside',
textVerticalAlign: 'bottom'
}
}));
// 公里值
dataList.push(new Text({
zlevel: this.zlevel,
z: this.z + 10,
style: {
x: model.x,
y: model.y + 12,
fontWeight: 'normal',
fontSize: style.Section.speedLimitName.kilometerFontSize,
fontFamily: style.fontFamily,
text: '17.981km',
textFill: style.Section.speedLimitName.kilometerColor,
textAlign: model.drict == -1 ? 'left' : 'right',
textPosition: style.Section.name.textPosition || 'inside',
textVerticalAlign: 'bottom'
}
}));
return dataList;
}
hide() {
this.eachChild((child) => {
child.hide();
});
}
show() {
this.eachChild((child) => {
child.show();
});
}
} }

View File

@ -12,29 +12,44 @@ export default class ELines extends Group {
this.zlevel = model.zlevel; this.zlevel = model.zlevel;
this.z = model.z; this.z = model.z;
this.sections = []; this.sections = [];
this.create(model); this.create();
} }
create(model) { create() {
const model = this.model.modelData;
// 创建区段 model.logicSectionCodeList 为空 或 0 表明没有逻辑区段 创建 否则过滤
if ((model.type == '01' && (!model.logicSectionCodeList || !model.logicSectionCodeList.length)) || model.type == '02' || model.type == '03') {
this.createLine();
}
}
createLine() {
const model = this.model.modelData;
const style = this.model.style;
const Z = model.type == '02' ? this.z + 1 : this.z;
const modelPoints = model.type == '04' ? [model.namePosition, model.namePosition] : model.points;
const isCurve = model.curve;
/** 创建区段*/ /** 创建区段*/
if (model && model.points.length > 1) { if (model && modelPoints.length > 1) {
let stroke; let stroke;
stroke = model.style.Section.line.spareColor; stroke = style.Section.line.spareColor;
if (model.style.Section.line.isActiveShow) { if (this.model.type == 'lineBorder') {
stroke = '#2EBFBF'; stroke = style.Section.lineBorder.activeStroke;
} }
if (model.isCurve) { if (isCurve) {
const shape = {}; const shape = {};
for (let i = 1; i < (model.points.length - 1); i++) { for (let i = 1; i < (modelPoints.length - 1); i++) {
shape[`cpx${i}`] = model.points[i].x; shape[`cpx${i}`] = modelPoints[i].x;
shape[`cpy${i}`] = model.points[i].y; shape[`cpy${i}`] = modelPoints[i].y;
} }
shape[`x1`] = model.points[0].x; shape[`x1`] = modelPoints[0].x;
shape[`y1`] = model.points[0].y; shape[`y1`] = modelPoints[0].y;
shape[`x2`] = model.points[model.points.length - 1].x; shape[`x2`] = modelPoints[modelPoints.length - 1].x;
shape[`y2`] = model.points[model.points.length - 1].y; shape[`y2`] = modelPoints[modelPoints.length - 1].y;
this.section = new BezierCurve({ this.section = new BezierCurve({
isLine: true, isLine: true,
zlevel: this.zlevel, zlevel: this.zlevel,
@ -44,157 +59,157 @@ export default class ELines extends Group {
culling: false, culling: false,
shape: shape, shape: shape,
style: { style: {
lineWidth: model.style.Section.line.width, lineWidth: style.Section.line.width,
stroke: stroke stroke: stroke
} }
}); });
this.add(this.section); this.add(this.section);
} else { } else {
const points = []; const points = [];
for (let i = 0; i < model.points.length; i++) { for (let i = 0; i < modelPoints.length; i++) {
points.push([model.points[i].x, model.points[i].y]); points.push([modelPoints[i].x, modelPoints[i].y]);
} }
this.section = new Polyline({ this.section = new Polyline({
isLine: true, isLine: true,
zlevel: this.zlevel, zlevel: this.zlevel,
progressive: model.progressive, progressive: model.progressive,
z: this.z, z: Z,
shape: { shape: {
points: points points: points
}, },
style: { style: {
lineWidth: model.style.Section.line.width, lineWidth: style.Section.line.width,
stroke: stroke stroke: stroke
} }
}); });
this.add(this.section); this.add(this.section);
} }
if (model.style.Section.topWithLine && !model.isCurve) { if (style.Section.topWithLine && !isCurve) {
const topPoints = []; const topPoints = [];
for (let i = 0; i < model.points.length; i++) { for (let i = 0; i < modelPoints.length; i++) {
topPoints.push([model.points[i].x, model.points[i].y - model.style.Section.line.width / 2 - model.style.Section.topWithLine.width / 2]); topPoints.push([modelPoints[i].x, modelPoints[i].y - style.Section.line.width / 2 - style.Section.topWithLine.width / 2]);
} }
this.topWithSection = new Polyline({ this.topWithSection = new Polyline({
isLine: true, isLine: true,
zlevel: this.zlevel, zlevel: this.zlevel,
progressive: model.progressive, progressive: model.progressive,
z: this.z, z: Z,
shape: { shape: {
points: topPoints points: topPoints
}, },
style: { style: {
lineWidth: model.style.Section.topWithLine.width, lineWidth: style.Section.topWithLine.width,
stroke: model.style.Section.topWithLine.defaultColor stroke: style.Section.topWithLine.defaultColor
} }
}); });
this.add(this.topWithSection); this.add(this.topWithSection);
this.topWithSection.hide(); this.topWithSection.hide();
} }
if (model.style.Section.bottomWithLine && !model.isCurve) { if (style.Section.bottomWithLine && !isCurve) {
const bottomPoints = []; const bottomPoints = [];
for (let i = 0; i < model.points.length; i++) { for (let i = 0; i < modelPoints.length; i++) {
bottomPoints.push([model.points[i].x, model.points[i].y + model.style.Section.line.width / 2 + model.style.Section.bottomWithLine.width / 2]); bottomPoints.push([modelPoints[i].x, modelPoints[i].y + style.Section.line.width / 2 + style.Section.bottomWithLine.width / 2]);
} }
this.bottomWithSection = new Polyline({ this.bottomWithSection = new Polyline({
isLine: true, isLine: true,
zlevel: this.zlevel, zlevel: this.zlevel,
progressive: model.progressive, progressive: model.progressive,
z: this.z, z: Z,
shape: { shape: {
points: bottomPoints points: bottomPoints
}, },
style: { style: {
lineWidth: model.style.Section.bottomWithLine.width, lineWidth: style.Section.bottomWithLine.width,
stroke: model.style.Section.bottomWithLine.defaultColor stroke: style.Section.bottomWithLine.defaultColor
} }
}); });
this.add(this.bottomWithSection); this.add(this.bottomWithSection);
this.bottomWithSection.hide(); this.bottomWithSection.hide();
} }
if (model.style.Section.routeArrow && !model.isCurve) { if (style.Section.routeArrow && !isCurve) {
const cPointLeft = {x: 0, y:0}; const cPointLeft = {x: 0, y:0};
const cPointRight = {x: 0, y:0}; const cPointRight = {x: 0, y:0};
const pointsLeft = []; const pointsLeft = [];
const pointsRight = []; const pointsRight = [];
const length = this.model.points.length; const length = modelPoints.length;
const triangleLeft = new JTriangle(this.model.points[0], this.model.points[1]); const triangleLeft = new JTriangle(modelPoints[0], modelPoints[1]);
cPointLeft.x = this.model.points[0].x + triangleLeft.getCos(model.style.Section.routeArrow.radius); cPointLeft.x = modelPoints[0].x + triangleLeft.getCos(style.Section.routeArrow.radius);
cPointLeft.y = this.model.points[0].y + triangleLeft.getSin(model.style.Section.routeArrow.radius); cPointLeft.y = modelPoints[0].y + triangleLeft.getSin(style.Section.routeArrow.radius);
for (let i = 0; i < length; i++) { for (let i = 0; i < length; i++) {
if (i === 0) { if (i === 0) {
pointsLeft.push([cPointLeft.x, cPointLeft.y]); pointsLeft.push([cPointLeft.x, cPointLeft.y]);
} else { } else {
pointsLeft.push([model.points[i].x, model.points[i].y]); pointsLeft.push([modelPoints[i].x, modelPoints[i].y]);
} }
} }
const triangleRight = new JTriangle(this.model.points[length - 2], this.model.points[length - 1 ]); const triangleRight = new JTriangle(modelPoints[length - 2], modelPoints[length - 1 ]);
cPointRight.x = this.model.points[length - 1].x - triangleRight.getCos(model.style.Section.routeArrow.radius); cPointRight.x = modelPoints[length - 1].x - triangleRight.getCos(style.Section.routeArrow.radius);
cPointRight.y = this.model.points[length - 1].y - triangleRight.getSin(model.style.Section.routeArrow.radius); cPointRight.y = modelPoints[length - 1].y - triangleRight.getSin(style.Section.routeArrow.radius);
for (let i = 0; i < length; i++) { for (let i = 0; i < length; i++) {
if (i === length - 1) { if (i === length - 1) {
pointsRight.push([cPointRight.x, cPointRight.y]); pointsRight.push([cPointRight.x, cPointRight.y]);
} else { } else {
pointsRight.push([model.points[i].x, model.points[i].y]); pointsRight.push([modelPoints[i].x, modelPoints[i].y]);
} }
} }
this.routeArrowLeft = new Isogon({ this.routeArrowLeft = new Isogon({
zlevel: this.zlevel, zlevel: this.zlevel,
origin: [cPointLeft.x, cPointLeft.y], origin: [cPointLeft.x, cPointLeft.y],
rotation: Math.PI / 2 - triangleLeft.getRotation(), rotation: Math.PI / 2 - triangleLeft.getRotation(),
z: this.z + 9, z: Z + 9,
shape: { shape: {
x: cPointLeft.x, x: cPointLeft.x,
y: cPointLeft.y, y: cPointLeft.y,
r: model.style.Section.routeArrow.radius, r: style.Section.routeArrow.radius,
n: 3 n: 3
}, },
style: { style: {
lineWidth: model.style.Section.routeArrow.arrowLineWidth, lineWidth: style.Section.routeArrow.arrowLineWidth,
stroke: model.style.Section.routeArrow.defaultArrowStroke, stroke: style.Section.routeArrow.defaultArrowStroke,
fill: model.style.Section.routeArrow.defaultArrowFill fill: style.Section.routeArrow.defaultArrowFill
} }
}); });
this.routeArrowRight = new Isogon({ this.routeArrowRight = new Isogon({
zlevel: this.zlevel, zlevel: this.zlevel,
origin: [cPointLeft.x, cPointLeft.y], origin: [cPointLeft.x, cPointLeft.y],
rotation: -Math.PI / 2 - triangleRight.getRotation(), rotation: -Math.PI / 2 - triangleRight.getRotation(),
z: this.z + 9, z: Z + 9,
shape: { shape: {
x: cPointRight.x, x: cPointRight.x,
y: cPointRight.y, y: cPointRight.y,
r: model.style.Section.routeArrow.radius, r: style.Section.routeArrow.radius,
n: 3 n: 3
}, },
style: { style: {
lineWidth: model.style.Section.routeArrow.arrowLineWidth, lineWidth: style.Section.routeArrow.arrowLineWidth,
stroke: model.style.Section.routeArrow.defaultArrowStroke, stroke: style.Section.routeArrow.defaultArrowStroke,
fill: model.style.Section.routeArrow.defaultArrowFill fill: style.Section.routeArrow.defaultArrowFill
} }
}); });
this.routeLineLeft = new Polyline({ this.routeLineLeft = new Polyline({
zlevel: this.zlevel, zlevel: this.zlevel,
progressive: model.progressive, progressive: model.progressive,
z: this.z, z: Z,
shape: { shape: {
points: pointsLeft points: pointsLeft
}, },
style: { style: {
lineWidth: model.style.Section.routeArrow.lineWidth, lineWidth: style.Section.routeArrow.lineWidth,
stroke: model.style.Section.routeArrow.defaultLineStroke stroke: style.Section.routeArrow.defaultLineStroke
} }
}); });
this.routeLineRight = new Polyline({ this.routeLineRight = new Polyline({
zlevel: this.zlevel, zlevel: this.zlevel,
progressive: model.progressive, progressive: model.progressive,
z: this.z, z: Z,
shape: { shape: {
points: pointsRight points: pointsRight
}, },
style: { style: {
lineWidth: model.style.Section.routeArrow.lineWidth, lineWidth: style.Section.routeArrow.lineWidth,
stroke: model.style.Section.routeArrow.defaultLineStroke stroke: style.Section.routeArrow.defaultLineStroke
} }
}); });
this.add(this.routeArrowLeft); this.add(this.routeArrowLeft);
@ -210,21 +225,11 @@ export default class ELines extends Group {
} }
setStyle(styles) { setStyle(styles) {
// this.eachChild((child) => { this.section && this.section.setStyle(styles);
// if (child.setStyle && child.isLine) {
// child.setStyle(styles);
// }
// });
this.section.setStyle(styles);
} }
setZleve(lev) { setZleve(lev) {
// this.eachChild((child) => { this.section && this.section.attr('z', lev);
// if (child.setStyle && child.isLine) {
// child.attr('z', lev);
// }
// });
this.section.attr('z', lev);
} }
hide() { hide() {
@ -233,24 +238,11 @@ export default class ELines extends Group {
}); });
} }
show() { show() {
// this.eachChild((child) => {
// // console.log(child);
// child.show();
// });
this.section && this.section.show(); this.section && this.section.show();
} }
animateStyle(loop, animates) { animateStyle(loop, animates) {
if (animates && animates.length) { if (animates && animates.length) {
// this.eachChild((child) => {
// if (child.animateStyle && child.isLine) {
// let an = child.animateStyle(loop);
// animates.forEach(elem => {
// an = an.when(elem.time, elem.styles);
// });
// an.start();
// }
// });
if (this.section.animateStyle && this.section.isLine) { if (this.section.animateStyle && this.section.isLine) {
let an = this.section.animateStyle(loop); let an = this.section.animateStyle(loop);
animates.forEach(elem => { animates.forEach(elem => {
@ -356,6 +348,16 @@ export default class ELines extends Group {
this.routeArrowRight && this.routeArrowRight.setStyle({ fill: this.model.style.Section.routeArrow.defaultLineStroke }); this.routeArrowRight && this.routeArrowRight.setStyle({ fill: this.model.style.Section.routeArrow.defaultLineStroke });
} }
getBoundingRect() { getBoundingRect() {
return this.section.getBoundingRect().clone(); if (this.section) {
return this.section.getBoundingRect().clone();
}
}
recover() {
}
setState() {
} }
} }

View File

@ -15,62 +15,66 @@ class EMouse extends Group {
// 名称的包围框 // 名称的包围框
if (this.device.name && this.device.style.Section.mouseOverStyle.nameShow) { if (this.device.name && this.device.style.Section.mouseOverStyle.nameShow) {
const rect = this.device.name.getBoundingRect(); const rect = this.device.name.getBoundingRect();
this.sectionTextBorder = new Rect({ if (rect) {
zlevel: this.device.zlevel, this.sectionTextBorder = new Rect({
z: this.device.z + 4, zlevel: this.device.zlevel,
shape: rect, z: this.device.z + 4,
style: { shape: rect,
lineDash: [3, 3], style: {
stroke: '#fff', // 白色 lineDash: [3, 3],
fill: this.device.model.sectionType == '02' ? this.device.style.Section.line.logicalColor : '#00FFFF' // 蓝色 stroke: '#fff', // 白色
} fill: this.device.model.sectionType == '02' ? this.device.style.Section.line.logicalColor : '#00FFFF' // 蓝色
}); }
this.add(this.sectionTextBorder); });
this.sectionTextBorder.hide(); this.add(this.sectionTextBorder);
this.sectionTextBorder.hide();
const fontSize = this.device.model.type == '02' ? this.device.style.Section.text.fontSize + 2 : this.device.style.Section.text.fontSize; const fontSize = this.device.model.type == '02' ? this.device.style.Section.name.fontSize + 2 : this.device.style.Section.name.fontSize;
this.TextName = new Text({ this.TextName = new Text({
zlevel: this.device.zlevel, zlevel: this.device.zlevel,
z: this.device.z + 4, z: this.device.z + 4,
style: { style: {
x: rect.x + (rect.width / 2), x: rect.x + (rect.width / 2),
y: rect.y + (rect.height / 2), y: rect.y + (rect.height / 2),
fontWeight: 'normal', fontWeight: 'normal',
fontSize: fontSize, fontSize: fontSize,
fontFamily: this.device.style.fontFamily, fontFamily: this.device.style.fontFamily,
text: this.device.model.name, text: this.device.model.name,
textFill: '#000', textFill: '#000',
textAlign: this.device.style.Section.text.textAlign, textAlign: this.device.style.Section.name.textAlign,
textPosition: this.device.style.Section.text.textPosition || 'inside', textPosition: this.device.style.Section.name.textPosition || 'inside',
textVerticalAlign: this.device.style.Section.text.textVerticalAlign || null textVerticalAlign: this.device.style.Section.name.textVerticalAlign || null
} }
}); });
this.add(this.TextName); this.add(this.TextName);
this.TextName.hide(); this.TextName.hide();
}
} }
// 区段包围框 // 区段包围框
if (this.device.section) { if (this.device.section) {
if (this.device.model.curve) { if (this.device.model.curve) {
const rect = this.device.section.getBoundingRect(); const rect = this.device.section.getBoundingRect();
rect.height = rect.height + this.device.style.Section.mouseOverStyle.lineWidthMore; if (rect) {
const shape = { rect.height = rect.height + this.device.style.Section.mouseOverStyle.lineWidthMore;
x: rect.x, const shape = {
y: rect.y - this.device.style.Section.mouseOverStyle.lineWidthMore / 2, x: rect.x,
width: rect.width, y: rect.y - this.device.style.Section.mouseOverStyle.lineWidthMore / 2,
height: rect.height width: rect.width,
}; height: rect.height
this.lineBorder = new Rect({ };
zlevel: this.device.zlevel, this.lineBorder = new Rect({
z: this.device.z - 1, zlevel: this.device.zlevel,
shape: shape, z: this.device.z - 1,
style: { shape: shape,
lineDash: this.device.style.Section.mouseOverStyle.lineDash, style: {
stroke: this.device.style.Section.mouseOverStyle.borderColor, lineDash: this.device.style.Section.mouseOverStyle.lineDash,
fill: this.device.style.transparentColor stroke: this.device.style.Section.mouseOverStyle.borderColor,
} fill: this.device.style.transparentColor
}); }
this.add(this.lineBorder); });
this.lineBorder.hide(); this.add(this.lineBorder);
this.lineBorder.hide();
}
} else { } else {
const model = this.device.model; const model = this.device.model;
let points = []; let points = [];

View File

@ -1,72 +0,0 @@
import Group from 'zrender/src/container/Group';
import Line from 'zrender/src/graphic/shape/Line';
/** 延时释放*/
export default class ERelease extends Group {
constructor(model) {
super();
this.model = model;
this.isNew = false;
}
create() {
if (!this.isNew) {
const model = this.model;
this.isNew = true;
this.lines = new Line({
zlevel: model.zlevel,
z: model.z,
shape: model.shape,
progressive: model.progressive,
style: {
lineWidth: model.lineWidth,
stroke: model.stroke
}
});
this.add(this.lines);
}
}
setStyle(model) {
this.create();
this.lines.setStyle(model);
}
hide() {
this.create();
this.lines.hide();
}
show() {
this.create();
this.lines.show();
}
// 开始动画
animateStyle(loop, animates) {
this.create();
if (animates && animates.length) {
this.eachChild((child) => {
if (child.animateStyle) {
let an = child.animateStyle(loop);
animates.forEach(elem => {
an = an.when(elem.time, elem.styles);
});
an.start();
}
});
}
}
// 结束动画
stopAnimation(flag) {
this.create();
this.eachChild((child) => {
if (child.stopAnimation) {
child.stopAnimation(flag);
}
});
}
}

View File

@ -1,6 +1,7 @@
import Group from 'zrender/src/container/Group'; import Group from 'zrender/src/container/Group';
import Polyline from 'zrender/src/graphic/shape/Polyline'; import Polyline from 'zrender/src/graphic/shape/Polyline';
import Circle from 'zrender/src/graphic/shape/Circle'; import Circle from 'zrender/src/graphic/shape/Circle';
import JTriangle from '../../utils/JTriangle';
/** 分隔符*/ /** 分隔符*/
export default class ESeparator extends Group { export default class ESeparator extends Group {
@ -10,15 +11,48 @@ export default class ESeparator extends Group {
this.zlevel = model.zlevel; this.zlevel = model.zlevel;
this.z = model.z || 6; this.z = model.z || 6;
this.style = model.style; this.style = model.style;
this.setType(); this.create();
} }
createModel(points, lineWidth, stroke) { create() {
const model = this.model; /** 创建区段*/
this.partition = new Polyline({ const model = this.model.modelData;
const style = this.model.style;
if (model && style && model.points && model.points.length > 1) {
/** 创建左侧分隔符*/
const traingleLeft = new JTriangle(model.points[0], model.points[1]);
this.lPartition = this.setType({
traingle: traingleLeft,
point: {
x: model.points[0].x,
y: model.points[0].y
},
sepType: model.sepTypeLeft,
drict: -1 // 方向
});
/** 创建右侧分隔符*/
const traingleRight = new JTriangle(model.points[model.points.length - 2], model.points[model.points.length - 1]);
this.rPartition = this.setType({
traingle: traingleRight,
point: {
x: model.points[model.points.length - 1].x,
y: model.points[model.points.length - 1].y
},
sepType: model.sepTypeRight,
drict: 1 // 方向
});
this.add(this.lPartition);
this.add(this.rPartition);
}
}
createModel(modelData, points, lineWidth, stroke) {
const partition = new Polyline({
zlevel: this.zlevel, zlevel: this.zlevel,
progressive: model.progressive,
z: this.z, z: this.z,
origin: [modelData.point.x, modelData.point.y],
rotation: Math.PI * 2 - Math.atan2(modelData.traingle.absy, modelData.traingle.absx) * modelData.traingle.drictx * modelData.traingle.dricty,
shape: { shape: {
points: points points: points
}, },
@ -27,19 +61,19 @@ export default class ESeparator extends Group {
stroke: stroke || this.style.Section.separator.color stroke: stroke || this.style.Section.separator.color
} }
}); });
this.add(this.partition); return partition;
} }
// 创建 侵限分隔符 // 创建 侵限分隔符
createCircle() { createCircle(modelData) {
const model = this.model; const partition = new Circle({
this.circle = new Circle({
zlevel: this.zlevel, zlevel: this.zlevel,
z: this.z, z: this.z,
progressive: model.progressive, origin: [modelData.point.x, modelData.point.y],
rotation: Math.PI * 2 - Math.atan2(modelData.traingle.absy, modelData.traingle.absx) * modelData.traingle.drictx * modelData.traingle.dricty,
shape: { shape: {
cx: model.point.x, cx: modelData.point.x,
cy: model.point.y, cy: modelData.point.y,
r: this.style.Section.line.width r: this.style.Section.line.width
}, },
style: { style: {
@ -48,18 +82,18 @@ export default class ESeparator extends Group {
fill: this.style.transparentColor fill: this.style.transparentColor
} }
}); });
this.add(this.circle); return partition;
} }
createCircleArc() { createCircleArc(modelData) {
const model = this.model; const partition = new Circle({
this.circleArc = new Circle({
zlevel: this.zlevel, zlevel: this.zlevel,
z: this.z, z: this.z,
progressive: model.progressive, origin: [modelData.point.x, modelData.point.y],
rotation: Math.PI * 2 - Math.atan2(modelData.traingle.absy, modelData.traingle.absx) * modelData.traingle.drictx * modelData.traingle.dricty,
shape: { shape: {
cx: model.point.x, cx: modelData.point.x,
cy: model.point.y, cy: modelData.point.y,
r: this.style.Section.line.width + 2 r: this.style.Section.line.width + 2
}, },
style: { style: {
@ -68,47 +102,44 @@ export default class ESeparator extends Group {
fill: this.style.transparentColor fill: this.style.transparentColor
} }
}); });
this.add(this.circleArc); return partition;
} }
setType() { setType(modelData) {
const type = this.model.sepType; const style = this.model.style;
const model = this.model; const type = modelData.sepType;
if (model && this.style && model.traingle) {
if (modelData && style && modelData.traingle) {
let partition = null;
if (type === '01') { // 普通分割 if (type === '01') { // 普通分割
const points = [ const points = [
[model.point.x, model.point.y - (this.style.Section.separator.halfHeight)], [modelData.point.x, modelData.point.y - (style.Section.separator.halfHeight)],
[model.point.x, model.point.y + (this.style.Section.separator.halfHeight)] [modelData.point.x, modelData.point.y + (style.Section.separator.halfHeight)]
]; ];
this.createModel(points); partition = this.createModel(modelData, points);
} else if (type === '02') { // 单侧分割符 } else if (type === '02') { // 单侧分割符
const points = [ const points = [
[model.point.x + model.drict * (this.style.Section.separator.halfHeight), model.point.y - (this.style.Section.separator.halfHeight * 1.5)], [modelData.point.x + modelData.drict * (style.Section.separator.halfHeight), modelData.point.y - (style.Section.separator.halfHeight * 1.5)],
[model.point.x, model.point.y - (this.style.Section.separator.halfHeight * 1.5)], [modelData.point.x, modelData.point.y - (style.Section.separator.halfHeight * 1.5)],
[model.point.x, model.point.y + (this.style.Section.separator.halfHeight * 1.5)] [modelData.point.x, modelData.point.y + (style.Section.separator.halfHeight * 1.5)]
]; ];
this.createModel(points); partition = this.createModel(modelData, points);
} else if (type === '03') { // 尽头分隔符 } else if (type === '03') { // 尽头分隔符
const points = [ const points = [
[model.point.x + model.drict * (this.style.Section.separator.halfHeight) * 1.2, model.point.y - (this.style.Section.separator.halfHeight * 1.2)], [modelData.point.x + modelData.drict * (style.Section.separator.halfHeight) * 1.2, modelData.point.y - (style.Section.separator.halfHeight * 1.2)],
[model.point.x, model.point.y - (this.style.Section.separator.halfHeight * 1.2)], [modelData.point.x, modelData.point.y - (style.Section.separator.halfHeight * 1.2)],
[model.point.x, model.point.y + (this.style.Section.separator.halfHeight * 1.2)], [modelData.point.x, modelData.point.y + (style.Section.separator.halfHeight * 1.2)],
[model.point.x + model.drict * (this.style.Section.separator.halfHeight) * 1.2, model.point.y + (this.style.Section.separator.halfHeight * 1.2)] [modelData.point.x + modelData.drict * (style.Section.separator.halfHeight) * 1.2, modelData.point.y + (style.Section.separator.halfHeight * 1.2)]
]; ];
const lineWidth = this.style.Section.separator.endWidth; const lineWidth = style.Section.separator.endWidth;
const stroke = this.style.Section.separator.endColor; const stroke = style.Section.separator.endColor;
this.createModel(points, lineWidth, stroke); partition = this.createModel(modelData, points, lineWidth, stroke);
} else if (type === '04') { // 侵限分隔符 } else if (type === '04') { // 侵限分隔符
this.createCircle(); partition = this.createCircle(modelData);
} else if (type === '05') { // 特色分隔符 } else if (type === '05') { // 特色分隔符
this.createCircleArc(); partition = this.createCircleArc(modelData);
} }
} return partition;
if (model.traingle) {
this.origin = [model.point.x, model.point.y];
this.rotation = Math.PI * 2 - Math.atan2(model.traingle.absy, model.traingle.absx) * model.traingle.drictx * model.traingle.dricty;
this.dirty(); // 可以无需调用
} }
} }
} }

View File

@ -14,39 +14,51 @@ export default class EStopRouteImg extends Group {
this.create(); this.create();
} }
create() { create() {
const image = new Image(5, 8); const model = this.model.modelData;
image.src = Stop_Route; const style = this.model.style;
const modelPoints = model.points;
image.decode() if (model.type !== '04') {
.then(() => { const image = new Image(5, 8);
const pattern = new Pattern(image, 'repeat'); image.src = Stop_Route;
for (let i = 1; i < this.model.points.length; i++) { image.decode()
const triangle = new JTriangle(this.model.points[i - 1], this.model.points[i]); .then(() => {
this.stopRouteImgList.push(new Rect({ const pattern = new Pattern(image, 'repeat');
zlevel: this.zlevel, for (let i = 1; i < modelPoints.length; i++) {
z: this.z + 1, const triangle = new JTriangle(modelPoints[i - 1], modelPoints[i]);
origin: [this.model.points[i - 1].x, this.model.points[i - 1].y], this.stopRouteImgList.push(new Rect({
rotation: -triangle.getRotation(), zlevel: this.zlevel,
shape: { z: this.z + 1,
x: this.model.points[i - 1].x, origin: [modelPoints[i - 1].x, modelPoints[i - 1].y],
y: this.model.points[i - 1].y - this.model.style.Section.line.width / 2, rotation: -triangle.getRotation(),
width: triangle.getLength(), shape: {
height: this.model.style.Section.line.width x: modelPoints[i - 1].x,
}, y: modelPoints[i - 1].y - style.Section.line.width / 2,
style: { width: triangle.getLength(),
fill: pattern height: style.Section.line.width
} },
})); style: {
} fill: pattern
this.stopRouteImgList.forEach(item => { }
this.add(item); }));
item.hide(); }
this.stopRouteImgList.forEach(item => {
this.add(item);
item.hide();
});
}); });
}); }
} }
setModel(dx, dy) { setModel(dx, dy) {
} }
setCursor(mouseStyle) { setCursor(mouseStyle) {
this.imageBg.attr('cursor', mouseStyle); this.imageBg.attr('cursor', mouseStyle);
} }
recover() {
}
setState() {
}
} }

View File

@ -0,0 +1,163 @@
import Group from 'zrender/src/container/Group';
import Text from 'zrender/src/graphic/Text';
import JTriangle from '../../utils/JTriangle';
class ETextName extends Group {
constructor(model) {
super();
this.model = model;
this.create();
}
create() {
const model = this.model.modelData;
const styleModel = this.model.style.Section[this.model.type];
let styleX = '';
let styleY = '';
let styleName = '';
let isCreate = false;
let isShow = false;
// 计算区段坐标位置
const x = Math.min(model.points[0].x, model.points[model.points.length - 1].x) + Math.abs(model.points[model.points.length - 1].x - model.points[0].x) / 2;
const y = Math.min(model.points[0].y, model.points[model.points.length - 1].y) + Math.abs(model.points[model.points.length - 1].y - model.points[0].y) / 2;
const traingle = new JTriangle(model.points[0], model.points[model.points.length - 1]);
const drict = model.trainPosType != '01' ? 1 : -1;
if (this.model.type == 'name') {
if (model.type == '01') { // 物理区段名称
const tempx = x + traingle.getSin(styleModel.distance);
const tempy = y + traingle.getCos(styleModel.distance) * (styleModel.position || drict);
styleX = tempx + model.namePosition.x;
styleY = tempy + model.namePosition.y;
isCreate = true;
} else if (model.type == '04') { // 道岔计轴区段
styleX = x + model.namePosition.x;
styleY = y + model.namePosition.y + styleModel.distance * drict;
isCreate = true;
}
styleName = model.name;
if (model.nameShow) {
isShow = true;
}
}
// 逻辑区段
if (this.model.type == 'logicText' && model.type == '02') {
const tempx = x + traingle.getSin(styleModel.distance);
const tempy = y + traingle.getCos(styleModel.distance) * (styleModel.position || drict);
styleX = tempx + model.namePosition.x;
styleY = tempy + model.namePosition.y;
styleName = model.name;
isCreate = true;
if (model.nameShow) {
isShow = true;
}
}
// 站台轨名称
if (this.model.type == 'standTrackText') {
if (model.standTrack && model.standTrackName) {
isCreate = true;
const tempx = x + traingle.getSin(styleModel.distance);
const tempy = y + traingle.getCos(styleModel.distance) * (styleModel.position || drict);
styleX = tempx + model.standTrackNamePosition.x;
styleY = tempy + model.standTrackNamePosition.y;
styleName = model.standTrackName;
}
if (model.standTrackNameShow) {
isShow = true;
}
}
// 折返轨名称
if (this.model.type == 'reentryTrackText') {
if (model.reentryTrack && model.reentryTrackName) {
isCreate = true;
const tempx = x + traingle.getSin(styleModel.distance);
const tempy = y + traingle.getCos(styleModel.distance) * (styleModel.position || drict);
styleX = tempx + model.reentryTrackNamePosition.x;
styleY = tempy + model.reentryTrackNamePosition.y;
styleName = model.reentryTrackName;
}
if (model.reentryTrackNameShow) {
isShow = true;
}
}
// 转换轨名称
if (this.model.type == 'transferTrackText') {
if (model.transferTrack && model.transferTrackName) {
isCreate = true;
const tempx = x + traingle.getSin(styleModel.distance);
const tempy = y + traingle.getCos(styleModel.distance) * (styleModel.position || drict);
styleX = tempx + model.transferTrackNamePosition.x;
styleY = tempy + model.transferTrackNamePosition.y;
styleName = model.transferTrackName;
}
if (model.transferTrackNameShow) {
isShow = true;
}
}
// 目的码名称
if (this.model.type == 'destinationText') {
if (model.destinationCode) {
isCreate = true;
let tempx = x + traingle.getSin(styleModel.distance);
let tempy = y + traingle.getCos(styleModel.distance) * (styleModel.position || drict);
if (!tempx || !tempy) {
tempx = 0;
tempy = 0;
}
styleX = tempx + model.destinationCodePoint.x;
styleY = tempy + model.destinationCodePoint.y;
styleName = model.destinationCode;
}
if (model.destinationNameShow) {
isShow = true;
}
}
if (isCreate) {
this.text = new Text({
_subType: 'Text',
zlevel: this.model.zlevel,
z: this.model.z,
silent: model.silent || false,
style: {
x: styleX,
y: styleY,
fontWeight: styleModel.fontWeight || 'normal',
fontSize: styleModel.fontSize,
fontFamily: styleModel.fontFamily || this.model.style.fontFamily,
text: styleName,
textFill: styleModel.fontColor,
textAlign: styleModel.textAlign,
textPosition: styleModel.textPosition || 'inside',
textVerticalAlign: styleModel.textVerticalAlign || null
}
});
this.add(this.text);
isShow ? this.text.show() : this.text.hide();
}
}
show() {
this.text && this.text.show();
}
hide() {
this.text && this.text.hide();
}
getBoundingRect() {
if (this.text) {
return this.text.getBoundingRect().clone();
}
}
recover() {
// 暂时不做状态初始化
}
setState() {
// 区段名称类暂时不做状态处理
}
}
export default ETextName;

View File

@ -16,13 +16,17 @@ export default class ELines extends Group {
this.model = model; this.model = model;
this.zlevel = model.zlevel; this.zlevel = model.zlevel;
this.z = model.z; this.z = model.z;
this.create(model); this.create();
} }
create(model) { create() {
/** 创建区段*/ /** 创建区段*/
const model = this.model.modelData;
const style = this.model.style;
const isCurve = model.curve;
if (model && model.points.length > 1) { if (model && model.points.length > 1) {
if (model.isCurve) { // 曲线 用贝塞尔曲线绘图 封锁 必须4个点来绘图 if (isCurve) { // 曲线 用贝塞尔曲线绘图 封锁 必须4个点来绘图
const shape = {}; const shape = {};
for (let i = 1; i < (model.points.length - 1); i++) { for (let i = 1; i < (model.points.length - 1); i++) {
shape[`cpx${i}`] = model.points[i].x; shape[`cpx${i}`] = model.points[i].x;
@ -41,8 +45,8 @@ export default class ELines extends Group {
culling: true, culling: true,
shape: this.couvert(shape), shape: this.couvert(shape),
style: { style: {
lineWidth: model.style.Section.line.width, lineWidth: style.Section.line.width,
stroke: model.style.Section.line.blockColor, stroke: style.Section.line.blockColor,
fillOpacity: 0 fillOpacity: 0
} }
}); });
@ -63,8 +67,8 @@ export default class ELines extends Group {
y2: model.points[0].y + spaceY + spaceY y2: model.points[0].y + spaceY + spaceY
}, },
style: { style: {
lineWidth: model.style.Section.line.width, lineWidth: style.Section.line.width,
stroke: model.style.Section.line.blockColor stroke: style.Section.line.blockColor
} }
}); });
this.add(this.sectionM); this.add(this.sectionM);
@ -183,4 +187,12 @@ export default class ELines extends Group {
cpy1: (cpy1 + cpy2) / 2 + v[0] * y0 * 0.128 cpy1: (cpy1 + cpy2) / 2 + v[0] * y0 * 0.128
}; };
} }
recover() {
}
setState() {
}
} }

View File

@ -1,15 +1,15 @@
import Group from 'zrender/src/container/Group'; import Group from 'zrender/src/container/Group';
import ETextName from '../element/ETextName'; // 名称文字 (共有) import ETextName from './ETextName'; // 名称文字
// import ERelease from './ERelease'; // 线段 (共有)
import ELimitLines from './ELimitLines'; // 区段限速 (私有) import ELimitLines from './ELimitLines'; // 区段限速 (私有)
import ELines from './ELines'; // 创建多线条 曲线 (私有) import ELines from './ELines'; // 创建多线条 曲线 (私有)
import EblockLines from './EblockLines'; // 区段封锁特有 import EblockLines from './EblockLines'; // 区段封锁特有
import ESeparator from './ESeparator'; // 分隔符 (私有) import ESeparator from './ESeparator'; // 分隔符 (私有)
import EMouse from './EMouse'; import EMouse from './EMouse';
import EAxle from './EAxle'; // 创建计轴 import EAxle from './EAxle'; // 创建计轴
import { EBackArrow, EBackArrowTriangle } from './EBackArrow'; // 折返进路箭头 // import { EBackArrow, EBackArrowTriangle } from './EBackArrow'; // 折返进路箭头
import EBackArrowGroup from './EBackArrow'; // 折返进路箭头
import ELimitName from './ELimitName'; // 成都三号线 限速名称 import ELimitName from './ELimitName'; // 成都三号线 限速名称
import JTriangle from '../../utils/JTriangle'; // import JTriangle from '../../utils/JTriangle';
import { drawSectionStyle } from '../../config/defaultStyle'; import { drawSectionStyle } from '../../config/defaultStyle';
import EStopRouteImg from './EStopRouteImg'; import EStopRouteImg from './EStopRouteImg';
import store from '@/store/index_APP_TARGET'; import store from '@/store/index_APP_TARGET';
@ -35,556 +35,67 @@ export default class Section extends Group {
create() { create() {
// 区段type 01计轴区段02逻辑区段03道岔区段 04道岔计轴区段 // 区段type 01计轴区段02逻辑区段03道岔区段 04道岔计轴区段
this.createSectionText(); // 创建区段文字 // 站台所有的绘图元素
this.createSection(); // 创建区段 const elementTypeList = {
// this.creatRelease(); // 创建延时释放 'name': ETextName, // 区段名称
this.createSeparator(); // 创建分隔符 'logicText': ETextName, // 逻辑区段名称
this.createTurnBack(); // 创建成都三号线 折返箭头 'standTrackText': ETextName, // 站台轨名称
this.createAxlex(); // 创建计轴 (西安二号线) 'reentryTrackText': ETextName, // 折返轨名称
this.createReleaseText(); // 创建延迟解锁计时 'transferTrackText': ETextName, // 转换轨名称
} 'destinationText': ETextName, // 目的码名称
// 创建计轴 'line': ELines, // 创建区段
createAxlex() { 'lineBorder': ELines, // 哈尔滨线路点击背景色
if (this.style.Section.axle.show) { 'sectionBlock': EblockLines, // 哈尔滨线路区段(封锁显示)
const length = this.model.points.length; 'stopRouteImg': EStopRouteImg, // 宁波三线路特有
const traingleStart = new JTriangle(this.model.points[0], this.model.points[1]); 'axle': EAxle, // 计轴 (西安二号线 )
const traingleEnd = new JTriangle(this.model.points[length - 2], this.model.points[length - 1]); 'separator': ESeparator, // 分隔符
if (this.model.leftAxlePosition) { 'speedLimit': ELimitLines, // 限速线
const leftPoint = {x:this.model.points[0].x, y: this.model.points[0].y}; 'speedLimitName': ELimitName, // 限速线名称
if (this.model.leftAxleOffset) { 'shuttleBack': EBackArrowGroup // 折返箭头 (成都三号线显示)
leftPoint.x = leftPoint.x + this.model.leftAxleOffset.x || 0; };
leftPoint.y = leftPoint.y + this.model.leftAxleOffset.y || 0; // 遍历当前线路下的绘图元素
}
this.leftAxle = new EAxle({
_subType: 'leftAxle',
zlevel: this.zlevel,
z: this.z,
shape: {
style: this.style,
traingle: traingleStart,
drictx: 1,
dricty: this.model.leftAxlePosition === 1 || this.model.leftAxlePosition === 2 ? 1 : -1,
isSpecial: this.model.leftAxlePosition === -2 || this.model.leftAxlePosition === 2,
point: leftPoint,
difference: this.model.points[0].y - this.model.points[1].y,
multiple: 1
},
style: {
lineWidth: this.style.Section.axle.lineWidth,
fill: this.style.Section.axle.color,
stroke: this.style.Section.axle.color
}
});
this.add(this.leftAxle);
}
if (this.model.rightAxlePosition) {
const rightPoint = {x:this.model.points[length - 1].x, y: this.model.points[length - 1].y};
if (this.model.rightAxleOffset) {
rightPoint.x = rightPoint.x + this.model.rightAxleOffset.x || 0;
rightPoint.y = rightPoint.y + this.model.rightAxleOffset.y || 0;
}
this.rightAxle = new EAxle({
_subType: 'rightAxle',
zlevel: this.zlevel,
z: this.z,
shape: {
style: this.style,
traingle: traingleEnd,
drictx: -1,
dricty: this.model.rightAxlePosition === 1 || this.model.rightAxlePosition === 2 ? 1 : -1,
isSpecial: this.model.rightAxlePosition === -2 || this.model.rightAxlePosition === 2,
point: rightPoint,
difference: this.model.points[length - 2].y - this.model.points[length - 1].y,
multiple1: -1
},
style: {
lineWidth: this.style.Section.axle.lineWidth,
fill: this.style.Section.axle.color,
stroke: this.style.Section.axle.color
}
});
this.add(this.rightAxle);
}
}
}
// 创建区段名称
createSectionText() {
const model = this.model; const model = this.model;
const style = this.style; const style = this.style;
const currentTypeList = style.Section.elemnetType;
if (model && style) { currentTypeList.forEach(element => {
// 计算区段坐标位置 const ClassName = elementTypeList[element];
const x = Math.min(model.points[0].x, model.points[model.points.length - 1].x) + Math.abs(model.points[model.points.length - 1].x - model.points[0].x) / 2; const elementZ = style.Section[element] ? style.Section[element].z ? style.Section[element].z : 0 : 0;
const y = Math.min(model.points[0].y, model.points[model.points.length - 1].y) + Math.abs(model.points[model.points.length - 1].y - model.points[0].y) / 2; this[element] = new ClassName({
const traingle = new JTriangle(model.points[0], model.points[model.points.length - 1]);
const drict = model.trainPosType != '01' ? 1 : -1;
if (model.type == '01') { // 物理区段名称
const tempx = x + traingle.getSin(style.Section.text.distance);
const tempy = y + traingle.getCos(style.Section.text.distance) * (style.Section.text.position || drict);
this.name = new ETextName({
zlevel: this.zlevel,
z: this.z + 2,
style: this.style,
silent: false,
x: tempx + model.namePosition.x,
y: tempy + model.namePosition.y,
fontWeight: style.Section.text.fontWeight,
fontSize: style.Section.text.fontSize,
fontFamily: style.fontFamily,
text: model.name,
textFill: style.Section.text.fontColor,
textAlign: style.Section.text.textAlign,
textPosition: style.Section.text.textPosition,
textVerticalAlign: style.Section.text.textVerticalAlign
});
this.add(this.name);
model.nameShow && style.Section.text.show ? this.name.show() : this.name.hide();
} else if (model.type == '02') { // 逻辑区段
const tempx = x + traingle.getSin(style.Section.logicText.distance);
const tempy = y + traingle.getCos(style.Section.logicText.distance) * (style.Section.logicText.position || drict);
this.name = new ETextName({
zlevel: this.zlevel,
z: this.z + 2,
style: this.style,
silent: false,
x: tempx + model.namePosition.x,
y: tempy + model.namePosition.y,
fontWeight: style.Section.logicText.fontWeight,
fontSize: style.Section.logicText.fontSize,
fontFamily: style.fontFamily,
text: model.name,
textFill: style.Section.logicText.fontColor,
textAlign: style.Section.logicText.textAlign,
textPosition: style.Section.logicText.textPosition,
textVerticalAlign: style.Section.logicText.textVerticalAlign
});
this.add(this.name);
model.nameShow && style.Section.logicText.show ? this.name.show() : this.name.hide();
} else if (model.type == '04') { // 道岔计轴区段
this.name = new ETextName({
zlevel: this.zlevel,
z: this.z + 2,
style: this.style,
silent: false,
x: x + model.namePosition.x,
y: y + model.namePosition.y + style.Section.text.distance * drict,
fontWeight: style.Section.text.fontWeight,
fontSize: style.Section.text.fontSize,
fontFamily: style.fontFamily,
text: model.name,
textFill: style.Section.text.fontColor,
textAlign: style.Section.text.textAlign,
textPosition: style.Section.text.textPosition,
textVerticalAlign: style.Section.text.textVerticalAlign
});
this.add(this.name);
model.nameShow ? this.name.show() : this.name.hide();
}
/** 站台轨名称*/
// 站台轨存在且站台轨名称存在时显示
if (model.standTrack && model.standTrackName) {
const tempx = x + traingle.getSin(style.Section.standText.distance);
const tempy = y + traingle.getCos(style.Section.standText.distance) * (style.Section.standText.position || drict);
this.standTrackText = new ETextName({
zlevel: this.zlevel,
z: this.z + 2,
silent: false,
x: tempx + model.standTrackNamePosition.x,
y: tempy + model.standTrackNamePosition.y,
fontWeight: style.Section.standText.fontWeight,
fontSize: style.Section.standText.fontSize,
fontFamily: style.fontFamily,
text: model.standTrackName,
textFill: style.Section.standText.fontColor,
textAlign: style.Section.standText.textAlign,
textPosition: style.Section.standText.textPosition,
textVerticalAlign: style.Section.standText.textVerticalAlign
});
this.add(this.standTrackText);
model.standTrackNameShow && style.Section.standText.show ? this.standTrackText.show() : this.standTrackText.hide();
}
/** 折返轨名称*/
// 折返轨存在且折返轨名称存在时显示
if (model.reentryTrack && model.reentryTrackName) {
const tempx = x + traingle.getSin(style.Section.reentryText.distance);
const tempy = y + traingle.getCos(style.Section.reentryText.distance) * (style.Section.reentryText.position || drict);
this.reentryTrackText = new ETextName({
zlevel: this.zlevel,
z: this.z + 2,
silent: false,
x: tempx + model.reentryTrackNamePosition.x,
y: tempy + model.reentryTrackNamePosition.y,
fontWeight: style.Section.reentryText.fontWeight,
fontSize: style.Section.reentryText.fontSize,
fontFamily: style.fontFamily,
text: model.reentryTrackName,
textFill: style.Section.reentryText.fontColor,
textAlign: style.Section.reentryText.textAlign,
textPosition: style.Section.reentryText.textPosition,
textVerticalAlign: style.Section.reentryText.textVerticalAlign
});
this.add(this.reentryTrackText);
model.reentryTrackNameShow && style.Section.reentryText.show ? this.reentryTrackText.show() : this.reentryTrackText.hide();
}
/** 转换轨名称*/
// 转换轨存在且转换轨名称存在时显示
if (model.transferTrack && model.transferTrackName) {
const tempx = x + traingle.getSin(style.Section.transferText.distance);
const tempy = y + traingle.getCos(style.Section.transferText.distance) * (style.Section.transferText.position || drict);
this.transferTrackText = new ETextName({
zlevel: this.zlevel,
z: this.z + 2,
silent: false,
x: tempx + model.transferTrackNamePosition.x,
y: tempy + model.transferTrackNamePosition.y,
fontWeight: style.Section.transferText.fontWeight,
fontSize: style.Section.transferText.fontSize,
fontFamily: style.fontFamily,
text: model.transferTrackName,
textFill: style.Section.transferText.fontColor,
textAlign: style.Section.transferText.textAlign,
textPosition: style.Section.transferText.textPosition,
textVerticalAlign: style.Section.transferText.textVerticalAlign
});
this.add(this.transferTrackText);
model.transferTrackNameShow && style.Section.transferText.show ? this.transferTrackText.show() : this.transferTrackText.hide();
}
/** 目的码名称*/
// 目的码存在且目的码名称存在时显示
if (model.destinationCode) {
let tempx = x + traingle.getSin(style.Section.destinationText.distance);
let tempy = y + traingle.getCos(style.Section.destinationText.distance) * (style.Section.destinationText.position || drict);
if (!tempx || !tempy) {
tempx = 0;
tempy = 0;
}
this.destinationText = new ETextName({
zlevel: this.zlevel,
z: this.z + 2,
silent: false,
x: tempx + model.destinationCodePoint.x,
y: tempy + model.destinationCodePoint.y,
fontWeight: style.Section.destinationText.fontWeight,
fontSize: style.Section.destinationText.fontSize,
fontFamily: style.fontFamily,
text: model.destinationCode,
textFill: style.Section.destinationText.fontColor,
textAlign: style.Section.destinationText.textAlign,
textPosition: style.Section.destinationText.textPosition,
textVerticalAlign: style.Section.destinationText.textVerticalAlign
});
this.add(this.destinationText);
model.destinationNameShow && style.Section.destinationText.show ? this.destinationText.show() : this.destinationText.hide();
}
}
}
/** 创建区段*/
createSection() {
const model = this.model;
const style = this.style;
// 创建区段 model.logicSectionCodeList 为空 或 0 表明没有逻辑区段 创建 否则过滤
if ((model.type == '01' && (!model.logicSectionCodeList || !model.logicSectionCodeList.length)) || model.type == '02' || model.type == '03') {
this.section = new ELines({
zlevel: this.zlevel, zlevel: this.zlevel,
z: model.type == '02' ? this.z + 1 : this.z, // 逻辑区段会覆盖物理区段 z: this.z + elementZ,
isSwitchSection: model.switchSection,
isCurve: model.curve,
points: model.type == '04' ? [model.namePosition, model.namePosition] : model.points,
style: style
});
this.add(this.section);
if (this.style.Section.block.special) { // 创建哈尔滨特殊区段(用作封锁显示)
this.sectionBlock = new EblockLines({
zlevel: this.zlevel,
z: this.z + 2,
isSwitchSection: model.switchSection,
isCurve: model.curve,
points: model.points,
style: style
});
this.add(this.sectionBlock);
}
if (this.style.Section.line.isActiveShow) { // 哈尔滨线路点击背景色
this.lineBorder = new ELines({
zlevel: this.zlevel,
z: this.z - 1,
isSwitchSection: model.switchSection,
isCurve: model.curve,
points: model.type == '04' ? [model.namePosition, model.namePosition] : model.points,
style: style
});
this.add(this.lineBorder);
this.lineBorder.setStyle({ lineWidth: 0 });
}
if (this.style.Section.stopRouteImg && model.type !== '04') {
this.stopRouteImg = new EStopRouteImg({
zlevel: this.zlevel,
z: this.z,
points: model.points,
style:style
});
this.add(this.stopRouteImg);
}
}
}
// 折返箭头
createTurnBack() {
const model = this.model;
const style = this.style;
if (model.reentryTrack && style.Section.shuttleBack) {
const radius = 3;
model.drict = 1; // 箭头朝向 (是折返轨加一个方向选择) 目前在区段右边
const width = style.Section.line.width * 2;
const height = style.Section.line.width * 1;
const turnBackDistance = style.Section.shuttleBack.distance + radius * 4;
const points = model.points;
let x = -model.drict * width * 1.2;
let y = -turnBackDistance;
if (model.drict < 0) {
x += points[0].x;
y += points[0].y;
} else {
x += points[points.length - 1].x;
y += points[points.length - 1].y;
}
this.turnBack = new EBackArrow({
zlevel: this.zlevel,
z: this.z + 10,
shape: {
drict: model.drict,
width: width,
height: height,
points: {
x: x,
y: y
}
},
style: {
lineWidth: style.Section.separator.width,
stroke: style.Section.separator.color,
fill: 'rgba(0, 0, 0, 0)'
}
});
this.turnBackriangle = new EBackArrowTriangle({
zlevel: this.zlevel,
z: this.z + 10,
shape: {
drict: model.drict,
width: width,
height: height,
points: {
x: x,
y: y
}
},
style: {
lineWidth: style.Section.separator.width,
stroke: style.Section.separator.color,
fill: style.Section.separator.color
}
});
this.add(this.turnBack);
this.add(this.turnBackriangle);
this.turnBack.hide();
this.turnBackriangle.hide();
}
}
// // 创建延时释放
// creatRelease() {
// const model = this.model;
// const style = this.style;
// const traingle = new JTriangle(model.points[0], model.points[model.points.length - 1]);
// if ((model.type == '01' && (!model.logicSectionCodeList || !model.logicSectionCodeList.length)) || model.type == '02' || model.type == '03') {
// this.release = new ERelease({
// zlevel: this.zlevel,
// z: this.z,
// shape: {
// x1: model.points[0].x + traingle.getCos(traingle.absz / 3),
// y1: model.points[0].y + traingle.getSin(traingle.absz / 3),
// x2: model.points[0].x + traingle.getCos(traingle.absz / 3 * 2),
// y2: model.points[0].y + traingle.getSin(traingle.absz / 3 * 2)
// },
// lineWidth: style.Section.line.width,
// stroke: style.Section.line.spareColor
// });
// this.add(this.release);
// }
// }
// 创建限速线
creatSpeedLimit() {
const model = this.model;
const style = this.style;
const traingle = new JTriangle(model.points[0], model.points[model.points.length - 1]);
let x = traingle.drictx * (style.Section.speedLimit.distance) * traingle.getSinRate();
let y = traingle.dricty * (style.Section.speedLimit.distance) * traingle.getCosRate();
if (x == Infinity) { x = 0; }
if (y == Infinity) { y = 0; }
if (!this.speedLimitLeft && !this.speedLimitRight) {
this.speedLimitLeft = new ELimitLines({
zlevel: this.zlevel,
z: this.z,
position: [x, -y],
style: style, style: style,
switch: model.switch, type: element,
code: model.code, modelData: model
isSwitchSection: model.switchSection,
relSwitchCode: model.relSwitchCode,
isCurve: model.curve, // 是否曲线
points: model.points
}); });
this.speedLimitRight = new ELimitLines({ this.add(this[element]);
zlevel: this.zlevel,
z: this.z,
position: [-x, y],
style: style,
switch: model.switch,
code: model.code,
isSwitchSection: model.switchSection,
relSwitchCode: model.relSwitchCode,
isCurve: model.curve, // 是否曲线
points: model.points
});
if (style.Section.speedLimit.nameShow) {
// 开头 起点位置
this.speedLimitNameLeft = new ELimitName({
zlevel: this.zlevel,
z: this.z + 10,
drict: -1,
x: model.points[0].x,
y: model.points[0].y - 15,
style: style
});
// 终点位置
this.speedLimitNameRight = new ELimitName({
zlevel: this.zlevel,
z: this.z + 10,
drict: 1,
x: model.points[model.points.length - 1].x,
y: model.points[model.points.length - 1].y - 15,
style: style
});
this.add(this.speedLimitNameLeft);
this.add(this.speedLimitNameRight);
}
}
this.add(this.speedLimitLeft);
this.add(this.speedLimitRight);
}
// 创建分隔符
createSeparator() {
const model = this.model;
const style = this.style;
let traingle = null;
if (model && style && model.points && model.points.length > 1) {
/** 创建左侧分隔符*/
traingle = new JTriangle(model.points[0], model.points[1]);
this.lPartition = new ESeparator({
style: style,
zlevel: this.zlevel,
z: this.z + style.Section.separator.z,
traingle: traingle,
point: {
x: model.points[0].x,
y: model.points[0].y
},
sepType: model.sepTypeLeft,
drict: -1 // 方向
});
/** 创建右侧分隔符*/
traingle = new JTriangle(model.points[model.points.length - 2], model.points[model.points.length - 1]);
this.rPartition = new ESeparator({
style: style,
zlevel: this.zlevel,
z: this.z + style.Section.separator.z,
traingle: traingle,
point: {
x: model.points[model.points.length - 1].x,
y: model.points[model.points.length - 1].y
},
sepType: model.sepTypeRight,
drict: 1 // 方向
});
/** 添加视图*/
this.add(this.lPartition);
this.add(this.rPartition);
}
}
// 创建延迟解锁计时
createReleaseText() {
const model = this.model;
const style = this.style;
this.releaseName = new ETextName({
zlevel: this.zlevel,
z: this.z + 2,
style: this.style,
silent: false,
x: model.points[0].x + 10,
y: model.points[0].y - style.Section.line.width * 2,
fontWeight: style.Section.text.fontWeight,
fontSize: style.Section.text.fontSize,
fontFamily: style.fontFamily,
text: '30',
textFill: style.Section.text.fontColor,
textAlign: style.Section.text.textAlign,
textPosition: style.Section.text.textPosition,
textVerticalAlign: style.Section.text.textVerticalAlign
}); });
this.add(this.releaseName);
} }
/** 设置区段恢复默认状态*/ /** 设置区段恢复默认状态*/
recover() { recover() {
if (this.section) { if (this.line) {
this.section.stopAnimation(true); this.line.stopAnimation(true);
this.sectionBlock && this.sectionBlock.hide(); // 因此特殊区段 this.sectionBlock && this.sectionBlock.hide(); // 因此特殊区段
this.section.setStyle({ this.line.setStyle({
stroke: this.style.Section.line.spareColor, stroke: this.style.Section.line.spareColor,
lineWidth: this.style.Section.line.width lineWidth: this.style.Section.line.width
}); });
// this.release && this.release.hide();
if (this.speedLimitLeft && this.speedLimitRight) {
this.remove(this.speedLimitLeft);
this.remove(this.speedLimitRight);
}
} }
this.releaseName && this.releaseName.hide(); this.speedLimit && this.speedLimit.hide();
if (this.leftAxle) { this.speedLimitName && this.speedLimitName.hide();
this.leftAxle.setStyle({
stroke: this.style.Section.line.spareColor, this.axle && this.axle.setStyle({
fill: this.style.Section.line.spareColor stroke: this.style.Section.line.spareColor,
}); fill: this.style.Section.line.spareColor
} });
if (this.rightAxle) { this.line && this.line.recoverRoute();
this.rightAxle.setStyle({ this.lineBorder && this.lineBorder.setStyle({ lineWidth: 0 });
stroke: this.style.Section.line.spareColor,
fill: this.style.Section.line.spareColor
});
}
this.section && this.section.recoverRoute();
} }
/** 未定义状态 00*/ /** 未定义状态 00*/
undefine() { undefine() {
if (this.section) { if (this.line) {
this.section.setStyle({ this.line.setStyle({
stroke: this.style.Section.line.undefinedColor, stroke: this.style.Section.line.undefinedColor,
lineWidth: this.style.Section.line.width lineWidth: this.style.Section.line.width
}); });
@ -593,8 +104,8 @@ export default class Section extends Group {
/** 空闲状态 01*/ /** 空闲状态 01*/
spare() { spare() {
if (this.section) { if (this.line) {
this.section.setStyle({ this.line.setStyle({
stroke: this.style.Section.line.spareColor, stroke: this.style.Section.line.spareColor,
lineWidth: this.style.Section.line.width lineWidth: this.style.Section.line.width
}); });
@ -603,58 +114,42 @@ export default class Section extends Group {
/** 通信车占用状态 02*/ /** 通信车占用状态 02*/
communicationOccupied() { communicationOccupied() {
if (this.section) { if (this.line) {
this.section.setStyle({ this.line.setStyle({
stroke: this.style.Section.line.communicationOccupiedColor, stroke: this.style.Section.line.communicationOccupiedColor,
lineWidth: this.style.Section.line.width + this.style.Section.line.beyondWidth lineWidth: this.style.Section.line.width + this.style.Section.line.beyondWidth
}); });
} }
if (this.leftAxle) { this.axle && this.axle.setStyle({
this.leftAxle.setStyle({ stroke: this.style.Section.line.communicationOccupiedColor,
stroke: this.style.Section.line.communicationOccupiedColor, fill:this.style.Section.line.communicationOccupiedColor
fill:this.style.Section.line.communicationOccupiedColor });
});
}
if (this.rightAxle) {
this.rightAxle.setStyle({
stroke: this.style.Section.line.communicationOccupiedColor,
fill:this.style.Section.line.communicationOccupiedColor
});
}
} }
/** 非通信车占用状态 03*/ /** 非通信车占用状态 03*/
unCommunicationOccupied() { unCommunicationOccupied() {
if (this.section) { if (this.line) {
this.section.setStyle({ this.line.setStyle({
stroke: this.style.Section.line.unCommunicationOccupiedColor, stroke: this.style.Section.line.unCommunicationOccupiedColor,
lineWidth: this.style.Section.line.width + this.style.Section.line.beyondWidth lineWidth: this.style.Section.line.width + this.style.Section.line.beyondWidth
}); });
} }
if (this.leftAxle) { this.axle && this.axle.setStyle({
this.leftAxle.setStyle({ stroke: this.style.Section.line.unCommunicationOccupiedColor,
stroke: this.style.Section.line.unCommunicationOccupiedColor, fill:this.style.Section.line.unCommunicationOccupiedColor
fill:this.style.Section.line.unCommunicationOccupiedColor });
});
}
if (this.rightAxle) {
this.rightAxle.setStyle({
stroke: this.style.Section.line.unCommunicationOccupiedColor,
fill:this.style.Section.line.unCommunicationOccupiedColor
});
}
} }
/** ARB故障 */ /** ARB故障 */
invalid() { invalid() {
this.section && this.section.setStyle({ this.line && this.line.setStyle({
stroke: this.style.Section.line.invalidColor, stroke: this.style.Section.line.invalidColor,
lineWidth: this.style.Section.line.width + this.style.Section.line.beyondWidth lineWidth: this.style.Section.line.width + this.style.Section.line.beyondWidth
}); });
} }
/** 进路锁闭 04*/ /** 进路锁闭 04*/
routeLock() { routeLock() {
if (this.section) { if (this.line) {
this.section.setStyle({ this.line.setStyle({
stroke: this.style.Section.line.routeLockColor, stroke: this.style.Section.line.routeLockColor,
lineWidth: this.style.Section.line.width + this.style.Section.line.beyondWidth lineWidth: this.style.Section.line.width + this.style.Section.line.beyondWidth
}); });
@ -663,16 +158,16 @@ export default class Section extends Group {
/** 封锁 06*/ /** 封锁 06*/
block() { block() {
if (this.style.Section.block.special) { if (this.sectionBlock) {
this.sectionBlock && this.sectionBlock.show(); this.sectionBlock.show();
} else { } else {
this.section && this.section.setStyle({ this.line && this.line.setStyle({
stroke: this.style.Section.line.blockColor, stroke: this.style.Section.line.blockColor,
lineWidth: this.style.Section.line.width + this.style.Section.line.beyondWidth lineWidth: this.style.Section.line.width + this.style.Section.line.beyondWidth
}); });
} }
if (this.style.Section.block.blockGlint && this.section) { if (this.style.Section.block && this.style.Section.block.blockGlint && this.line) {
this.section.animateStyle(true, [ this.line.animateStyle(true, [
{ time: 1000, styles: { stroke: this.style.backgroundColor } }, { time: 1000, styles: { stroke: this.style.backgroundColor } },
{ time: 2000, styles: { stroke: this.style.Section.line.blockColor } } { time: 2000, styles: { stroke: this.style.Section.line.blockColor } }
]); ]);
@ -681,8 +176,8 @@ export default class Section extends Group {
/** 故障锁闭 05*/ /** 故障锁闭 05*/
faultLock() { faultLock() {
if (this.section) { if (this.line) {
this.section.setStyle({ this.line.setStyle({
stroke: this.style.Section.line.faultLockColor, stroke: this.style.Section.line.faultLockColor,
lineWidth: this.style.Section.line.width + this.style.Section.line.beyondWidth lineWidth: this.style.Section.line.width + this.style.Section.line.beyondWidth
}); });
@ -691,8 +186,8 @@ export default class Section extends Group {
/** atc切除状态 07*/ /** atc切除状态 07*/
atcExcision() { atcExcision() {
if (this.section) { if (this.line) {
this.section.setStyle({ this.line.setStyle({
stroke: this.style.Section.line.atcExcisionColor, stroke: this.style.Section.line.atcExcisionColor,
lineWidth: this.style.Section.line.width + this.style.Section.line.beyondWidth lineWidth: this.style.Section.line.width + this.style.Section.line.beyondWidth
}); });
@ -701,9 +196,9 @@ export default class Section extends Group {
/** ats切除状态 08*/ /** ats切除状态 08*/
atsExcision() { atsExcision() {
if (this.section) { if (this.line) {
this.atcExcision(); this.atcExcision();
this.section.animateStyle(true, [ this.line.animateStyle(true, [
{ time: 1000, styles: { stroke: this.style.backgroundColor } }, { time: 1000, styles: { stroke: this.style.backgroundColor } },
{ time: 2000, styles: { stroke: this.style.Section.line.atsExcisionColor, lineWidth: this.style.Section.line.width + this.style.Section.line.beyondWidth } } { time: 2000, styles: { stroke: this.style.Section.line.atsExcisionColor, lineWidth: this.style.Section.line.width + this.style.Section.line.beyondWidth } }
]); ]);
@ -712,39 +207,19 @@ export default class Section extends Group {
/** 保护区段锁闭 09*/ /** 保护区段锁闭 09*/
protectiveLock() { protectiveLock() {
if (this.section) { if (this.line) {
this.section.setStyle({ this.line.setStyle({
stroke: this.style.Section.line.protectiveLockColor, stroke: this.style.Section.line.protectiveLockColor,
lineWidth: this.style.Section.line.width + this.style.Section.line.beyondWidth lineWidth: this.style.Section.line.width + this.style.Section.line.beyondWidth
}); });
} }
} }
// /** 延时释放*/
// async timeRelease() {
// this.section.setStyle({
// stroke: this.style.Section.line.routeLockColor,
// lineWidth: this.style.Section.line.width + this.style.Section.line.beyondWidth
// });
// if (this.release) {
// this.release.show();
// this.release.setStyle({
// stroke: this.style.Section.line.routeLockColor,
// lineWidth: this.style.Section.line.width + this.style.Section.line.beyondWidth
// });
// this.release.animateStyle(true, [
// { time: 1000, styles: { stroke: this.style.Section.line.routeLockColor } },
// { time: 2000, styles: { stroke: this.style.Section.line.timeReleaseColor } }
// ]);
// }
// }
/** 区段切除*/ /** 区段切除*/
sectionCutOff() { sectionCutOff() {
const lineWidth = this.style.Section.line.width + (this.model.status != '01' ? this.style.Section.line.beyondWidth : 0); const lineWidth = this.style.Section.line.width + (this.model.status != '01' ? this.style.Section.line.beyondWidth : 0);
if (this.section) { if (this.line) {
this.section.animateStyle(true, [ this.line.animateStyle(true, [
{ time: 0, styles: { lineWidth: lineWidth } }, { time: 0, styles: { lineWidth: lineWidth } },
{ time: 1000, styles: { stroke: this.style.backgroundColor } }, { time: 1000, styles: { stroke: this.style.backgroundColor } },
{ time: 2000, styles: { lineWidth: lineWidth } } { time: 2000, styles: { lineWidth: lineWidth } }
@ -754,54 +229,14 @@ export default class Section extends Group {
/** 设置限速*/ /** 设置限速*/
setSpeedUpperLimit() { setSpeedUpperLimit() {
if (this.style.Section.line.speedLimitColor) { if (this.style.Section.line.speedLimitColor) { // 宁波三号线 独有
this.section.setStyle({stroke: this.style.Section.line.speedLimitColor}); this.line.setStyle({stroke: this.style.Section.line.speedLimitColor});
} else if (this.section) { } else {
this.creatSpeedLimit(); this.speedLimit && this.speedLimit.show();
this.speedLimitName && this.speedLimitName.show();
} }
} }
// /** 计轴预复位 12*/
// axleReset() {
// if (this.release) {
// this.release.show();
// this.release && this.release.setStyle({
// stroke: this.style.Section.axle.resetColor,
// fill: 'green'
// });
// }
// }
// /** 计轴失效 13*/
// alxeFailure() {
// if (this.section) {
// this.section.setStyle({
// stroke: this.style.Section.axle.Failure,
// lineWidth: this.style.Section.line.width + this.style.Section.line.beyondWidth
// });
// }
// }
showRemainTime(number) { // 区段延时保护倒计时显示
this.releaseName && this.releaseName.show();
// this.releaseName && this.releaseName.setStyle({ text: number });
let pointX = this.model.points[0].x + 45;
let pointY = this.model.points[0].y;
if (!this.model.timeRight) {
pointX = this.model.points[this.model.points.length - 1].x - 45;
pointY = this.model.points[this.model.points.length - 1].y;
}
this.releaseName && this.releaseName.attr({
style: {
text: number
},
shape: {
x: pointX,
y: pointY - this.style.Section.line.width * 2
}
});
}
/** 设置状态*/ /** 设置状态*/
setState(model, flag = false) { setState(model, flag = false) {
if (!this.isShowShape) return; if (!this.isShowShape) return;
@ -811,12 +246,12 @@ export default class Section extends Group {
const switchModel = Vue.prototype.$jlmap.mapDevice[model.relSwitchCode]; const switchModel = Vue.prototype.$jlmap.mapDevice[model.relSwitchCode];
if (switchModel.normalPosition != 0) { // 定位情况 if (switchModel.normalPosition != 0) { // 定位情况
const sectionC = Vue.prototype.$jlmap.mapDevice[switchModel.sectionCCode]; const sectionC = Vue.prototype.$jlmap.mapDevice[switchModel.sectionCCode];
sectionC && sectionC.instance && sectionC.instance.section.setStyle({ stroke: this.style.Switch.sectionAction.spareColor }); sectionC && sectionC.instance && sectionC.instance.line.setStyle({ stroke: this.style.Switch.sectionAction.spareColor });
const sectionB = Vue.prototype.$jlmap.mapDevice[switchModel.sectionBCode]; const sectionB = Vue.prototype.$jlmap.mapDevice[switchModel.sectionBCode];
sectionB && sectionB.instance && sectionB.instance.setState(sectionB, true); sectionB && sectionB.instance && sectionB.instance.setState(sectionB, true);
} else if (switchModel.normalPosition == 0) { // 反位情况 } else if (switchModel.normalPosition == 0) { // 反位情况
const sectionB = Vue.prototype.$jlmap.mapDevice[switchModel.sectionBCode]; const sectionB = Vue.prototype.$jlmap.mapDevice[switchModel.sectionBCode];
sectionB && sectionB.instance && sectionB.instance.section.setStyle({ stroke: this.style.Switch.sectionAction.spareColor }); sectionB && sectionB.instance && sectionB.instance.line.setStyle({ stroke: this.style.Switch.sectionAction.spareColor });
const sectionC = Vue.prototype.$jlmap.mapDevice[switchModel.sectionCCode]; const sectionC = Vue.prototype.$jlmap.mapDevice[switchModel.sectionCCode];
sectionC && sectionC.instance && sectionC.instance.setState(sectionC, true); sectionC && sectionC.instance && sectionC.instance.setState(sectionC, true);
} }
@ -841,9 +276,6 @@ export default class Section extends Group {
// 区段计轴预复位状态 (未处理) // 区段计轴预复位状态 (未处理)
// 区段故障锁闭 // 区段故障锁闭
model.fault && this.faultLock(); model.fault && this.faultLock();
// 区段延时保护倒计时显示
// model.remainTime = 10;
model.remainTime && this.showRemainTime(model.remainTime);
/** 道岔区段更新岔心颜色 */ /** 道岔区段更新岔心颜色 */
if (model.type === '03' && model.switch) { if (model.type === '03' && model.switch) {
@ -858,13 +290,8 @@ export default class Section extends Group {
getShapeTipPoint() { getShapeTipPoint() {
let rect = this.getBoundingRect(); let rect = this.getBoundingRect();
const distance = this.style.Section.line.width / 2; const distance = this.style.Section.line.width / 2;
if (this.section) { if (this.line) {
rect = this.section.getBoundingRect(); rect = this.line.getBoundingRect();
// if (this.model.type !== '02' && this.model.nameShow) {
// if (this.model.trainPosType == '01') {
// distance = distance + this.style.Section.text.distance + this.style.Section.text.fontSize;
// }
// }
} }
return { return {
x: rect.x + rect.width / 2, x: rect.x + rect.width / 2,
@ -873,10 +300,10 @@ export default class Section extends Group {
} }
getBoundingRect() { getBoundingRect() {
if (this.section) { if (this.line && this.line.getBoundingRect()) {
return this.section.getBoundingRect().clone(); return this.line.getBoundingRect().clone();
} else if (this.name) { } else if (this.name && this.name.getBoundingRect()) {
return this.name.getBoundingRect().clone(); return this.name.getBoundingRect();
} }
} }
@ -890,10 +317,10 @@ export default class Section extends Group {
const path = window.location.href; const path = window.location.href;
if (path.includes('/map/draw')) { if (path.includes('/map/draw')) {
this.on('mouseout', () => { this.on('mouseout', () => {
!this.selectedType && !this.selected && this.section && this.section.setStyle({ stroke: this.style.Section.line.spareColor, lineWidth: this.style.Section.line.width }); !this.selectedType && !this.selected && this.line && this.line.setStyle({ stroke: this.style.Section.line.spareColor, lineWidth: this.style.Section.line.width });
}); });
this.on('mouseover', () => { this.on('mouseover', () => {
!this.selectedType && this.section && this.section.setStyle({ stroke: '#fbfbfb', lineWidth: this.style.Section.line.width - 0.2 }); !this.selectedType && this.line && this.line.setStyle({ stroke: '#fbfbfb', lineWidth: this.style.Section.line.width - 0.2 });
}); });
} }
} }
@ -901,10 +328,10 @@ export default class Section extends Group {
drawSelected(selected) { drawSelected(selected) {
this.selected = selected; this.selected = selected;
if (selected) { if (selected) {
if (this.style.Section.line.isActiveShow) { // 哈尔滨线路专属显示 if (this.lineBorder) { // 哈尔滨线路专属显示
this.lineBorder && this.lineBorder.setStyle({ lineWidth: this.style.Section.line.width + 3 }); this.lineBorder.setStyle({ lineWidth: this.style.Section.line.width + 3 });
} else { } else {
!this.selectedType && this.section && this.section.setStyle({ stroke: '#fbfbfb' }); !this.selectedType && this.line && this.line.setStyle({ stroke: '#fbfbfb' });
} }
} else { } else {
this.lineBorder && this.lineBorder.setStyle({ lineWidth: 0 }); this.lineBorder && this.lineBorder.setStyle({ lineWidth: 0 });
@ -916,9 +343,9 @@ export default class Section extends Group {
return; return;
} }
if (selected && type) { if (selected && type) {
this.section && this.section.setStyle({ stroke: drawSectionStyle[type] }); this.line && this.line.setStyle({ stroke: drawSectionStyle[type] });
} else { } else {
this.section && this.section.setStyle({ stroke: this.style.Section.line.spareColor }); this.line && this.line.setStyle({ stroke: this.style.Section.line.spareColor });
} }
this.selectedType = type; this.selectedType = type;
} }
@ -928,7 +355,7 @@ export default class Section extends Group {
} }
mouseover() { mouseover() {
this.section && this.section.setStyle({ stroke: 'rgba(255,255,255,0.8)' }); this.line && this.line.setStyle({ stroke: 'rgba(255,255,255,0.8)' });
} }
setShowMode() { } setShowMode() { }
setShowStation(stationCode) { setShowStation(stationCode) {
@ -938,25 +365,22 @@ export default class Section extends Group {
}); });
this.isShowShape = true; this.isShowShape = true;
if (this.name) { if (this.name) {
if (this.model.type == '01') { this.model.nameShow ? this.name.show() : this.name.hide();
this.model.nameShow && this.style.Section.text.show ? this.name.show() : this.name.hide(); }
} else if (this.model.type == '02') { if (this.logicText) {
this.model.nameShow && this.style.Section.logicText.show ? this.name.show() : this.name.hide(); this.model.nameShow ? this.logicText.show() : this.logicText.hide();
} else if (this.model.type == '04') {
this.model.nameShow ? this.name.show() : this.name.hide();
}
} }
if (this.transferTrackText) { if (this.transferTrackText) {
this.model.transferTrackNameShow && this.style.Section.transferText.show ? this.transferTrackText.show() : this.transferTrackText.hide(); this.model.transferTrackNameShow ? this.transferTrackText.show() : this.transferTrackText.hide();
} }
if (this.standTrackText) { if (this.standTrackText) {
this.model.standTrackNameShow && this.style.Section.standText.show ? this.standTrackText.show() : this.standTrackText.hide(); this.model.standTrackNameShow ? this.standTrackText.show() : this.standTrackText.hide();
} }
if (this.destinationText) { if (this.destinationText) {
this.model.destinationNameShow && this.style.Section.destinationText.show ? this.destinationText.show() : this.destinationText.hide(); this.model.destinationNameShow ? this.destinationText.show() : this.destinationText.hide();
} }
if (this.reentryTrackText) { if (this.reentryTrackText) {
this.model.reentryTrackNameShow && this.style.Section.reentryText.show ? this.reentryTrackText.show() : this.reentryTrackText.hide(); this.model.reentryTrackNameShow ? this.reentryTrackText.show() : this.reentryTrackText.hide();
} }
this.setState(this.model); this.setState(this.model);

View File

@ -214,17 +214,17 @@ export default {
} }
// //
if (elem.isStandTrack) { if (elem.standTrack) {
standTrackNameShow = this.nameLevels.indexOf(2) !== -1; standTrackNameShow = this.nameLevels.indexOf(2) !== -1;
} }
// //
if (elem.isReentryTrack) { if (elem.reentryTrack) {
reentryTrackNameShow = this.nameLevels.indexOf(4) !== -1; reentryTrackNameShow = this.nameLevels.indexOf(4) !== -1;
} }
// //
if (elem.isTransferTrack) { if (elem.transferTrack) {
transferTrackNameShow = this.nameLevels.indexOf(6) !== -1; transferTrackNameShow = this.nameLevels.indexOf(6) !== -1;
} }

View File

@ -214,17 +214,17 @@ export default {
} }
// //
if (elem.isStandTrack) { if (elem.standTrack) {
standTrackNameShow = this.nameLevels.indexOf(2) !== -1; standTrackNameShow = this.nameLevels.indexOf(2) !== -1;
} }
// //
if (elem.isReentryTrack) { if (elem.reentryTrack) {
reentryTrackNameShow = this.nameLevels.indexOf(4) !== -1; reentryTrackNameShow = this.nameLevels.indexOf(4) !== -1;
} }
// //
if (elem.isTransferTrack) { if (elem.transferTrack) {
transferTrackNameShow = this.nameLevels.indexOf(6) !== -1; transferTrackNameShow = this.nameLevels.indexOf(6) !== -1;
} }