事件响应

src/view/App.js

@@ -9,8 +9,6 @@ import VectorDataManager from '../ctrl/VectorDataManager';
 import PresetsManager from '../ctrl/PresetsManager';
 // import ImageryManager from '../ctrl/ImageryManager';
 import AccountAuth from '../model/AccountAuth';
-import LocationCard from './common/LocationCard';
-import MapUtil from './utils/MapUtil';
 
 
 /**
@@ -18,25 +16,18 @@ import MapUtil from './utils/MapUtil';
  * It creates mostly everything.
  */
 export default class App {
+	static origin;
 	constructor(params) {
 		this.el = params.el
 		this.id = params.id
 		this.url = params.url
 
 		if (params.origin) {
-			this.origin = new LatLng(params.origin[0], params.origin[1])
+			App.origin = new LatLng(params.origin[0], params.origin[1])
 		} else {
-			this.origin = new LatLng(0, 0)
+			App.origin = new LatLng(0, 0)
 		}
 
-		//静态只读m
-		Object.defineProperty(App, 'origin', {
-			value: this.origin,
-			writable: false,
-			enumerable: false,
-			configurable: false
-		});
-
 		this.state = {
 			center: params.center || { lat: 39.9087, lng: 116.3975 }, // { lat: 39.9087, lng: 116.3975 } undefined
 			zoom: params.zoom || 18,
@@ -44,9 +35,7 @@ export default class App {
 			maxZoom: params.maxZoom || 22,
 			maxBounds: params.maxBounds || null,
 		};
-
-
-		// this.View = React.createRef();
+		this.child = React.createRef();
 	}
 
 	init() {
@@ -156,18 +145,18 @@ export default class App {
 	}
 
 
-	/** * 更新标记位置 * * 
-	 * @param {Object} data - 根据data.type类型，将不同的标记按照data.data移动 * 
-	*/
-	moveMarker(data) {
-		if (data.type === "card") {
-			let cards = data.data.map(card => {
-				let latlng = MapUtil.distancePointToLatLng(App.origin, card.x, card.y);
-				return new LocationCard(latlng.lat, latlng.lng, card.loc_time, card.milli_time, card.card_id, card.info, card.src);
-			});
-			PubSub.publish('body.data.update', cards);
-		}
-	}
+	// /** * 更新标记位置 * * 
+	//  * @param {Object} data - 根据data.type类型，将不同的标记按照data.data移动 * 
+	// */
+	// moveMarker(data) {
+	// 	if (data.type === "card") {
+	// 		let cards = data.data.map(card => {
+	// 			let latlng = MapUtil.distancePointToLatLng(App.origin, card.x, card.y);
+	// 			return new LocationCard(latlng.lat, latlng.lng, card.loc_time, card.milli_time, card.card_id, card.info, card.src);
+	// 		});
+	// 		PubSub.publish('body.data.update', cards);
+	// 	}
+	// }
 
 	/** * 加载地图文件 * * 
 	 * @param {String} url - 地图文件路径 * 
@@ -185,4 +174,18 @@ export default class App {
 				console.error('There was a problem with the fetch operation:', error);
 			});
 	}
+
+	/** 添加地图事件
+	 * 
+	 */
+	on(eventName, callback) {
+		PubSub.publish("map.event.bind", {
+			eventName: eventName, callback: callback
+		});
+	}
+	off(eventName, callback) {
+		PubSub.publish("map.event.unbind", {
+			eventName: eventName, callback: callback
+		});
+	}
 }

src/view/Map.js

@@ -645,11 +645,30 @@ class MyMap extends Component {
 		});
 
 		PubSub.subscribe("map.his.init", (msg, data) => {
-			// console.log('init his');
 			this.setState({
 				initHisTrack: true
 			});
 		});
+
+		PubSub.subscribe("map.event.bind", (msg, data) => {
+			if(data.eventName === 'contextmenu'){
+				this.elem.leafletElement.addEventListener(data.eventName, data.callback);
+				return;
+			}
+			this.elem.leafletElement.on(data.eventName, data.callback);
+		});
+
+		PubSub.subscribe("map.event.unbind", (msg, data) => {
+			if(data.eventName === 'contextmenu'){
+				this.elem.leafletElement.removeEventListener(data.eventName, data.callback);
+				return;
+			}
+			if(!data.callback){
+				this.elem.leafletElement.off(data.eventName);
+				return;
+			}
+			this.elem.leafletElement.off(data.eventName, data.callback);
+		});
 	}
 
 	componentDidUpdate(fromProps) {