127 lines
4.1 KiB
JavaScript
127 lines
4.1 KiB
JavaScript
import Group from 'zrender/src/container/Group';
|
|
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();
|
|
}
|
|
}
|
|
// 成都三号线 折返进路
|
|
const EBackArrow = Path.extend({
|
|
type: 'EBackArrow',
|
|
shape: {
|
|
points: null
|
|
},
|
|
buildPath: function (ctx, shape) {
|
|
const points = shape.points;
|
|
var r = shape.height;
|
|
var x = points.x + shape.drict * shape.width / 2;
|
|
var y = points.y;
|
|
ctx.moveTo(points.x - shape.drict * shape.width, points.y + shape.height);
|
|
ctx.lineTo(points.x + shape.drict * shape.width / 2, points.y + shape.height);
|
|
if (shape.drict) {
|
|
ctx.arc(x, y, r, Math.PI / 2, Math.PI * 3 / 2, true);
|
|
} else {
|
|
ctx.arc(x, y, r, Math.PI / 2, Math.PI * 3 / 2, false);
|
|
}
|
|
ctx.moveTo(points.x + shape.drict * shape.width / 2, points.y - shape.height);
|
|
ctx.lineTo(points.x - shape.drict * (shape.width - 5), points.y - shape.height);
|
|
}
|
|
});
|
|
|
|
// 箭头
|
|
const EBackArrowTriangle = Path.extend({
|
|
type: 'EBackArrowTriangle',
|
|
shape: {
|
|
points: null
|
|
},
|
|
buildPath: function (ctx, shape) {
|
|
const points = shape.points;
|
|
ctx.moveTo(points.x - shape.drict * (shape.width - 5), points.y - shape.height - 3);
|
|
if (shape.drict) {
|
|
ctx.lineTo(points.x - shape.drict * shape.width, points.y - shape.height);
|
|
} else {
|
|
ctx.lineTo(points.x - shape.drict * shape.width, points.y - shape.height);
|
|
}
|
|
ctx.lineTo(points.x - shape.drict * (shape.width - 5), points.y - shape.height + 3);
|
|
}
|
|
});
|