车站绘图代码调整
This commit is contained in:
parent
9a286521a6
commit
f4c88f7939
@ -383,9 +383,16 @@ class SkinCode extends defaultStyle {
|
||||
};
|
||||
|
||||
this[deviceType.Station] = {
|
||||
// text: {
|
||||
// show: true // 公里标名称显示
|
||||
// },
|
||||
// 北京线车站元素 车站名称
|
||||
elemnetType:['stationText'],
|
||||
stationText:{
|
||||
z:0,
|
||||
fontWeight:'normal', // 字体粗细
|
||||
textPadding:[0, 0], // 字体边距
|
||||
borderColor:'', // 字体边框颜色
|
||||
textBorderWidth:0 // 字体边框宽度
|
||||
},
|
||||
|
||||
kmPostShow: true, // 公里标显示
|
||||
kilometerPosition: 'down', // 公里标位置
|
||||
fontWeight: 'bold', // 文字错细
|
||||
|
@ -335,9 +335,16 @@ class SkinCode extends defaultStyle {
|
||||
}
|
||||
};
|
||||
this[deviceType.Station] = {
|
||||
// text: {
|
||||
// show: true // 公里标名称显示
|
||||
// },
|
||||
// 成都一号线车站元素 车站名称
|
||||
elemnetType:['stationText'],
|
||||
stationText:{
|
||||
z:0,
|
||||
fontWeight:'normal', // 字体粗细
|
||||
textPadding:[0, 0], // 字体边距
|
||||
borderColor:'', // 字体边框颜色
|
||||
textBorderWidth:0 // 字体边框宽度
|
||||
},
|
||||
|
||||
kmPostShow: false, // 公里标显示
|
||||
kilometerPosition: 'up', // 公里标朝向
|
||||
text: {
|
||||
|
@ -332,9 +332,16 @@ class SkinCode extends defaultStyle {
|
||||
};
|
||||
|
||||
this[deviceType.Station] = {
|
||||
// text: {
|
||||
// show: true // 公里标名称显示
|
||||
// },
|
||||
// 成都三号线车站元素 车站名称
|
||||
elemnetType:['stationText'],
|
||||
stationText:{
|
||||
z:0,
|
||||
fontWeight:'normal', // 字体粗细
|
||||
textPadding:[0, 0], // 字体边距
|
||||
borderColor:'', // 字体边框颜色
|
||||
textBorderWidth:0 // 字体边框宽度
|
||||
},
|
||||
|
||||
kmPostShow: false, // 公里标显示
|
||||
kilometerPosition: 'up', // 公里标朝向
|
||||
text: {
|
||||
|
@ -342,9 +342,16 @@ class SkinCode extends defaultStyle {
|
||||
}
|
||||
};
|
||||
this[deviceType.Station] = {
|
||||
// text: {
|
||||
// show: true // 公里标名称显示
|
||||
// },
|
||||
// 佛山有轨电车 车站元素 车站名称
|
||||
elemnetType:['stationText'],
|
||||
stationText:{
|
||||
z:0,
|
||||
fontWeight:'normal', // 字体粗细
|
||||
textPadding:[0, 0], // 字体边距
|
||||
borderColor:'', // 字体边框颜色
|
||||
textBorderWidth:0 // 字体边框宽度
|
||||
},
|
||||
|
||||
kmPostShow: true, // 公里标显示
|
||||
kilometerPosition: 'up', // 公里标朝向
|
||||
text: {
|
||||
|
@ -338,9 +338,16 @@ class SkinCode extends defaultStyle {
|
||||
}
|
||||
};
|
||||
this[deviceType.Station] = {
|
||||
// text: {
|
||||
// show: true // 公里标名称显示
|
||||
// },
|
||||
// 福州一号线 车站元素 车站名称
|
||||
elemnetType:['stationText'],
|
||||
stationText:{
|
||||
z:0,
|
||||
fontWeight:'normal', // 字体粗细
|
||||
textPadding:[0, 0], // 字体边距
|
||||
borderColor:'', // 字体边框颜色
|
||||
textBorderWidth:0 // 字体边框宽度
|
||||
},
|
||||
|
||||
kmPostShow: true, // 公里标显示
|
||||
kilometerPosition: 'up', // 公里标朝向
|
||||
text: {
|
||||
|
@ -374,9 +374,16 @@ class SkinCode extends defaultStyle {
|
||||
}
|
||||
};
|
||||
this[deviceType.Station] = {
|
||||
// text: {
|
||||
// show: true // 公里标名称显示
|
||||
// },
|
||||
// 哈尔滨一号线 车站元素 车站名称
|
||||
elemnetType:['stationText'],
|
||||
stationText:{
|
||||
z:0,
|
||||
fontWeight:'normal', // 字体粗细
|
||||
textPadding:[2, 6], // 字体边距
|
||||
borderColor:'', // 字体边框颜色
|
||||
textBorderWidth:1 // 字体边框宽度
|
||||
},
|
||||
|
||||
kmPostShow: true, // 公里标显示
|
||||
kilometerPosition: 'up', // 公里标朝向
|
||||
text: {
|
||||
|
@ -192,9 +192,16 @@ class SkinCode extends defaultStyle {
|
||||
};
|
||||
|
||||
this[deviceType.Station] = {
|
||||
// text: {
|
||||
// show: true // 公里标名称显示
|
||||
// },
|
||||
// 宁波一号线 车站元素 车站名称
|
||||
elemnetType:['stationText'],
|
||||
stationText:{
|
||||
z:0,
|
||||
fontWeight:'normal', // 字体粗细
|
||||
textPadding:[0, 0], // 字体边距
|
||||
borderColor:'', // 字体边框颜色
|
||||
textBorderWidth:0 // 字体边框宽度
|
||||
},
|
||||
|
||||
kmPostShow: false, // 公里标显示
|
||||
kilometerPosition: 'up', // 公里标朝向
|
||||
text: {
|
||||
|
@ -231,9 +231,16 @@ class SkinCode extends defaultStyle {
|
||||
};
|
||||
|
||||
this[deviceType.Station] = {
|
||||
// text: {
|
||||
// show: true // 公里标名称显示
|
||||
// },
|
||||
// 宁波三号线 车站元素 车站名称
|
||||
elemnetType:['stationText'],
|
||||
stationText:{
|
||||
z:0,
|
||||
fontWeight:'normal', // 字体粗细
|
||||
textPadding:[0, 0], // 字体边距
|
||||
borderColor:'', // 字体边框颜色
|
||||
textBorderWidth:0 // 字体边框宽度
|
||||
},
|
||||
|
||||
kmPostShow: false, // 公里标显示
|
||||
kilometerPosition: 'up', // 公里标朝向
|
||||
text: {
|
||||
|
@ -413,9 +413,16 @@ class SkinCode extends defaultStyle {
|
||||
};
|
||||
|
||||
this[deviceType.Station] = {
|
||||
// text: {
|
||||
// show: true // 公里标名称显示
|
||||
// },
|
||||
// 竞赛线路 车站元素 车站名称
|
||||
elemnetType:['stationText'],
|
||||
stationText:{
|
||||
z:0,
|
||||
fontWeight:'normal', // 字体粗细
|
||||
textPadding:[0, 0], // 字体边距
|
||||
borderColor:'', // 字体边框颜色
|
||||
textBorderWidth:0 // 字体边框宽度
|
||||
},
|
||||
|
||||
kmPostShow: true, // 公里标显示
|
||||
kilometerPosition: 'down', // 公里标位置
|
||||
fontWeight: 'bold', // 文字错细
|
||||
|
@ -355,9 +355,16 @@ class SkinCode extends defaultStyle {
|
||||
}
|
||||
};
|
||||
this[deviceType.Station] = {
|
||||
// text: {
|
||||
// show: true // 公里标名称显示
|
||||
// },
|
||||
// 西安一号线 车站元素 车站名称
|
||||
elemnetType:['stationText'],
|
||||
stationText:{
|
||||
z:0,
|
||||
fontWeight:'normal', // 字体粗细
|
||||
textPadding:[0, 0], // 字体边距
|
||||
borderColor:'', // 字体边框颜色
|
||||
textBorderWidth:0 // 字体边框宽度
|
||||
},
|
||||
|
||||
kmPostShow: true, // 公里标显示
|
||||
kilometerPosition: 'up', // 公里标朝向
|
||||
text: {
|
||||
|
@ -382,9 +382,16 @@ class SkinCode extends defaultStyle {
|
||||
}
|
||||
};
|
||||
this[deviceType.Station] = {
|
||||
// text: {
|
||||
// show: true // 公里标名称显示
|
||||
// },
|
||||
// 西安二号线 车站元素 车站名称
|
||||
elemnetType:['stationText'],
|
||||
stationText:{
|
||||
z:0,
|
||||
fontWeight:'normal', // 字体粗细
|
||||
textPadding:[0, 0], // 字体边距
|
||||
borderColor:'', // 字体边框颜色
|
||||
textBorderWidth:0 // 字体边框宽度
|
||||
},
|
||||
|
||||
kmPostShow: false, // 公里标显示
|
||||
kilometerPosition: 'up', // 公里标朝向
|
||||
text: {
|
||||
|
67
src/jmapNew/shape/Station/EStationText.js
Normal file
67
src/jmapNew/shape/Station/EStationText.js
Normal file
@ -0,0 +1,67 @@
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Text from 'zrender/src/graphic/Text';
|
||||
|
||||
class EStationText extends Group {
|
||||
constructor(model) {
|
||||
super();
|
||||
this.model = model;
|
||||
this.create();
|
||||
}
|
||||
|
||||
create() {
|
||||
const model = this.model.modelData;
|
||||
const style = this.model.style;
|
||||
|
||||
// 车站名称
|
||||
this.stationName = new Text({
|
||||
zlevel: this.model.zlevel,
|
||||
z: this.model.z,
|
||||
silent: !model.visible || false,
|
||||
style: {
|
||||
x: model.position.x,
|
||||
y: model.position.y,
|
||||
fontWeight: style.Station.stationText.fontWeight,
|
||||
fontSize: isNaN(Number(model.nameFont)) ? 20 : Number(model.nameFont),
|
||||
fontFamily: style.fontFamily,
|
||||
text: model.number ? model.number + model.name : model.name,
|
||||
textAlign: 'middle',
|
||||
textFill: model.nameFontColor,
|
||||
textVerticalAlign: 'top',
|
||||
textPadding:style.Station.stationText.textPadding,
|
||||
textBorderColor:style.Station.stationText.borderColor || model.nameFontColor,
|
||||
textBorderWidth:style.Station.stationText.textBorderWidth
|
||||
}
|
||||
});
|
||||
this.add(this.stationName);
|
||||
if (model.subheadDisplay) { // 副标题
|
||||
this.subheadText = new Text({
|
||||
zlevel: this.model.zlevel,
|
||||
z: this.model.z,
|
||||
silent: !model.visible || false,
|
||||
style: {
|
||||
x: model.subheadPosition.x,
|
||||
y: model.subheadPosition.y,
|
||||
fontWeight: model.fontWeight,
|
||||
fontSize: model.subheadFont || 18,
|
||||
fontFamily: style.fontFamily,
|
||||
text: model.subhead,
|
||||
textAlign: 'middle',
|
||||
textVerticalAlign: 'top',
|
||||
textFill: model.subheadFontColor,
|
||||
textPadding:style.Station.stationText.textPadding,
|
||||
textBorderColor:style.Station.stationText.borderColor || model.nameFontColor,
|
||||
textBorderWidth:style.Station.stationText.textBorderWidth
|
||||
}
|
||||
});
|
||||
this.add(this.subheadText);
|
||||
}
|
||||
}
|
||||
|
||||
recover() {
|
||||
}
|
||||
|
||||
setState() {
|
||||
}
|
||||
}
|
||||
|
||||
export default EStationText;
|
@ -11,6 +11,10 @@ import { arrow } from '../utils/ShapePoints';
|
||||
import Rect from 'zrender/src/graphic/shape/Rect';
|
||||
import Text from 'zrender/src/graphic/Text';
|
||||
import store from '@/store/index_APP_TARGET';
|
||||
|
||||
import EStationText from './EStationText';
|
||||
import {traverseLineElements, traverseStatusElements} from '../utils/ShapeStatusCovert';
|
||||
|
||||
import Vue from 'vue';
|
||||
|
||||
export default class Station extends Group {
|
||||
@ -28,37 +32,21 @@ export default class Station extends Group {
|
||||
this.createControlMode();
|
||||
this.setState(model);
|
||||
this.checkIsDrawMap();
|
||||
this.setVisible(model.visible);
|
||||
}
|
||||
|
||||
create() {
|
||||
const model = this.model;
|
||||
const style = this.style;
|
||||
|
||||
// 公里标名称是否显示
|
||||
this.stationText = new ETextName({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
x: model.position.x,
|
||||
y: model.position.y,
|
||||
fontWeight: style.Station.text.fontWeight,
|
||||
fontSize: isNaN(Number(model.nameFont)) ? 20 : Number(model.nameFont),
|
||||
fontFamily: style.fontFamily,
|
||||
silent: !model.visible,
|
||||
text: model.number ? model.number + model.name : model.name,
|
||||
textAlign: 'middle',
|
||||
textVerticalAlign: 'top',
|
||||
textFill: model.nameFontColor
|
||||
});
|
||||
this.add(this.stationText);
|
||||
if (style.Station.text.borderShow) { // 哈尔滨线路单独显示
|
||||
this.stationText.attr({
|
||||
style: {
|
||||
textPadding: style.Station.text.textPadding || [2, 6],
|
||||
textBorderColor: style.Station.text.borderColor || model.nameFontColor,
|
||||
textBorderWidth: style.Station.text.textBorderWidth || 1
|
||||
}
|
||||
});
|
||||
}
|
||||
// // 站台所有的绘图元素
|
||||
const elementTypeList = {
|
||||
'stationText':EStationText // 车站名称 (普通站台样式)
|
||||
};
|
||||
|
||||
// 遍历当前线路下的绘图元素 组合模式
|
||||
traverseLineElements(style.Station, elementTypeList, model, style, this);
|
||||
|
||||
const path = window.location.href;
|
||||
if (style.Station.kmPostShow || path.includes('/map/draw')) { // 公里标是否显示
|
||||
let direction = 1;
|
||||
@ -88,37 +76,13 @@ export default class Station extends Group {
|
||||
this.add(this.mileageText);
|
||||
model.kmPostShow ? this.mileageText.show() : this.mileageText.hide();
|
||||
}
|
||||
if (model.subheadDisplay) { // 副标题
|
||||
this.subheadText = new ETextName({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
x: model.subheadPosition.x,
|
||||
y: model.subheadPosition.y,
|
||||
fontWeight: model.fontWeight,
|
||||
fontSize: model.subheadFont || 18,
|
||||
fontFamily: style.fontFamily,
|
||||
text: model.subhead,
|
||||
silent: !model.visible,
|
||||
textAlign: 'middle',
|
||||
textVerticalAlign: 'top',
|
||||
textFill: model.subheadFontColor
|
||||
});
|
||||
this.add(this.subheadText);
|
||||
if (style.Station.text.borderShow) {
|
||||
this.subheadText.attr({
|
||||
style: {
|
||||
textPadding: [2, 6],
|
||||
textBorderColor: model.nameFontColor,
|
||||
textBorderWidth: 1
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
if (!model.visible) { // 隐藏车站
|
||||
this.subheadText && this.subheadText.setStyle('textFill', 'rgba(0,0,0,0)');
|
||||
this.mileageText && this.mileageText.setStyle('textFill', 'rgba(0,0,0,0)');
|
||||
this.stationText && this.stationText.setStyle('textFill', 'rgba(0,0,0,0)');
|
||||
}
|
||||
|
||||
// if (!model.visible) { // 隐藏车站
|
||||
// // this.subheadText && this.subheadText.setStyle('textFill', 'rgba(0,0,0,0)');
|
||||
// // this.mileageText && this.mileageText.setStyle('textFill', 'rgba(0,0,0,0)');
|
||||
// // this.stationText && this.stationText.setStyle('textFill', 'rgba(0,0,0,0)');
|
||||
// this.eachChild(elem => { elem.hide(); });
|
||||
// }
|
||||
}
|
||||
createTurnBack() { // 创建按图折返
|
||||
const model = this.model;
|
||||
@ -406,6 +370,13 @@ export default class Station extends Group {
|
||||
}
|
||||
}
|
||||
|
||||
// /** 恢复初始状态*/
|
||||
// recover() {
|
||||
// const currentTypeList = this.style.Station.elemnetType;
|
||||
// currentTypeList.forEach(element => {
|
||||
// this[element].recover();
|
||||
// });
|
||||
// }
|
||||
recover() {
|
||||
this.emergencyControl && this.emergencyControl.setColor(this.style.Station.StationControl.lamp.grayColor);
|
||||
this.emergencyControl && this.emergencyControl.setTextColor(this.style.Station.StationControl.text.fontColor);
|
||||
@ -433,6 +404,18 @@ export default class Station extends Group {
|
||||
}
|
||||
}
|
||||
|
||||
// setState(model) {
|
||||
// if (!this.isShowShape) return;
|
||||
// // // 新版地图使用新版状态变更方式
|
||||
// this.recover();
|
||||
|
||||
// // 更新状态
|
||||
// const currentTypeList = this.style.Station.elemnetType;
|
||||
// currentTypeList.forEach(element => {
|
||||
// this[element].setState(model);
|
||||
// });
|
||||
// }
|
||||
|
||||
getShapeTipPoint(opts) {
|
||||
let rect;
|
||||
if (opts.subDeviceType === 'button') {
|
||||
@ -448,13 +431,14 @@ export default class Station extends Group {
|
||||
|
||||
getBoundingRect() {
|
||||
const rect = this.stationText.getBoundingRect().clone();
|
||||
if (this.model.subheadDisplay) {
|
||||
const subheadText = this.subheadText.getBoundingRect().clone();
|
||||
rect.union(subheadText);
|
||||
// if (this.model.subheadDisplay) {
|
||||
// const subheadText = this.subheadText.getBoundingRect().clone();
|
||||
// rect.union(subheadText);
|
||||
// return rect;
|
||||
// } else {
|
||||
// return rect;
|
||||
// }
|
||||
return rect;
|
||||
} else {
|
||||
return rect;
|
||||
}
|
||||
}
|
||||
|
||||
drawSelected(selected) {
|
||||
@ -489,4 +473,12 @@ export default class Station extends Group {
|
||||
this.isShowShape = false;
|
||||
}
|
||||
}
|
||||
|
||||
setVisible(visible) {
|
||||
if (visible) {
|
||||
this.eachChild(elem => { elem.show(); });
|
||||
} else {
|
||||
this.eachChild(elem => { elem.hide(); });
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -63,6 +63,7 @@ class StationStand extends Group {
|
||||
// 加载皮肤控制的元素
|
||||
const model = this.model;
|
||||
const style = this.style;
|
||||
|
||||
// // 站台所有的绘图元素
|
||||
const elementTypeList = {
|
||||
'solidStand':ESolidStand, // 矩形实心站台 (普通站台样式)
|
||||
|
@ -4,15 +4,9 @@ export function getBaseUrl() {
|
||||
// BASE_API = 'https://joylink.club/jlcloud';
|
||||
BASE_API = 'https://test.joylink.club/jlcloud';
|
||||
// BASE_API = 'http://192.168.8.107:9000'; // 袁琪
|
||||
<<<<<<< HEAD
|
||||
// BASE_API = 'http://192.168.8.129:9000'; // 旭强
|
||||
// BASE_API = 'http://192.168.8.109:9000'; // 张赛
|
||||
// BASE_API = 'http://192.168.8.110:9000'; // 杜康
|
||||
=======
|
||||
// BASE_API = 'http://192.168.8.114:9000'; // 旭强
|
||||
// BASE_API = 'http://192.168.8.109:9000'; // 张赛
|
||||
// BASE_API = 'http://192.168.8.110:9008'; // 杜康
|
||||
>>>>>>> 009f7b57a22a8c59a26fe0b2be01d24377f37873
|
||||
// BASE_API = 'http://b29z135112.zicp.vip';
|
||||
// BASE_API = 'http://2925963m2a.zicp.vip'; // 杜康
|
||||
// BASE_API = 'http://2i38984j47.qicp.vip'; // 张赛
|
||||
|
Loading…
Reference in New Issue
Block a user