如何获取mapbox在视图中的经纬度范围

298 阅读1分钟

获取mapbox在视图中的经纬度范围

在公司业务中有些客户会要求我们获取到当前视图展示的具体经纬度范围,用作一些地理位置信息的判断,具体怎么获取呢?实现代码如下:

  // 获取mapbox在视图中的经纬度范围
  getBounds = () => {
    // getBounds()方法是用来获取视图中地图区域范围
    const bound = map.getBounds(); // map为当前实例化的mapbox组件
    const result = {
      lngMax: bound._ne.wrap().lng, // 最大经度
      lngMin: bound._sw.wrap().lng, // 最小经度
      latMax: bound._ne.wrap().lat, // 最大纬度
      latMin: bound._sw.wrap().lat, // 最小纬度
    };
    bounds.value = result;
  };

我们获取到了这个值但是具体在哪里触发呢,那我们就需要监听地图的“moveend”事件了

   map.on("moveend", () => {
     getBounds();
   });