fix(event): add touch event

支持touch事件,移动端交互

src/core/controller/event.js

@@ -40,6 +40,10 @@ export default class EventContoller {
         lnglat: { lng: lnglat.lng, lat: lnglat.lat }
       };
       if (featureId >= 0) { // 拾取到元素，或者离开元素
+        if (type.substr(0, 5) === 'touch') {
+          type = 'click';
+          this.layer.emit('mousemove', target);
+        }
         this.layer.emit(type, target);
         this._selectedId = featureId;
       }

src/core/engine/picking/picking.js

@@ -33,7 +33,14 @@ class Picking {
     window.addEventListener('resize', this._resizeHandler, false);
   }
   pickdata(event) {
-    const point = { x: event.offsetX, y: event.offsetY, type: event.type, _parent: event };
+    let point = { x: event.offsetX, y: event.offsetY, type: event.type, _parent: event };
+    if (event.type.substr(0, 5) === 'touch') {
+      if (event.touches.length === 0) {
+        return;
+      }
+      const touch = event.touches[0];
+      point = { x: touch.clientX, y: touch.clientY, type: event.type, _parent: touch };
+    }
     const normalisedPoint = { x: 0, y: 0 };
     normalisedPoint.x = (point.x / this._width) * 2 - 1;
     normalisedPoint.y = -(point.y / this._height) * 2 + 1;

src/core/layer.js

@@ -480,37 +480,6 @@ export default class Layer extends Base {
     }
   }
 
-  _initEvents() {
-    this.scene.on('pick-' + this.layerId, e => {
-      let { featureId, point2d, type } = e;
-      // TODO 瓦片图层获取选中数据信息
-      const lnglat = this.scene.containerToLngLat(point2d);
-      let feature = null;
-      let style = null;
-      if (featureId !== -999) {
-        const res = this.getSelectFeature(featureId, lnglat);
-        feature = res.feature;
-        style = res.style;
-      }
-      const target = {
-        featureId,
-        feature,
-        style,
-        pixel: point2d,
-        type,
-        lnglat: { lng: lnglat.lng, lat: lnglat.lat }
-      };
-      if (featureId >= 0) { // 拾取到元素，或者离开元素
-        this.emit(type, target);
-      }
-      if (featureId < 0 && this._activeIds >= 0) {
-        type = 'mouseleave';
-        this.emit(type, target);
-      }
-      this._activeIds = featureId;
-
-    });
-  }
   getSelectFeature(featureId, lnglat) {
     // return {};
     if (this.get('layerType') === 'tile') {

src/core/scene.js

@@ -144,6 +144,9 @@ export default class Scene extends Base {
       'mousemove',
       'mousedown',
       'mouseleave',
+      'touchstart',
+      'touchmove',
+      'touchend',
       'mouseup',
       'rightclick',
       'click',
@@ -153,7 +156,6 @@ export default class Scene extends Base {
       this._container.addEventListener(event, e => {
         // 要素拾取
         if (e.target.nodeName !== 'CANVAS') return;
-        e.pixel || (e.pixel = e.point);
         this._engine._picking.pickdata(e);
       }, true);
     });