mapbox 坐标拾取

使用Mapbox加载底图，通过鼠标在地图上进行移动操作，在移动过程中显示对应位置的坐标信息

vue代码：

  <div id="map-wrap-init">
    // 地图
    <div id="cesiumContainer"></div>
    // 经纬度信息
    <div id="info" v-if="isShowPosition"></div>
    <slot></slot>
  </div>

js代码：

      let _that = this;
      _that.$nextTick(() => {
      // 加载mapbox底图
        let newMapbox = new htMapbox('cesiumContainer', this.mapOptions);
        _that.map = newMapbox;
        // 统一注册点击事件
        _that.map.on('load', function () {
          // 点击事件
          _that.map.on('click', function (e) {
            // 获取点击时的经度和纬度
            console.log(e.lngLat.lng,e.lngLat.lat)
          });
          // 鼠标移动事件
          _that.map.on('mousemove', function (e) {
            _that.isShowPosition = true;
            const lon = _that.formatDegree('lon', JSON.stringify(e.lngLat.lng));
            const lat = _that.formatDegree('lat', JSON.stringify(e.lngLat.lat));
            document.getElementById('info').innerHTML =
              lon + '    ' + lat;
          });
        });
      });

formatDegree 格式化单位方法：

   // type 为经度 lon,纬度 lat: value 值 
   formatDegree(type, value1) {
      let resType = '';
      let value = Number(value1);
      if (type == 'lon') {
       if (value > 180) {
          value = value - 360;
        } else if (value < -180) {
          value = value + 360;
        }
        value < 0 ? (resType = 'W') : (resType = 'E');
      } else if (type == 'lat') {
        value < 0 ? (resType = 'S') : (resType = 'N');
      }
      if (value !== null && value !== '') {
        let v1 = Math.floor(value * 1000) / 1000;
        return v1 + '°' + resType;
      } else {
        return '';
      }
    },

经纬度度分秒的转换：

    /***
     * 经纬度 度分秒转换
     * type 类型： 传lon或lat
     * value 值： 传lon或lat的值
     */
    formatDegree(type, value1) {
      let resType = '';
      let value = Number(value1);
      if (type == 'lon') {
       if (value > 180) {
          value = value - 360;
        } else if (value < -180) {
          value = value + 360;
        }
        value < 0 ? (resType = 'W') : (resType = 'E');
      } else if (type == 'lat') {
        value < 0 ? (resType = 'S') : (resType = 'N');
      }
      if (value !== null && value !== '') {
        value = Math.abs(value);
        let v1 = Math.floor(value);
        let v2 = Math.floor((value - v1) * 60);
        let v3 = Math.round(((value - v1) * 3600) % 60);
        return v1 + '°' + v2 + "'" + v3 + "''" + resType;
      } else {
        return '';
      }
    },