86 lines
2.1 KiB
JavaScript
86 lines
2.1 KiB
JavaScript
|
import Group from "zrender/src/container/Group";
|
||
|
import Text from "zrender/src/graphic/Text";
|
||
|
import Polygon from "zrender/src/graphic/shape/Polygon";
|
||
|
|
||
|
class EDerailer extends Group {
|
||
|
constructor(model) {
|
||
|
super();
|
||
|
this.zlevel = model.zlevel;
|
||
|
this.z = model.z;
|
||
|
this.style = model.style;
|
||
|
this.model = model;
|
||
|
this.create();
|
||
|
}
|
||
|
|
||
|
create() {
|
||
|
this.createText();
|
||
|
this.createSymbol();
|
||
|
}
|
||
|
|
||
|
createText() {
|
||
|
const style = this.model.style;
|
||
|
const model = this.model.modelData;
|
||
|
const length = model.points.length;
|
||
|
const offset = style.Section.derailer.text.offset||{};
|
||
|
const offsetX = offset.x||0;
|
||
|
const offsetY = offset.y||0;
|
||
|
const positionX = (model.points[0].x + model.points[length-1].x) / 2 + offsetX;
|
||
|
const positionY = (model.points[0].y + model.points[length-1].y) / 2 + offsetY;
|
||
|
|
||
|
this.text = new Text({
|
||
|
zlevel: this.zlevel,
|
||
|
z: this.z,
|
||
|
style: {
|
||
|
x: positionX,
|
||
|
y: positionY,
|
||
|
text: 'T',
|
||
|
fontWeight: style.fontWeight,
|
||
|
fontSize: style.fontSize,
|
||
|
fontFamily: style.fontFamily,
|
||
|
textFill: style.Section.derailer.text.color,
|
||
|
textPosition: 'inside',
|
||
|
textAlign: 'center',
|
||
|
textVerticalAlign: 'center'
|
||
|
}
|
||
|
})
|
||
|
this.add(this.text);
|
||
|
}
|
||
|
|
||
|
createSymbol() {
|
||
|
const style = this.model.style;
|
||
|
const model = this.model.modelData;
|
||
|
const length = model.points.length;
|
||
|
const offset = style.Section.derailer.symbol.offset||{};
|
||
|
const offsetX = offset.x||0;
|
||
|
const offsetY = offset.y||0;
|
||
|
const pointX = (model.points[0].x + model.points[length-1].x) / 2 + offsetX;
|
||
|
const pointY = (model.points[0].y + model.points[length-1].y) / 2 + offsetY;
|
||
|
|
||
|
this.symbol = new Polygon({
|
||
|
zlevel: this.zlevel,
|
||
|
z: this.z,
|
||
|
shape: {
|
||
|
points: [
|
||
|
[pointX-3, pointY],
|
||
|
[pointX, pointY-8],
|
||
|
[pointX+3, pointY]
|
||
|
]
|
||
|
},
|
||
|
style: {
|
||
|
fill: style.Section.derailer.symbol.color,
|
||
|
}
|
||
|
})
|
||
|
this.add(this.symbol);
|
||
|
}
|
||
|
|
||
|
setTextStyle(style) {
|
||
|
this.text && this.text.setStyle(style);
|
||
|
}
|
||
|
|
||
|
setSymbolStyle(style) {
|
||
|
this.symbol && this.symbol.setStyle(style);
|
||
|
}
|
||
|
}
|
||
|
|
||
|
export default EDerailer;
|