百度地图搜索控件获取的点位不准

一. 问题讲解

我们在使用百度 2D 地图时,添加其搜索控件


   
      
    

百度地图搜索控件获取的点位不准_第1张图片

 当我们搜索位置,然后在中心点位标点(百度地图返回点位)

代码如下

handleConfirm({ item }) {
  const that = this;
  let queryString = `${item.value.city}${item.value.district}${item.value.business}`;
  var myGeo = new BMap.Geocoder();
  myGeo.getPoint(queryString, function (point) {
    if (point) {
      that.from.position.lng = point.lng;
      that.from.position.lat = point.lat;
      that.centerMap.lat = point.lat // 改变中心点位的坐标
      that.centerMap.lng = point.lng;
      let initFrom = {
        path: [{ lng: that.centerMap.lng - 0.003468, lat: that.centerMap.lat + 0.002692 }, { lng: that.centerMap.lng - 0.006234, lat: that.centerMap.lat - 0.003139 }, {
          lng: that.centerMap.lng + 0.001359,
          lat: that.centerMap.lat + 0.000199
        }],
        gridName: "",
        position: point,
        backgroundColor: "#409EFF",
        editing: true,
        borderColor: "blue",
        startTime: "",
        endTime: "",
        status: "1",
      };
      that.polygonPaths = []
      that.from.path = initFrom.path
      that.polygonPaths.push(initFrom);
      that.polygonPaths[0].editing = true;
      that.polygonPaths[0].borderColor = "blue";
      that.polygonPaths[0].animation = "BMAP_ANIMATION_BOUNCE";
    }
  });
},

例如  我们搜索一个地铁站

百度地图搜索控件获取的点位不准_第2张图片

 点位跟标记位置明显是不一样的   开始我以为是点位标记有问题  我就先打印了一个此处搜索返回点位坐标

百度地图搜索控件获取的点位不准_第3张图片

 lat 为 30.603496083497404

 lng 为 114.3097383216564

然后我们创建一个新的 html 文件测试一下

 测试代码如下



 

    
    
    
    Document
    
    

 

    

就是将刚刚的点位放到地图上标点看看是不是标点的问题

 结果点位没问题  我就知道了  是搜索返回的点位有问题

二. 解决方法

我这里换了本地搜索( local search) 

代码如下

handleConfirm({ item }) {
  const that = this;
  let queryString = `${item.value.city}${item.value.district}${item.value.business}`;

  function myFun() {
    var point = local.getResults().getPoi(0).point;    //获取第一个智能搜索的结果
    console.log('经度:' + point.lng, '纬度:' + point.lat);
    // 处理逻辑
  }
  var local = new BMap.LocalSearch(this.map, { //智能搜索
    onSearchComplete: myFun
  });
  local.search(queryString)
},

测试

百度地图搜索控件获取的点位不准_第4张图片

 解决  提交代码  开始摸鱼

你可能感兴趣的:(vue.js,前端,javascript)