uni-app uni.chooseLocation使用高德的SDK时地图搜索不可跨省市(跨省市必须要加上省市地名)

发布于 1周前 作者 caililin 来自 Uni-App

uni-app uni.chooseLocation使用高德的SDK时地图搜索不可跨省市(跨省市必须要加上省市地名)

操作步骤:

  • 使用uni.chooseLocation跨省市搜索,不输入省市,直接搜索地名

预期结果:

  • 比如我在上海搜索福州的正祥中心,不带福州应该也可以搜索出来

实际结果:

  • 不带福州市搜索没有任何提示,只有带上福州市才能搜索到地方

bug描述:

  • uni.chooseLocation搜索地址,跨省市搜索不输入省市搜索不到,使用的高德地图

图片

Image 1 Image 2

项目信息

信息
产品分类 uniapp/H5
PC开发环境操作系统 Windows
PC开发环境操作系统版本号 11
HBuilderX类型 正式
HBuilderX版本号 4.29
浏览器平台 Edge
浏览器版本 129.0.2792.89
项目创建方式 HBuilderX

2 回复

你好,你看一下网络请求,失败的时候,有哪个接口会报错吗?


在uni-app中使用uni.chooseLocation结合高德地图SDK时,确实可能会遇到地图搜索范围限制的问题,特别是跨省市搜索时。这通常是由于地图SDK的配置或者API调用时的参数设置不当导致的。为了确保跨省市搜索能够正常工作,我们需要确保在调用搜索功能时传递正确的参数,并且高德地图SDK配置正确。

以下是一个使用uni-app结合高德地图SDK实现跨省市搜索的示例代码。假设你已经按照高德地图的官方文档完成了SDK的集成和配置。

// 首先,确保你已经在manifest.json中配置了高德地图的key
// "mp-weixin": { // 以微信小程序为例
//   "appid": "your-app-id",
//   "setting": {
//     "urlCheck": false
//   },
//   "usingComponents": true,
//   "permission": {
//     "scope.userLocation": {
//       "desc": "你的位置信息将用于小程序位置接口的效果展示"
//     }
//   },
//   "plugins": {
//     "amap-wx": {
//       "version": "1.4.15",
//       "provider": "wxa3c9a654d3151899"
//     }
//   }
// },
// "sdkConfigs": {
//   "amap": {
//     "key": "your-amap-key"
//   }
// }

// 在页面中调用uni.chooseLocation时,可以通过设置额外的参数来尝试解决跨省市搜索问题
export default {
  methods: {
    chooseAmapLocation() {
      uni.chooseLocation({
        type: 'gcj02', // 坐标系类型
        success: (res) => {
          console.log('选择的位置:', res);
          // 这里可以调用高德地图的搜索API,传递res中的相关信息进行跨省市搜索
          // 示例:调用高德地图的POI搜索API
          this.amapSearchPOI(res.name, res.address);
        },
        fail: (err) => {
          console.error('选择位置失败:', err);
        }
      });
    },
    amapSearchPOI(keyword, location) {
      // 这里需要调用高德地图提供的JavaScript API进行搜索
      // 假设你已经通过script标签引入了高德地图的JSAPI
      const AMap = window.AMap;
      const map = new AMap.Map('container', {
        resizeEnable: true,
        center: [116.397428, 39.90923], // 初始中心点
        zoom: 13
      });
      const service = new AMap.PlaceSearch({
        pageSize: 5,
        pageIndex: 1,
        extensions: 'all'
      });
      service.search(keyword, {
        city: '', // 不指定城市,允许跨省市搜索
        children: 1, // 是否返回子区域搜索结果
        address: location // 根据选择的地址进行搜索
      }, (status, result) => {
        if (status === 'complete' && result.info === 'OK') {
          console.log('搜索结果:', result.poiList.pois);
        } else {
          console.error('搜索失败:', result.info);
        }
      });
    }
  }
}

请注意,上述代码示例中,amapSearchPOI方法使用了高德地图的JavaScript API进行POI搜索,并且传递了空字符串作为city参数,以允许跨省市搜索。同时,根据uni.chooseLocation返回的地址信息进行了搜索。你需要确保在页面或组件中正确引入了高德地图的JSAPI,并且已经配置了正确的container DOM元素用于地图渲染。

回到顶部