diff --git a/src/jmap/config/deviceStyle.js b/src/jmap/config/deviceStyle.js index b5babe4f6..adef27cac 100644 --- a/src/jmap/config/deviceStyle.js +++ b/src/jmap/config/deviceStyle.js @@ -1,8 +1,8 @@ const mapDeviceStyle = { // '01': 'chengdu_04', '02': 'fuzhou_01', - // '03': 'bejing_01', - '03': 'chengdu_03', + '03': 'bejing_01', + // '03': 'chengdu_03', '05': 'batong_01' // 暂时没有画北京八通线 }; diff --git a/src/jmap/config/skinStyle/bejing_01.js b/src/jmap/config/skinStyle/bejing_01.js index d65068802..37662321d 100644 --- a/src/jmap/config/skinStyle/bejing_01.js +++ b/src/jmap/config/skinStyle/bejing_01.js @@ -12,16 +12,62 @@ class SkinStyle extends defaultStyle { }; this[deviceType.Section] = { - text: { // 区段文字属性 - distance: 2, // 文字离区段距离 - fontSize: 10, // 字体大小 - fontFormat: 'consolas', // 字体族类 - fontColor: '#C0C0C0', // 字体颜色 - destinationTextColor: 'yellow', // 目的地颜色 - textAlign: 'center', // 水平对齐方式 - textPosition: 'inside', // 文字位置 - textVerticalAlign: 'middle', // 文字垂直对齐方式 - position: 1 // 区段名称位置 1 上面 -1 下面 0 默认 + text: { + position: -1, // 区段名称位置 1 上面 -1 下面 0 对称 + distance: 11, // 文字离区段距离 + fontSize: 11, // 字体大小 + fontColor: '#FFFFFF', // 字体颜色 + textAlign: 'center', // 水平对齐方式 + textPosition: 'inside', // 文字位置 + textVerticalAlign: 'middle' // 文字垂直对齐方式 + }, + logicText: { + position: -1, // 区段名称位置 1 上面 -1 下面 0 对称 + distance: 11, // 文字离区段距离 + fontSize: 11, // 字体大小 + fontColor: '#FFFFFF', // 字体颜色 + textAlign: 'center', // 水平对齐方式 + textPosition: 'inside', // 文字位置 + textVerticalAlign: 'middle' // 文字垂直对齐方式 + }, + standText: { + opposite: true, // 对称相反 + position: 1, // 区段名称位置 1 上面 -1 下面 0 对称 + distance: 11, // 文字离区段距离 + fontSize: 11, // 字体大小 + fontColor: '#FFFFFF', // 字体颜色 + textAlign: 'center', // 水平对齐方式 + textPosition: 'inside', // 文字位置 + textVerticalAlign: 'middle' // 文字垂直对齐方式 + }, + reentryText: { + opposite: true, // 对称相反 + position: 1, // 区段名称位置 1 上面 -1 下面 0 对称 + distance: 22, // 文字离区段距离 + fontSize: 11, // 字体大小 + fontColor: '#FFFFFF', // 字体颜色 + textAlign: 'center', // 水平对齐方式 + textPosition: 'inside', // 文字位置 + textVerticalAlign: 'middle' // 文字垂直对齐方式 + }, + transferText: { + opposite: true, // 对称相反 + position: 1, // 区段名称位置 1 上面 -1 下面 0 对称 + distance: 33, // 文字离区段距离 + fontSize: 11, // 字体大小 + fontColor: '#FFFFFF', // 字体颜色 + textAlign: 'center', // 水平对齐方式 + textPosition: 'inside', // 文字位置 + textVerticalAlign: 'middle' // 文字垂直对齐方式 + }, + destinationText: { + position: 1, // 区段名称位置 1 上面 -1 下面 0 对称 + distance: 11, // 文字离区段距离 + fontSize: 11, // 字体大小 + fontColor: 'yellow', // 字体颜色 + textAlign: 'center', // 水平对齐方式 + textPosition: 'inside', // 文字位置 + textVerticalAlign: 'middle' // 文字垂直对齐方式 }, mouseOverStyle: { borderColor: '#fff', @@ -78,7 +124,7 @@ class SkinStyle extends defaultStyle { distance: 3, // 文字和灯杆的距离 isNoRotation: true, // 是否禁止旋转 isAlignCenter: false, // 信号字体对其方式 - fontSize: 10, // 信号机名称字体大小 + fontSize: 11, // 信号机名称字体大小 defaultColor: '#C0C0C0', // 信号灯字体默认色 blockColor: '#EF0C08', // 信号灯字体锁定颜色 checkColor: '#00FF00' // 信号字体 diff --git a/src/jmap/config/skinStyle/chengdu_03.js b/src/jmap/config/skinStyle/chengdu_03.js index 703d4a5f6..0c68dbd39 100644 --- a/src/jmap/config/skinStyle/chengdu_03.js +++ b/src/jmap/config/skinStyle/chengdu_03.js @@ -12,16 +12,59 @@ class SkinStyle extends defaultStyle { }; this[deviceType.Section] = { - text: { // 区段文字属性 - distance: 1, // 文字离区段距离 + text: { + position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 + distance: 10, // 文字离区段距离 fontSize: 12, // 字体大小 - fontFormat: 'consolas', // 字体族类 fontColor: '#FFFFFF', // 字体颜色 - destinationTextColor: 'yellow', // 目的地颜色 textAlign: 'center', // 水平对齐方式 textPosition: 'inside', // 文字位置 - textVerticalAlign: 'middle', // 文字垂直对齐方式 - position: 1 // 区段名称位置 1 上面 -1 下面 0 默认 + textVerticalAlign: 'middle' // 文字垂直对齐方式 + }, + logicText: { + position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 + distance: 12, // 文字离区段距离 + fontSize: 11, // 字体大小 + fontColor: '#FFFFFF', // 字体颜色 + textAlign: 'center', // 水平对齐方式 + textPosition: 'inside', // 文字位置 + textVerticalAlign: 'middle' // 文字垂直对齐方式 + }, + standText: { + position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 + distance: 24, // 文字离区段距离 + fontSize: 11, // 字体大小 + fontColor: '#FFFFFF', // 字体颜色 + textAlign: 'center', // 水平对齐方式 + textPosition: 'inside', // 文字位置 + textVerticalAlign: 'middle' // 文字垂直对齐方式 + }, + reentryText: { + position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 + distance: 36, // 文字离区段距离 + fontSize: 11, // 字体大小 + fontColor: '#FFFFFF', // 字体颜色 + textAlign: 'center', // 水平对齐方式 + textPosition: 'inside', // 文字位置 + textVerticalAlign: 'middle' // 文字垂直对齐方式 + }, + transferText: { + position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 + distance: 36, // 文字离区段距离 + fontSize: 11, // 字体大小 + fontColor: '#FFFFFF', // 字体颜色 + textAlign: 'center', // 水平对齐方式 + textPosition: 'inside', // 文字位置 + textVerticalAlign: 'middle' // 文字垂直对齐方式 + }, + destinationText: { + position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 + distance: 12, // 文字离区段距离 + fontSize: 11, // 字体大小 + fontColor: 'yellow', // 字体颜色 + textAlign: 'center', // 水平对齐方式 + textPosition: 'inside', // 文字位置 + textVerticalAlign: 'middle' // 文字垂直对齐方式 }, line: { width: 5, // 区段宽度 @@ -73,7 +116,7 @@ class SkinStyle extends defaultStyle { distance: 3, // 文字和灯杆的距离 isNoRotation: true, // 是否禁止旋转 isAlignCenter: false, // 信号字体对其方式 - fontSize: 12, // 信号机名称字体大小 + fontSize: 11, // 信号机名称字体大小 defaultColor: '#FFFFFF', // 信号灯字体默认色 blockColor: '#EF0C08', // 信号灯字体锁定颜色 checkColor: '#00FF00' // 信号保护区段检查颜色 @@ -107,7 +150,7 @@ class SkinStyle extends defaultStyle { delay: { direction: false, // 延时解锁方向 offset: { x: -5, y: 0}, // 延时解锁偏移量 - fontSize: 12, // 延迟解锁字体大小 + fontSize: 11, // 延迟解锁字体大小 fontColor: '#C00808' // 延迟解锁颜色 }, @@ -181,7 +224,7 @@ class SkinStyle extends defaultStyle { this[deviceType.StationControl] = { text: { distance: 2, // 灯和文字之间的距离 - fontSize: 12, // 字体大小 + fontSize: 11, // 字体大小 fontFormat: 'consolas', // 字体格式 fontColor: '#ffffff', // 字体颜色 fontWeight: 'normal', // 字体粗细 @@ -226,7 +269,7 @@ class SkinStyle extends defaultStyle { this[deviceType.Switch] = { text: { distance: 2, // 道岔名称与区段距离 - fontSize: 12, // 字体大小 + fontSize: 11, // 字体大小 fontWeight: 'normal', // 字体粗细 borderColor: '#FE0000', // 道岔边框颜色 lossColor: '#C00808', // 道岔失去颜色 @@ -241,7 +284,7 @@ class SkinStyle extends defaultStyle { this[deviceType.LcControl] = { text: { - fontSize: 12, // 字体大小 + fontSize: 11, // 字体大小 distance: 5 // 灯跟文字距离 }, lamp: { @@ -252,7 +295,7 @@ class SkinStyle extends defaultStyle { this[deviceType.ZcControl] = { text: { - fontSize: 12, // 字体大小 + fontSize: 11, // 字体大小 distance: 5 // 灯跟文字距离 }, lamp: { @@ -263,7 +306,7 @@ class SkinStyle extends defaultStyle { this[deviceType.LimitControl] = { text: { - fontSize: 12, // 字体大小 + fontSize: 11, // 字体大小 distance: 5 // 灯跟文字距离 }, lamp: { @@ -331,7 +374,7 @@ class SkinStyle extends defaultStyle { /** HSDA上边距离 */ upPaddingHSDA: 4, /** 列车字号*/ - trainTextFontSize: 12, + trainTextFontSize: 11, /** 目的地状态 01准点 02早点 03晚点 04头码车 */ destinationStatus: [ {status: '01', showColor: '#FFFFFF'}, diff --git a/src/jmap/config/skinStyle/fuzhou_01.js b/src/jmap/config/skinStyle/fuzhou_01.js index eb3141c78..ee3435c6c 100644 --- a/src/jmap/config/skinStyle/fuzhou_01.js +++ b/src/jmap/config/skinStyle/fuzhou_01.js @@ -12,15 +12,63 @@ class SkinStyle extends defaultStyle { }; this[deviceType.Section] = { - text: { // 区段文字属性 - distance: 2, // 文字离区段距离 - fontSize: 10, // 字体大小 - fontColor: '#FFFFFF', // 字体颜色 - destinationTextColor: 'yellow', // 目的地颜色 - textAlign: 'center', // 水平对齐方式 - textPosition: 'inside', // 文字位置 - textVerticalAlign: 'middle', // 文字垂直对齐方式 - position: 0 // 区段名称位置 1 上行 -1 下面 0 默认 + text: { + position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 + distance: 18, // 文字离区段距离 + fontSize: 10, // 字体大小 + fontColor: '#FFFFFF', // 字体颜色 + textAlign: 'center', // 水平对齐方式 + textPosition: 'inside', // 文字位置 + textVerticalAlign: 'middle' // 文字垂直对齐方式 + }, + logicText: { + position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 + distance: 8, // 文字离区段距离 + fontSize: 8, // 字体大小 + fontColor: '#FFFFFF', // 字体颜色 + textAlign: 'center', // 水平对齐方式 + textPosition: 'inside', // 文字位置 + textVerticalAlign: 'middle' // 文字垂直对齐方式 + }, + standText: { + opposite: true, // 对称相反 + position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 + distance: 10, // 文字离区段距离 + fontSize: 10, // 字体大小 + fontColor: '#FFFFFF', // 字体颜色 + textAlign: 'center', // 水平对齐方式 + textPosition: 'inside', // 文字位置 + textVerticalAlign: 'middle' // 文字垂直对齐方式 + }, + reentryText: { + opposite: true, // 对称相反 + position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 + distance: 20, // 文字离区段距离 + fontSize: 10, // 字体大小 + fontColor: '#FFFFFF', // 字体颜色 + textAlign: 'center', // 水平对齐方式 + textPosition: 'inside', // 文字位置 + textVerticalAlign: 'middle' // 文字垂直对齐方式 + }, + transferText: { + opposite: true, // 对称相反 + position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 + distance: 30, // 文字离区段距离 + fontSize: 10, // 字体大小 + fontColor: '#FFFFFF', // 字体颜色 + textAlign: 'center', // 水平对齐方式 + textPosition: 'inside', // 文字位置 + textVerticalAlign: 'middle' // 文字垂直对齐方式 + }, + destinationText: { + opposite: true, // 对称相反 + position: 0, // 区段名称位置 1 上面 -1 下面 0 对称 + distance: 10, // 文字离区段距离 + fontSize: 10, // 字体大小 + fontColor: 'yellow', // 字体颜色 + textAlign: 'center', // 水平对齐方式 + textPosition: 'inside', // 文字位置 + textVerticalAlign: 'middle' // 文字垂直对齐方式 }, line: { width: 5, // 区段宽度 diff --git a/src/jmap/shape/Section/index.js b/src/jmap/shape/Section/index.js index 5c98834fe..65c5de5f8 100644 --- a/src/jmap/shape/Section/index.js +++ b/src/jmap/shape/Section/index.js @@ -170,87 +170,76 @@ export default class Section extends Group { if (model && style) { // 计算区段坐标位置 - 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 + model.namePosition.x; - 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 + model.namePosition.y; + 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 (model.nameShow) { - let tempx = x; - let tempy = y; - - if (style.Section.text.position == 1) { - tempy = tempy - style.Section.text.fontSize; - } else if (style.Section.text.position == -1) { - tempy = tempy + style.Section.text.fontSize; - } else if (style.Section.text.position == 0) { - // 根据列车上下行进行坐标偏移 - const traingle = new JTriangle(model.points[0], model.points[model.points.length - 1]); - if (model.trainPosType === '01') { - tempy -= (style.Section.line.width * 1.5); - if (model.type === '01') { - tempy += traingle.getCos(style.Section.text.fontSize * 0.8 + style.Section.text.distance) - style.Section.text.fontSize * 2; - } - } else { - tempy += (style.Section.line.width * 1.5); - if (model.type === '01') { - tempy -= traingle.getCos(style.Section.text.fontSize * 0.8 + style.Section.text.distance) - style.Section.text.fontSize * 2; - } - } - } - - if (model.type !== '03') { - // 计算文字和物理区段的距离 - // 如果不是逻辑区段,让名称和区段保持点距离 - const traingle = new JTriangle(model.points[0], model.points[model.points.length - 1]); - if (model.type === '01') { - tempx += traingle.getSin(style.Section.text.fontSize * 0.8 + style.Section.text.distance); - } - } - // 创建区段名称 - const fontSize = model.type == '02' ? style.Section.text.fontSize + 2: style.Section.text.fontSize; - this.name = new ETextName({ - zlevel: this.zlevel, - z: this.z + 2, - style: this.style, - silent: false, - x: tempx, - y: tempy, - fontWeight: 'normal', - fontSize: fontSize, - fontFamily: style.textFontFormat, - text: model.name, - textFill: style.Section.text.fontColor, - textAlign: style.Section.text.textAlign, - textPosition: style.Section.text.textPosition, - textVerticalAlign: style.Section.text.textVerticalAlign - }); + if (model.type == '02') { + const opposite = style.Section.logicText.opposite ? -1: 1; + const tempx = x + traingle.getSin(style.Section.logicText.distance); + const tempy = y + traingle.getCos(style.Section.logicText.distance) * (style.Section.logicText.position || opposite*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: 'normal', + fontSize: style.Section.logicText.fontSize, + fontFamily: style.textFontFormat, + text: model.name, + textFill: style.Section.logicText.fontColor, + textAlign: style.Section.logicText.textAlign, + textPosition: style.Section.logicText.textPosition, + textVerticalAlign: style.Section.logicText.textVerticalAlign + }); + } else { + const opposite = style.Section.text.opposite ? -1: 1; + const tempx = x + traingle.getSin(style.Section.text.distance); + const tempy = y + traingle.getCos(style.Section.text.distance) * (style.Section.text.position || opposite*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: 'normal', + fontSize: style.Section.text.fontSize, + fontFamily: style.textFontFormat, + 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); } /** 站台轨名称*/ if (model.isStandTrack && model.standTrackNameShow) { - let tempx = x; - let tempy = y; - - // 计算文字和物理区段的距离 - const traingle = new JTriangle(model.points[0], model.points[model.points.length - 1]); - tempx += traingle.getSin(style.Section.text.distance); - tempy += traingle.getCos(style.Section.text.distance); - - // 创建站台轨名称 + const opposite = style.Section.standText.opposite ? -1: 1; + const tempx = x + traingle.getSin(style.Section.standText.distance); + const tempy = y + traingle.getCos(style.Section.standText.distance) * (style.Section.standText.position || opposite*drict); this.standTrackText = new ETextName({ zlevel: this.zlevel, z: this.z + 2, - x: tempx + model.standTrackNamePosition.x, - y: tempy + model.standTrackNamePosition.y, - fontWeight: 'bold', - fontSize: style.Section.text.fontSize, + silent: false, + x: tempx, + y: tempy, + fontWeight: 'normal', + fontSize: style.Section.standText.fontSize, fontFamily: style.textFontFormat, text: model.standTrackName, - textFill: style.Section.text.fontColor, - textAlign: style.Section.text.textAlign, - textPosition: style.Section.text.textPosition, - style: this.style + textFill: style.Section.standText.fontColor, + textAlign: style.Section.standText.textAlign, + textPosition: style.Section.standText.textPosition, + textVerticalAlign: style.Section.standText.textVerticalAlign }); // 添加视图 this.add(this.standTrackText); @@ -258,20 +247,23 @@ export default class Section extends Group { /** 折返轨名称*/ if (model.isReentryTrack && model.reentryTrackNameShow) { - // 创建折返轨名称 + const opposite = style.Section.reentryText.opposite ? -1: 1; + const tempx = x + traingle.getSin(style.Section.reentryText.distance); + const tempy = y + traingle.getCos(style.Section.reentryText.distance) * (style.Section.reentryText.position || opposite*drict); this.reentryTrackText = new ETextName({ zlevel: this.zlevel, z: this.z + 2, - x: x + model.reentryTrackNamePosition.x, - y: y + model.reentryTrackNamePosition.y + style.Section.text.distance + style.Section.text.fontSize, - fontWeight: 'bold', - fontSize: style.Section.text.fontSize, + silent: false, + x: tempx, + y: tempy, + fontWeight: 'normal', + fontSize: style.Section.reentryText.fontSize, fontFamily: style.textFontFormat, text: model.reentryTrackName, - textFill: style.Section.text.fontColor, - textAlign: style.Section.text.textAlign, - textPosition: style.Section.text.textPosition, - style: this.style + textFill: style.Section.reentryText.fontColor, + textAlign: style.Section.reentryText.textAlign, + textPosition: style.Section.reentryText.textPosition, + textVerticalAlign: style.Section.reentryText.textVerticalAlign }); // 添加视图 this.add(this.reentryTrackText); @@ -279,20 +271,23 @@ export default class Section extends Group { /** 转换轨名称*/ if (model.isTransferTrack && model.transferTrackNameShow) { - // 转换轨名称 + const opposite = style.Section.transferText.opposite ? -1: 1; + const tempx = x + traingle.getSin(style.Section.transferText.distance); + const tempy = y + traingle.getCos(style.Section.transferText.distance) * (style.Section.transferText.position || opposite*drict); this.transferTrackText = new ETextName({ zlevel: this.zlevel, z: this.z + 2, - x: x + model.transferTrackNamePosition.x, - y: y + model.transferTrackNamePosition.y + style.Section.text.distance + style.Section.text.fontSize * 2, - fontWeight: 'bold', - fontSize: style.Section.text.fontSize, + silent: false, + x: tempx, + y: tempy, + fontWeight: 'normal', + fontSize: style.Section.transferText.fontSize, fontFamily: style.textFontFormat, text: model.transferTrackName, - textFill: style.Section.text.fontColor, - textAlign: style.Section.text.textAlign, - textPosition: style.Section.text.textPosition, - style: this.style + textFill: style.Section.transferText.fontColor, + textAlign: style.Section.transferText.textAlign, + textPosition: style.Section.transferText.textPosition, + textVerticalAlign: style.Section.transferText.textVerticalAlign }); // 添加视图 this.add(this.transferTrackText); @@ -300,20 +295,23 @@ export default class Section extends Group { /** 目的码名称*/ if (model.destinationCode && model.destinationCodeShow) { - // 转换轨名称 + const opposite = style.Section.destinationText.opposite ? -1: 1; + const tempx = x + traingle.getSin(style.Section.destinationText.distance); + const tempy = y + traingle.getCos(style.Section.destinationText.distance) * (style.Section.destinationText.position || opposite * drict); this.destinationText = new ETextName({ zlevel: this.zlevel, z: this.z + 2, - x: x + model.destinationCodePoint.x, - y: y + model.destinationCodePoint.y, + silent: false, + x: tempx, + y: tempy, fontWeight: 'bold', - fontSize: style.Section.text.fontSize, + fontSize: style.Section.destinationText.fontSize, fontFamily: style.textFontFormat, text: model.destinationCode, - textFill: style.Section.text.destinationTextColor, - textAlign: style.Section.text.textAlign, - textPosition: style.Section.text.textPosition, - style: this.style + textFill: style.Section.destinationText.fontColor, + textAlign: style.Section.destinationText.textAlign, + textPosition: style.Section.destinationText.textPosition, + textVerticalAlign: style.Section.destinationText.textVerticalAlign }); // 添加视图 this.add(this.destinationText); diff --git a/src/jmap/shape/Signal/index.js b/src/jmap/shape/Signal/index.js index 51a738823..b020811f5 100644 --- a/src/jmap/shape/Signal/index.js +++ b/src/jmap/shape/Signal/index.js @@ -80,7 +80,7 @@ class Signal extends Group { x: sigNameX, y: sigNameY, text: model.name, - fontWeight: 'normal', + fontWeight: 'bold', fontSize: style.Signal.text.fontSize, fontFamily: style.textFontFormat, textFill: style.Signal.text.defaultColor,