uni-app uni.chooseLocation使用高德的SDK时地图搜索不可跨省市(跨省市必须要加上省市地名)
uni-app uni.chooseLocation使用高德的SDK时地图搜索不可跨省市(跨省市必须要加上省市地名)
操作步骤:
- 使用uni.chooseLocation跨省市搜索,不输入省市,直接搜索地名
预期结果:
- 比如我在上海搜索福州的正祥中心,不带福州应该也可以搜索出来
实际结果:
- 不带福州市搜索没有任何提示,只有带上福州市才能搜索到地方
bug描述:
- uni.chooseLocation搜索地址,跨省市搜索不输入省市搜索不到,使用的高德地图
图片
项目信息
信息 | 值 |
---|---|
产品分类 | 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元素用于地图渲染。