102 lines
3.7 KiB
JavaScript
102 lines
3.7 KiB
JavaScript
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.style = model.style;
|
|
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.visible) {
|
|
this.stationName.setStyle('fontSize', 0);
|
|
}
|
|
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() {
|
|
}
|
|
setAnimateStyle(noneBeforeMode) {
|
|
this.stopAnimate();
|
|
const color = noneBeforeMode === 'Center' ? this.style.Station.stationText.centerModeColor : this.style.Station.stationText.localModeColor;
|
|
this.stationName.animateStyle(true).when(500, {textFill: '#000'}).when(1000, {textFill: color}).when(1500, {textFill: '#000'}).start();
|
|
}
|
|
stopAnimate() {
|
|
this.stationName.stopAnimation(true);
|
|
}
|
|
setColor(color) {
|
|
const style = this.model.style;
|
|
if (style.Station.StationControl.disPlayNone) {
|
|
this.stationName.setStyle('textFill', color);
|
|
this.subheadText && this.subheadText.setStyle('textFill', color);
|
|
}
|
|
}
|
|
setBackground(color) {
|
|
const style = this.model.style;
|
|
if (style.Station.StationControl.disPlayNone) {
|
|
this.stationName.setStyle('textBackgroundColor', color);
|
|
this.subheadText && this.subheadText.setStyle('textBackgroundColor', color);
|
|
}
|
|
}
|
|
|
|
setFlash() {
|
|
this.stopAnimate();
|
|
this.stationName.animateStyle(true).when(500, {opacity: 1}).when(1000, {opacity: 0}).when(1500, {opacity: 1}).start();
|
|
}
|
|
|
|
getBoundingRect() {
|
|
return this.stationName.getBoundingRect();
|
|
}
|
|
}
|
|
|
|
export default EStationText;
|