import deviceType from './constant/deviceType'; import Eventful from 'zrender/src/mixin/Eventful'; import * as eventTool from 'zrender/src/core/event'; class EventModel { constructor(e) { this.clientX = e.event.clientX; this.clientY = e.event.clientY; let view = e.target; while (view) { if (Object.values(deviceType).includes(view._type)) { this.deviceCode = view._code; this.deviceType = view._type; break; } if (view._subType) { this.subType = view._subType; } if (view._val) { this.val = view._val; } view = view.parent; } } } class MouseController extends Eventful { constructor(jmap) { super(); this.$jmap = jmap; this.$zr = jmap.getZr(); this.events = jmap.getEvents(); this.initHandler(this.$zr); } initHandler(zr) { if (zr) { zr.on('click', this.click, this); zr.on('contextmenu', this.contextmenu, this); zr.on('mousemove', this.moveEvent, this); this.enable = function (opts) { opts = opts || {}; this._moveOnMouseMove = opts.moveOnMouseMove || true; this._zoomOnMouseWheel = opts.zoomOnMouseWheel || false; this._preventDefaultMouseMove = opts.preventDefaultMouseMove || true; this.disable(); zr.on('mousedown', this.mousedown, this); zr.on('mousemove', this.mousemove, this); zr.on('mouseup', this.mouseup, this); zr.on('mousewheel', this.mousewheel, this); }; this.disable = function () { zr.off('mousedown', this.mousedown); zr.off('mousemove', this.mousemove); zr.off('mouseup', this.mouseup); zr.off('mousewheel', this.mousewheel); }; this.dispose = function () { zr.off('click', this.click); zr.off('contextmenu', this.contextmenu); zr.off('mousemove', this.moveEvent); this.disable(); }; this.isDragging = function () { return this._dragging; }; } } mousedown(e) { if (eventTool.notLeftMouse(e)) { return; } var x = e.offsetX; var y = e.offsetY; this._x = x; this._y = y; this._dragging = true; } mousemove(e) { if (eventTool.notLeftMouse(e) || !this._moveOnMouseMove || !this._dragging ) { return; } const oldX = this._x; const oldY = this._y; const dx = e.offsetX - oldX; const dy = e.offsetY - oldY; this._x = e.offsetX; this._y = e.offsetY; this._preventDefaultMouseMove && eventTool.stop(e.event); this.trigger(this.events.__Pan, { dx, dy, oldX, oldY, newX: this._x, newY: this._y }); } mouseup(e) { if (!eventTool.notLeftMouse(e)) { this._dragging = false; } } mousewheel(e) { const shouldZoom = this._zoomOnMouseWheel; const wheelDelta = e.wheelDelta; const originX = e.offsetX; const originY = e.offsetY; if (wheelDelta === 0 || !shouldZoom) { return; } if (shouldZoom) { eventTool.stop(e.event); let scale = 1; if (wheelDelta > 0) { scale = 1; } else if (wheelDelta < 0) { scale = -1; } this.trigger(this.events.__Zoom, {type: 'zoom', scale, originX, originY }); } } click(e) { var em = this.checkEvent(e); this.trigger(this.events.Selected, em); } contextmenu(e) { var em = this.checkEvent(e); this.trigger(this.events.Contextmenu, em); } moveEvent(e) { return new EventModel(e); } checkEvent(e) { var oldEm = new EventModel(this.$zr.curEvent || { event: {} }); var newEm = new EventModel(e); if ([1, 3].includes(e.which)) { // 查找之前和当前鼠标选中的实例 var oldDevice = (this.$jmap.getDeviceByCode(oldEm.deviceCode) || {}).instance || {}; var newDevice = (this.$jmap.getDeviceByCode(newEm.deviceCode) || {}).instance || {}; // 如果之前和当前选中的实例不一致 if (oldDevice != newDevice) { // 如果实例有取消选择函数并且被点击,则执行取消选中函数 if (oldDevice.mouseEvent && oldDevice.mouseEvent.mouseout) { // 视图数据设置点击标志,同步执行 oldDevice.mouseEvent['down'] = false; oldDevice.mouseEvent['mouseout'](e); } // 如果实例有选中函数并且被点击,则执行选中函数 if (newDevice.mouseEvent && newDevice.mouseEvent.mouseover) { newDevice.mouseEvent['down'] = true; newDevice.mouseEvent['mouseover'](e); } } // 保存当前实例到全局 this.$zr.curEvent = e; } return newEm; } updateDatazoom(zoom) { this.trigger(this.events.Datazoom, zoom); } } export default MouseController;