92 lines
2.6 KiB
JavaScript
92 lines
2.6 KiB
JavaScript
|
// import Path from 'zrender/src/graphic/Path';
|
||
|
|
||
|
// 成都三号线 临时限速名称显示
|
||
|
// export const ELimitName = Path.extend({
|
||
|
// type: 'ELimitName',
|
||
|
// shape: {
|
||
|
// points: null
|
||
|
// },
|
||
|
// buildPath: function (ctx, shape) {
|
||
|
// const points = shape.points;
|
||
|
// const y = points.y - 15;
|
||
|
// ctx.moveTo(points.x, y);
|
||
|
// ctx.lineTo(points.x - shape.drict * shape.style.Section.speedLimit.drogueWidth, y);
|
||
|
// ctx.lineTo(points.x - shape.drict * (shape.style.Section.speedLimit.drogueWidth + 5), y - 5);
|
||
|
// ctx.lineTo(points.x - shape.drict * shape.style.Section.speedLimit.drogueWidth, y - 10);
|
||
|
// ctx.lineTo(points.x, y - 10);
|
||
|
// ctx.lineTo(points.x, y);
|
||
|
// }
|
||
|
// });
|
||
|
|
||
|
import Group from 'zrender/src/container/Group';
|
||
|
import Text from 'zrender/src/graphic/Text';
|
||
|
import Polygon from 'zrender/src/graphic/shape/Polygon';
|
||
|
|
||
|
export default class ELimitName extends Group {
|
||
|
constructor(model) {
|
||
|
super();
|
||
|
this.model = model;
|
||
|
this.zlevel = model.zlevel;
|
||
|
this.z = model.z;
|
||
|
this.create(model);
|
||
|
}
|
||
|
|
||
|
create(model) {
|
||
|
const rectW = model.style.Section.speedLimit.drogueWidth;
|
||
|
const rectH = model.style.Section.speedLimit.drogueHeight;
|
||
|
this.add(new Polygon({
|
||
|
zlevel: this.zlevel,
|
||
|
z: this.z + 9,
|
||
|
shape: {
|
||
|
points: [
|
||
|
[model.x, model.y],
|
||
|
[model.x - model.drict * rectW, model.y],
|
||
|
[model.x - model.drict * (rectW + rectH / 2), model.y - rectH / 2],
|
||
|
[model.x - model.drict * rectW, model.y - rectH],
|
||
|
[model.x, model.y - rectH]
|
||
|
]
|
||
|
},
|
||
|
style: {
|
||
|
lineWidth: 0,
|
||
|
fill: model.style.Section.speedLimit.nameBackground
|
||
|
}
|
||
|
}));
|
||
|
|
||
|
// 公里标内容
|
||
|
this.add(new Text({
|
||
|
zlevel: this.zlevel,
|
||
|
z: this.z + 10,
|
||
|
style: {
|
||
|
x: model.x - model.drict * 2,
|
||
|
y: model.y,
|
||
|
fontWeight: 'normal',
|
||
|
fontSize: model.style.Section.speedLimit.nameNumberFontSize,
|
||
|
fontFamily: model.style.fontFamily,
|
||
|
text: '15',
|
||
|
textFill: model.style.Section.speedLimit.nameNumberColor,
|
||
|
textAlign: model.drict == -1 ? 'left' : 'right',
|
||
|
textPosition: model.style.Section.text.textPosition || 'inside',
|
||
|
textVerticalAlign: 'bottom'
|
||
|
}
|
||
|
}));
|
||
|
|
||
|
// 公里值
|
||
|
this.add(new Text({
|
||
|
zlevel: this.zlevel,
|
||
|
z: this.z + 10,
|
||
|
style: {
|
||
|
x: model.x,
|
||
|
y: model.y + 12,
|
||
|
fontWeight: 'normal',
|
||
|
fontSize: model.style.Section.speedLimit.kilometerFontSize,
|
||
|
fontFamily: model.style.fontFamily,
|
||
|
text: '17.981km',
|
||
|
textFill: model.style.Section.speedLimit.kilometerColor,
|
||
|
textAlign: model.drict == -1 ? 'left' : 'right',
|
||
|
textPosition: model.style.Section.text.textPosition || 'inside',
|
||
|
textVerticalAlign: 'bottom'
|
||
|
}
|
||
|
}));
|
||
|
}
|
||
|
}
|