315 lines
9.1 KiB
JavaScript
315 lines
9.1 KiB
JavaScript
import * as zrUtil from 'zrender/src/core/util';
|
|
// import * as vector from 'zrender/src/core/vector';
|
|
import Group from 'zrender/src/container/Group';
|
|
import deviceType from './constant/deviceType';
|
|
import systemGraphType from './constant/systemGraphType';
|
|
import transitionDeviceStatus from './constant/stateTransition';
|
|
// import shapefactory from './shape/factory';
|
|
import Graphic from './shape';
|
|
import TransformHandle from './transformHandle';
|
|
import TransformHandleScreen from './transformHandleScreen';
|
|
import deviceRender from './constant/deviceRender';
|
|
|
|
class Painter {
|
|
constructor(jmap) {
|
|
// 父级实例
|
|
this.$jmap = jmap;
|
|
this.$zr = jmap.getZr();
|
|
|
|
// 图层数据
|
|
this.mapInstanceLevel = {};
|
|
|
|
this.screenFlag = false;
|
|
|
|
// 初始图层
|
|
this.initLevels();
|
|
|
|
// 视图控制器
|
|
this.$transformHandle = new TransformHandle(this);
|
|
this.$transformHandleScreen = new TransformHandleScreen(this);
|
|
}
|
|
|
|
/**
|
|
* 初始绘图实例
|
|
* @param {*} dom
|
|
* @param {*} config
|
|
*/
|
|
initLevels() {
|
|
|
|
// 添加父级图层
|
|
this.parentLevel = new Group({ name: '__parent__' });
|
|
this.$zr.add(this.parentLevel);
|
|
|
|
// 添加子级图层
|
|
zrUtil.each([
|
|
...Object.values(deviceType),
|
|
...Object.values(systemGraphType)], (type) => {
|
|
const level = new Group({ name: `__${type}__` });
|
|
this.mapInstanceLevel[type] = level;
|
|
this.parentLevel.add(level);
|
|
});
|
|
}
|
|
|
|
newGraph(device) {
|
|
const type = device._type;
|
|
// const state = this.$map.getState(); // 获取 默认状态
|
|
const builder = Graphic.getBuilder(type); // 根据 type 绘制 面板，资源，画面对应的 instance
|
|
return builder(device, this.$jmap);
|
|
}
|
|
|
|
/**
|
|
* 重绘视图
|
|
* @param {*} mapDevice
|
|
*/
|
|
repaint(mapDevice) {
|
|
// 清空视图
|
|
this.clear();
|
|
|
|
// 创建视图
|
|
Object.values(mapDevice).forEach(device => {
|
|
this.add(device);
|
|
});
|
|
}
|
|
|
|
/**
|
|
* 添加视图
|
|
* @param {*} device
|
|
*/
|
|
add(device) {
|
|
try {
|
|
const instance = device.instance || this.newGraph(device);
|
|
if (instance) {
|
|
device.instance = instance;
|
|
this.$transformHandle.transformView(instance);
|
|
this.mapInstanceLevel[device._type].add(instance);
|
|
}
|
|
} catch (err) {
|
|
console.error(err);
|
|
}
|
|
}
|
|
|
|
/**
|
|
* 删除视图
|
|
* @param {*} device
|
|
*/
|
|
delete(device) {
|
|
const instance = device.instance;
|
|
if (instance) {
|
|
this.mapInstanceLevel[device._type].remove(instance);
|
|
}
|
|
}
|
|
|
|
checkTrainOverlap(device) { // 检查重叠列车
|
|
const trainWindowCode = device.trainWindowCode;
|
|
const overlapTrainList = [device.code];
|
|
this.mapInstanceLevel[deviceType.Train].eachChild(elem => {
|
|
if (elem.model.code !== device.code && elem.model.trainWindowCode === trainWindowCode) {
|
|
overlapTrainList.push(elem.model.code);
|
|
}
|
|
});
|
|
if (overlapTrainList.length > 1) {
|
|
this.sortOverLapTrain(overlapTrainList);
|
|
}
|
|
return overlapTrainList;
|
|
}
|
|
sortOverLapTrain(overlapTrainList) { // 对重叠列车按照区段上的位置进行排序
|
|
overlapTrainList.sort((a, b) => {
|
|
const trainA = this.$jmap.getDeviceByCode(a);
|
|
const trainB = this.$jmap.getDeviceByCode(b);
|
|
if (trainA.right) {
|
|
return trainA.offsetp - trainB.offsetp;
|
|
} else {
|
|
return trainB.offsetp - trainA.offsetp;
|
|
}
|
|
});
|
|
}
|
|
/**
|
|
* 更新列车
|
|
* @param {*} device
|
|
*/
|
|
updateTrain(device) {
|
|
const curModel = device;
|
|
if (curModel.sectionCode) {
|
|
curModel.sectionModel = this.$jmap.getDeviceByCode(curModel.sectionCode);
|
|
if (curModel.sectionModel.trainWindowCode) {
|
|
curModel.trainWindowCode = curModel.sectionModel.trainWindowCode;
|
|
} else if (curModel.right && curModel.sectionModel.logicSectionCodeList && curModel.sectionModel.logicSectionCodeList.length) {
|
|
const sec = this.$jmap.getDeviceByCode(curModel.sectionModel.logicSectionCodeList[curModel.sectionModel.logicSectionCodeList.length - 1]);
|
|
curModel.trainWindowCode = sec.trainWindowCode;
|
|
} else if (!curModel.right && curModel.sectionModel.logicSectionCodeList && curModel.sectionModel.logicSectionCodeList.length) {
|
|
const sec = this.$jmap.getDeviceByCode(curModel.sectionModel.logicSectionCodeList[0]);
|
|
curModel.trainWindowCode = sec.trainWindowCode;
|
|
}
|
|
}
|
|
|
|
if (curModel.trainWindowCode) {
|
|
curModel.trainWindowModel = this.$jmap.getDeviceByCode(curModel.trainWindowCode);
|
|
}
|
|
const overlapTrainList = this.checkTrainOverlap(device);
|
|
overlapTrainList.forEach((item, index) => {
|
|
const trainDevice = this.$jmap.getDeviceByCode(item);
|
|
trainDevice._type = deviceRender['Train']._type;
|
|
trainDevice.zlevel = deviceRender['Train'].zlevel;
|
|
trainDevice.overLapIndex = index;
|
|
trainDevice.instance && this.mapInstanceLevel[deviceType.Train].remove(trainDevice.instance);
|
|
trainDevice.instance = null;
|
|
trainDevice.zrOffsetX = this.$jmap.$options.offsetX;
|
|
trainDevice.zrOffsetY = this.$jmap.$options.offsetY;
|
|
this.add(trainDevice);
|
|
});
|
|
|
|
if (this.screenFlag) {
|
|
this.$transformHandleScreen.transformView(device.instance);
|
|
}
|
|
}
|
|
|
|
/**
|
|
* 更新视图
|
|
* @param {*} device
|
|
*/
|
|
update(device) {
|
|
if (device) {
|
|
try {
|
|
if (device._dispose) {
|
|
this.delete(device);
|
|
} else if (deviceType.Train.toUpperCase() == device.deviceType) {
|
|
this.updateTrain(device);
|
|
} else {
|
|
const instance = device.instance;
|
|
if (instance) {
|
|
instance.setState(transitionDeviceStatus(device)); // 改变视图状态
|
|
}
|
|
}
|
|
} catch (err) {
|
|
console.error(err);
|
|
}
|
|
}
|
|
}
|
|
/**
|
|
* 更新显示模式
|
|
*/
|
|
updateShowMode(device) {
|
|
if (device && device.instance) {
|
|
device.instance.setShowMode();
|
|
}
|
|
}
|
|
/**
|
|
* 更新现地显示单独集中站
|
|
* */
|
|
updateShowStation(device, stationCode) {
|
|
if (device && device.instance) {
|
|
device.instance.setShowStation(stationCode);
|
|
}
|
|
}
|
|
// updateSpecialShowStation(device, flag) {
|
|
// if (device && device.instance) {
|
|
// device.instance.setShowStation(flag);
|
|
// }
|
|
// }
|
|
/**
|
|
* 更新transform变化
|
|
* @param {*} opt
|
|
*/
|
|
updateTransform(opt) {
|
|
this.screenFlag = false;
|
|
this.$transformHandle.updateTransform(opt);
|
|
}
|
|
|
|
updateScreen(opt) {
|
|
this.$transformHandleScreen.updataOffset(opt);
|
|
}
|
|
updateScreenNum(opts) {
|
|
this.$transformHandleScreen.updataOffsetNum(opts);
|
|
}
|
|
updateTransform1(list, opts) {
|
|
this.screenFlag = true;
|
|
this.$transformHandleScreen.updateTransform(list, opts);
|
|
}
|
|
/**
|
|
* 更新zrender尺寸
|
|
* @param {*} opt
|
|
*/
|
|
updateZrSize(opt) {
|
|
this.$transformHandle.updateZrSize(opt);
|
|
}
|
|
|
|
/**
|
|
* 过去坐标提示位置
|
|
* @param {*} opts
|
|
*/
|
|
getShapeTipPoint(instance, opts) {
|
|
if (instance) {
|
|
var point = instance.getShapeTipPoint(opts);
|
|
if (point) {
|
|
// 矩阵变换
|
|
var transPoint = instance.transformCoordToGlobal(point.x, point.y);
|
|
return {
|
|
x: transPoint[0],
|
|
y: transPoint[1]
|
|
};
|
|
}
|
|
}
|
|
}
|
|
|
|
/**
|
|
* 设置图层可见
|
|
* @param {*} code
|
|
*/
|
|
setLevelVisible(list) {
|
|
zrUtil.each(Object.values(deviceType), type => {
|
|
const level = this.mapInstanceLevel[type];
|
|
if (list.includes(type)) {
|
|
level.hide();
|
|
} else {
|
|
level.show();
|
|
}
|
|
}, this);
|
|
}
|
|
|
|
/**
|
|
* 刷新图层
|
|
*/
|
|
refresh() {
|
|
this.$zr.refresh();
|
|
}
|
|
|
|
/**
|
|
* 清除图层
|
|
*/
|
|
clearLevel(type) {
|
|
const level = this.mapInstanceLevel[type];
|
|
if (level) {
|
|
level.removeAll();
|
|
this.screenFlag && this.$transformHandleScreen.removeType(type);
|
|
}
|
|
}
|
|
|
|
/**
|
|
* 清除canvas
|
|
*/
|
|
clear() {
|
|
zrUtil.each(Object.values(this.mapInstanceLevel), (level) => {
|
|
level && level.removeAll();
|
|
}, this);
|
|
this.refresh();
|
|
}
|
|
|
|
/**
|
|
* 销毁图层
|
|
*/
|
|
dispose() {
|
|
this.mapInstanceLevel = {};
|
|
this.parentLevel = null;
|
|
}
|
|
|
|
/**
|
|
* 父级图层
|
|
*/
|
|
getParentLevel() {
|
|
return this.parentLevel;
|
|
}
|
|
|
|
}
|
|
|
|
export default Painter;
|