2019-07-08 09:38:39 +08:00
|
|
|
import * as zrUtil from 'zrender/src/core/util';
|
2019-07-03 14:29:09 +08:00
|
|
|
import Group from 'zrender/src/container/Group';
|
2019-07-16 13:34:03 +08:00
|
|
|
import deviceType from './constant/deviceType';
|
2019-07-03 14:29:09 +08:00
|
|
|
import shapefactory from './shape/factory';
|
2019-07-19 09:23:56 +08:00
|
|
|
import TransformHandle from './transformHandle';
|
2019-07-03 14:29:09 +08:00
|
|
|
|
|
|
|
class Painter {
|
2019-07-11 17:58:58 +08:00
|
|
|
constructor(jmap) {
|
|
|
|
// 父级实例
|
|
|
|
this.$jmap = jmap;
|
2019-07-16 09:44:31 +08:00
|
|
|
this.$zr = jmap.getZr();
|
2019-07-10 13:17:12 +08:00
|
|
|
|
2019-07-11 17:58:58 +08:00
|
|
|
// 图层数据
|
2019-07-16 12:01:43 +08:00
|
|
|
this.mapInstanceLevel = {};
|
2019-07-03 18:41:00 +08:00
|
|
|
|
2019-07-19 11:11:34 +08:00
|
|
|
// 初始图层
|
2019-07-19 18:32:19 +08:00
|
|
|
this.initLevels();
|
2019-07-19 15:17:58 +08:00
|
|
|
|
|
|
|
// 视图控制器
|
2019-07-19 18:01:42 +08:00
|
|
|
this.$transformHandle = new TransformHandle(this);
|
2019-07-11 17:58:58 +08:00
|
|
|
}
|
2019-07-03 14:29:09 +08:00
|
|
|
|
2019-07-04 10:59:40 +08:00
|
|
|
/**
|
2019-07-09 19:04:45 +08:00
|
|
|
* 初始绘图实例
|
2019-07-04 10:59:40 +08:00
|
|
|
* @param {*} dom
|
|
|
|
* @param {*} config
|
2019-07-03 18:41:00 +08:00
|
|
|
*/
|
2019-07-19 18:32:19 +08:00
|
|
|
initLevels() {
|
2019-07-25 15:44:23 +08:00
|
|
|
// 图层分级策略
|
|
|
|
this.layerBranch = {};
|
|
|
|
this.layerBranch['01'] = (type) => { return type == deviceType.Link; }; // 逻辑图层级
|
|
|
|
this.layerBranch['02'] = (type) => { return type != deviceType.Link; }; // 物理图层级
|
|
|
|
this.layerBranch['03'] = (type) => { return true; }; // 混合图层级
|
|
|
|
|
2019-07-11 17:58:58 +08:00
|
|
|
// 添加父级图层
|
|
|
|
this.parentLevel = new Group({ name: '__parent__' });
|
2019-07-16 09:44:31 +08:00
|
|
|
this.$zr.add(this.parentLevel);
|
2019-07-11 17:58:58 +08:00
|
|
|
|
|
|
|
// 添加子级图层
|
|
|
|
zrUtil.each(Object.values(deviceType), (type) => {
|
|
|
|
const level = new Group({ name: `__${type}__` });
|
2019-07-16 12:01:43 +08:00
|
|
|
this.mapInstanceLevel[type] = level;
|
2019-07-11 17:58:58 +08:00
|
|
|
this.parentLevel.add(level);
|
|
|
|
});
|
2019-07-26 15:52:50 +08:00
|
|
|
|
|
|
|
// 设置默认显示图级
|
|
|
|
this.setLayerVisible('02');
|
2019-07-11 17:58:58 +08:00
|
|
|
}
|
2019-07-04 10:59:40 +08:00
|
|
|
|
|
|
|
/**
|
2019-07-04 18:39:30 +08:00
|
|
|
* 重绘视图
|
2019-07-04 10:59:40 +08:00
|
|
|
* @param {*} mapDevice
|
2019-07-03 18:41:00 +08:00
|
|
|
*/
|
2019-07-11 17:58:58 +08:00
|
|
|
repaint(mapDevice) {
|
|
|
|
// 清空视图
|
|
|
|
this.clear();
|
2019-07-04 18:39:30 +08:00
|
|
|
|
2019-07-11 17:58:58 +08:00
|
|
|
// 创建视图
|
|
|
|
Object.values(mapDevice).forEach(device => {
|
2019-07-17 12:17:41 +08:00
|
|
|
this.add(device);
|
2019-07-11 17:58:58 +08:00
|
|
|
});
|
|
|
|
}
|
2019-07-04 18:39:30 +08:00
|
|
|
|
2019-07-04 10:59:40 +08:00
|
|
|
/**
|
2019-07-03 14:29:09 +08:00
|
|
|
* 添加视图
|
2019-07-04 10:59:40 +08:00
|
|
|
* @param {*} device
|
2019-07-03 14:29:09 +08:00
|
|
|
*/
|
2019-07-11 17:58:58 +08:00
|
|
|
add(device) {
|
2019-07-30 12:37:31 +08:00
|
|
|
const instance = shapefactory(device, this.$jmap);
|
2019-07-16 12:01:43 +08:00
|
|
|
if (instance) {
|
|
|
|
device.instance = instance;
|
2019-07-21 20:20:41 +08:00
|
|
|
this.$transformHandle.transformView(instance);
|
2019-07-30 12:37:31 +08:00
|
|
|
this.mapInstanceLevel[device._type].add(instance);
|
2019-07-11 17:58:58 +08:00
|
|
|
}
|
|
|
|
}
|
2019-07-04 10:59:40 +08:00
|
|
|
|
|
|
|
/**
|
2019-07-03 14:29:09 +08:00
|
|
|
* 删除视图
|
2019-07-04 10:59:40 +08:00
|
|
|
* @param {*} device
|
2019-07-03 14:29:09 +08:00
|
|
|
*/
|
2019-07-11 17:58:58 +08:00
|
|
|
delete(device) {
|
2019-07-16 12:01:43 +08:00
|
|
|
const instance = device.instance;
|
|
|
|
if (instance) {
|
2019-07-30 12:37:31 +08:00
|
|
|
this.mapInstanceLevel[device._type].remove(instance);
|
2019-07-11 17:58:58 +08:00
|
|
|
}
|
|
|
|
}
|
2019-07-04 10:59:40 +08:00
|
|
|
|
2019-07-26 17:13:03 +08:00
|
|
|
checkIntersect(device) {
|
|
|
|
var intersect = false;
|
2019-07-26 17:18:27 +08:00
|
|
|
var befor = device.instance;
|
2019-07-30 12:37:31 +08:00
|
|
|
var train = shapefactory(device, this.$jmap);
|
2019-07-26 17:13:03 +08:00
|
|
|
|
2019-07-26 17:18:27 +08:00
|
|
|
this.mapInstanceLevel[deviceType.Train].eachChild(elem => {
|
2019-07-26 17:13:03 +08:00
|
|
|
if (elem !== befor && elem.getBoundingRect().intersect(train.getBoundingRect())) {
|
|
|
|
intersect = true;
|
2019-07-26 17:18:27 +08:00
|
|
|
return;
|
2019-07-26 17:13:03 +08:00
|
|
|
}
|
2019-07-26 17:18:27 +08:00
|
|
|
});
|
2019-07-26 17:13:03 +08:00
|
|
|
|
|
|
|
return intersect;
|
|
|
|
}
|
|
|
|
|
|
|
|
/**
|
|
|
|
* 更新列车
|
|
|
|
* @param {*} device
|
|
|
|
*/
|
|
|
|
updateTrain(device) {
|
2019-07-30 12:37:31 +08:00
|
|
|
var oldTrainWindowModel = null;
|
|
|
|
var instance = device.instance;
|
|
|
|
var curModel = device;
|
2019-07-26 17:13:03 +08:00
|
|
|
|
2019-07-30 12:37:31 +08:00
|
|
|
if (instance) {
|
|
|
|
oldTrainWindowModel = device.trainWindowModel;
|
|
|
|
}
|
2019-07-26 17:13:03 +08:00
|
|
|
|
2019-07-30 12:37:31 +08:00
|
|
|
if (curModel.sectionCode) {
|
|
|
|
curModel.sectionModel = this.$jmap.getDeviceByCode(curModel.sectionCode);
|
|
|
|
}
|
2019-07-26 17:13:03 +08:00
|
|
|
|
2019-07-30 12:37:31 +08:00
|
|
|
if (curModel.trainWindowCode) {
|
|
|
|
curModel.trainWindowModel = this.$jmap.getDeviceByCode(curModel.trainWindowCode);
|
|
|
|
}
|
2019-07-26 17:13:03 +08:00
|
|
|
|
2019-07-30 12:37:31 +08:00
|
|
|
if (instance && oldTrainWindowModel && this.checkIntersect(device)) {
|
|
|
|
device.trainWindowModel = oldTrainWindowModel;
|
2019-07-26 18:54:42 +08:00
|
|
|
}
|
2019-07-30 12:37:31 +08:00
|
|
|
|
2019-07-30 16:47:11 +08:00
|
|
|
instance && this.mapInstanceLevel[deviceType.Train].remove(instance);
|
2019-07-30 12:37:31 +08:00
|
|
|
this.add(device);
|
2019-07-26 17:13:03 +08:00
|
|
|
}
|
|
|
|
|
2019-07-04 10:59:40 +08:00
|
|
|
/**
|
2019-07-03 14:29:09 +08:00
|
|
|
* 更新视图
|
2019-07-04 10:59:40 +08:00
|
|
|
* @param {*} device
|
2019-07-03 14:29:09 +08:00
|
|
|
*/
|
2019-07-11 17:58:58 +08:00
|
|
|
update(device) {
|
2019-07-30 12:37:31 +08:00
|
|
|
if (device) {
|
|
|
|
if (device._dispose) {
|
|
|
|
this.delete(device);
|
|
|
|
} else if (deviceType.Train == device._type) {
|
|
|
|
this.updateTrain(device);
|
|
|
|
} else {
|
|
|
|
const instance = device.instance;
|
|
|
|
if (instance) {
|
|
|
|
instance.setState(device);
|
|
|
|
}
|
2019-07-26 17:13:03 +08:00
|
|
|
}
|
2019-07-11 17:58:58 +08:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
/**
|
2019-07-19 11:11:34 +08:00
|
|
|
* 更新transform变化
|
|
|
|
* @param {*} opt
|
2019-07-05 00:40:53 +08:00
|
|
|
*/
|
2019-07-19 11:11:34 +08:00
|
|
|
updateTransform(opt) {
|
|
|
|
this.$transformHandle.updateTransform(opt);
|
|
|
|
}
|
|
|
|
|
|
|
|
/**
|
|
|
|
* 更新zrender尺寸
|
|
|
|
* @param {*} opt
|
|
|
|
*/
|
|
|
|
updateZrSize(opt) {
|
|
|
|
this.$transformHandle.updateZrSize(opt);
|
2019-07-11 17:58:58 +08:00
|
|
|
}
|
2019-07-08 09:38:39 +08:00
|
|
|
|
2019-07-25 15:44:23 +08:00
|
|
|
/**
|
|
|
|
* 设置逻辑和物理图层
|
|
|
|
* @param {*} layer
|
|
|
|
*/
|
|
|
|
setLayerVisible(layer) {
|
|
|
|
zrUtil.each(Object.values(deviceType), type => {
|
|
|
|
const level = this.mapInstanceLevel[type];
|
|
|
|
if (this.layerBranch[layer](type)) {
|
|
|
|
level.show();
|
|
|
|
} else {
|
|
|
|
level.hide();
|
|
|
|
}
|
|
|
|
}, this);
|
|
|
|
}
|
|
|
|
|
2019-07-15 14:14:44 +08:00
|
|
|
/**
|
2019-07-19 09:40:22 +08:00
|
|
|
* 设置图层可见
|
2019-07-15 14:14:44 +08:00
|
|
|
* @param {*} code
|
|
|
|
*/
|
2019-07-25 15:44:23 +08:00
|
|
|
setLevelVisible(list) {
|
2019-07-15 14:14:44 +08:00
|
|
|
zrUtil.each(Object.values(deviceType), type => {
|
2019-07-16 12:01:43 +08:00
|
|
|
const level = this.mapInstanceLevel[type];
|
2019-07-15 14:14:44 +08:00
|
|
|
if (list.includes(type)) {
|
2019-07-25 15:44:23 +08:00
|
|
|
level.show();
|
2019-07-15 14:14:44 +08:00
|
|
|
} else {
|
2019-07-25 15:44:23 +08:00
|
|
|
level.hide();
|
2019-07-15 14:14:44 +08:00
|
|
|
}
|
2019-07-21 20:20:41 +08:00
|
|
|
}, this);
|
2019-07-15 14:14:44 +08:00
|
|
|
}
|
|
|
|
|
2019-07-11 17:58:58 +08:00
|
|
|
/**
|
2019-07-16 12:01:43 +08:00
|
|
|
* 刷新图层
|
2019-07-04 18:39:30 +08:00
|
|
|
*/
|
2019-07-11 17:58:58 +08:00
|
|
|
refresh() {
|
2019-07-19 18:05:43 +08:00
|
|
|
this.$zr.refresh();
|
2019-07-11 17:58:58 +08:00
|
|
|
}
|
2019-07-04 10:59:40 +08:00
|
|
|
|
|
|
|
/**
|
2019-07-26 17:13:03 +08:00
|
|
|
* 清除图层
|
|
|
|
*/
|
|
|
|
clearLevel(type) {
|
|
|
|
const level = this.mapInstanceLevel[type];
|
|
|
|
if (level) {
|
|
|
|
level.removeAll();
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
/**
|
|
|
|
* 清除canvas
|
2019-07-03 18:41:00 +08:00
|
|
|
*/
|
2019-07-11 17:58:58 +08:00
|
|
|
clear() {
|
2019-07-16 12:01:43 +08:00
|
|
|
zrUtil.each(Object.values(this.mapInstanceLevel), (level) => {
|
2019-07-11 17:58:58 +08:00
|
|
|
level && level.removeAll();
|
2019-07-21 20:20:41 +08:00
|
|
|
}, this);
|
2019-07-04 18:39:30 +08:00
|
|
|
|
2019-07-11 17:58:58 +08:00
|
|
|
this.refresh();
|
|
|
|
}
|
2019-07-03 18:41:00 +08:00
|
|
|
|
2019-07-04 10:59:40 +08:00
|
|
|
/**
|
2019-07-19 13:54:23 +08:00
|
|
|
* 销毁图层
|
|
|
|
*/
|
2019-07-11 17:58:58 +08:00
|
|
|
dispose() {
|
2019-07-16 12:01:43 +08:00
|
|
|
this.mapInstanceLevel = {};
|
2019-07-11 17:58:58 +08:00
|
|
|
this.parentLevel = null;
|
|
|
|
}
|
2019-07-10 12:02:02 +08:00
|
|
|
|
2019-07-11 17:58:58 +08:00
|
|
|
/**
|
2019-07-16 12:01:43 +08:00
|
|
|
* 父级图层
|
2019-07-10 12:02:02 +08:00
|
|
|
*/
|
2019-07-11 17:58:58 +08:00
|
|
|
getParentLevel() {
|
|
|
|
return this.parentLevel;
|
|
|
|
}
|
2019-07-25 10:32:29 +08:00
|
|
|
|
2019-07-03 14:29:09 +08:00
|
|
|
}
|
|
|
|
|
2019-07-04 10:59:40 +08:00
|
|
|
export default Painter;
|