大铁线路III型 定反位 实心小圆圈 失表状态调整
This commit is contained in:
parent
226f0fd71b
commit
dd1b7b934e
@ -359,8 +359,10 @@ class SkinCode extends defaultStyle {
|
||||
core: {
|
||||
length: 6, // 道岔单边长度
|
||||
graphShow: true, // 图形显示
|
||||
specialCircle:true, // 大铁线路III型 定反位 实心小圆圈
|
||||
graphInversionColor: '#FFFF00', // 反位颜色
|
||||
graphLocalColor: '#00FF00' // 定位颜色
|
||||
graphLocalColor: '#00FF00', // 定位颜色
|
||||
lossActionColor:'#fff' // 失表颜色
|
||||
},
|
||||
rectLock: { // 矩形封锁框图形
|
||||
rectWidth: 18, // 矩形框 宽高
|
||||
@ -368,6 +370,12 @@ class SkinCode extends defaultStyle {
|
||||
block: true, // 封锁显示
|
||||
blockColor: 'red', // 封锁颜色
|
||||
followName: true // 位置跟随名称确定
|
||||
},
|
||||
jointImg: { // 道岔 A B C D四元素属性配置
|
||||
trapezoidLength: 8, // 直角梯形元素默认长度
|
||||
faultStatus: true, // 挤岔表示
|
||||
fork: true, // 挤岔专用(如有挤岔操作 变为true)
|
||||
forKColor: 'red' // 挤岔颜色 配合挤岔专用
|
||||
}
|
||||
};
|
||||
|
||||
|
49
src/jmapNew/shape/graph/Switch/ESpecialCircle.js
Normal file
49
src/jmapNew/shape/graph/Switch/ESpecialCircle.js
Normal file
@ -0,0 +1,49 @@
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Circle from 'zrender/src/graphic/shape/Circle';
|
||||
|
||||
class ESpecialCircle extends Group {
|
||||
constructor(model) {
|
||||
// drictx, dricty
|
||||
super();
|
||||
this.model = model;
|
||||
this.dricty = model.dricty;
|
||||
this.drictx = model.drictx > 0;
|
||||
this.create();
|
||||
}
|
||||
create() {
|
||||
const { model } = this;
|
||||
this.specialCircle = new Circle({
|
||||
zlevel: model.zlevel + 1,
|
||||
z: model.z + 2,
|
||||
shape: {
|
||||
cx: model.point.x + (this.drictx ? 14 : -14),
|
||||
cy: model.point.y,
|
||||
r: 3
|
||||
},
|
||||
style: {
|
||||
fill: '#FF0000'
|
||||
}
|
||||
});
|
||||
this.add(this.specialCircle);
|
||||
}
|
||||
|
||||
setColor(color) {
|
||||
console.log(this.specialCircle);
|
||||
console.log(color);
|
||||
this.specialCircle.setStyle({ fill: color });
|
||||
}
|
||||
|
||||
animate() {
|
||||
this.specialCircle && this.specialCircle.animateStyle(true)
|
||||
.when(0, { opacity: 1 })
|
||||
.when(500, { opacity: 0 })
|
||||
.when(1000, { opacity: 1 })
|
||||
.start();
|
||||
}
|
||||
|
||||
stopAnimation(flag) {
|
||||
this.specialCircle.stopAnimation(flag);
|
||||
}
|
||||
}
|
||||
|
||||
export default ESpecialCircle;
|
@ -14,6 +14,7 @@ import EHighlight from '../element/EHighlight';
|
||||
import ETriangle from './ETriangle';
|
||||
import store from '@/store/index';
|
||||
import ESwDot from './ESwDot';
|
||||
import ESpecialCircle from './ESpecialCircle';
|
||||
|
||||
export default class Switch extends Group {
|
||||
constructor(model, {style, mapDevice}) {
|
||||
@ -221,6 +222,20 @@ export default class Switch extends Group {
|
||||
this.add(this.dot);
|
||||
}
|
||||
|
||||
if (style.Switch.core.specialCircle) {
|
||||
// 大铁线路III型 定反位 实心小圆圈
|
||||
const { drictx, dricty } = this.triangle;
|
||||
this.specialCircle = new ESpecialCircle({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
point:sectionAPoint,
|
||||
drictx:drictx,
|
||||
dricty:dricty
|
||||
});
|
||||
this.add(this.specialCircle);
|
||||
this.specialCircle.hide();
|
||||
}
|
||||
|
||||
this.add(this.shapeModelA);
|
||||
this.add(this.shapeModelB);
|
||||
this.add(this.shapeModelC);
|
||||
@ -353,6 +368,8 @@ export default class Switch extends Group {
|
||||
this.name && this.name.show();
|
||||
this.limitName && this.limitName.show();
|
||||
this.dot && this.dot.hide();
|
||||
this.specialCircle && this.specialCircle.hide();
|
||||
this.specialCircle && this.specialCircle.stopAnimation(false);
|
||||
}
|
||||
|
||||
/** 定位*/
|
||||
@ -368,7 +385,13 @@ export default class Switch extends Group {
|
||||
}
|
||||
if (this.style.Switch.core.graphShow) { // 佛山线路显示
|
||||
this.shapeModelB.show();
|
||||
if (this.style.Switch.core.specialCircle) { // 大铁线路III型 定反位 实心小圆圈
|
||||
this.specialCircle.show();
|
||||
this.specialCircle.setColor(this.style.Switch.core.graphLocalColor);
|
||||
} else {
|
||||
this.shapeModelB.setColor(this.style.Switch.core.graphLocalColor);
|
||||
}
|
||||
|
||||
this.shapeModelC.show();
|
||||
this.shapeModelC.setColor(this.style.backgroundColor);
|
||||
}
|
||||
@ -388,7 +411,13 @@ export default class Switch extends Group {
|
||||
this.shapeModelA.setColor(this.style.Section.line.spareColor);
|
||||
if (this.style.Switch.core.graphShow) { // 佛山线路显示
|
||||
this.shapeModelC.show();
|
||||
if (this.style.Switch.core.specialCircle) { // 大铁线路III型 定反位 实心小圆圈
|
||||
this.specialCircle.show();
|
||||
this.specialCircle.setColor(this.style.Switch.core.graphInversionColor);
|
||||
this.shapeModelC.setColor(this.style.Section.line.spareColor);
|
||||
} else {
|
||||
this.shapeModelC.setColor(this.style.Switch.core.graphInversionColor);
|
||||
}
|
||||
this.shapeModelC.attr({
|
||||
z: this.z + 6
|
||||
});
|
||||
@ -436,6 +465,13 @@ export default class Switch extends Group {
|
||||
this.setTextColor(this.style.Switch.text.lossColor);
|
||||
this.style.Switch.text.faultFlashing && this.nameTextAnimation();
|
||||
|
||||
if (this.style.Switch.core.specialCircle) {
|
||||
this.specialCircle.show();
|
||||
this.specialCircle.setColor(this.style.Switch.core.lossActionColor);
|
||||
// 大铁线路III型 定反位 实心小圆圈
|
||||
this.specialCircle && this.specialCircle.animate();
|
||||
}
|
||||
|
||||
this.lossShow && this.lossShow.show(); // 西安线路专有
|
||||
this.lossShow && this.lossShow.animateStyle(true)
|
||||
.when(0, { stroke: this.style.backgroundColor })
|
||||
|
Loading…
Reference in New Issue
Block a user