map用起来真的一言难尽呀,按照官方文档说是可以支持传入一个setting,来配置所以的属性的。。,但是我试了没效果,经纬度更新了,调试代码看到的wxml经纬度也变化了,但是map上的经纬度却没变化,后来就是按照普遍的写法做了,一个个属性配置,因为我们项目中用了很多map,所以定义了一个common的setting,保持所有的map都一致,如果需要特别配置,可以在导出setting的page上自定义修改对应属性
// map setting的默认配置
const common = {latitude: null,longitude: null,scale: 9,showCompass: false,markers: [],includePoints: [],polyline: [],range: 50,mapScale: 20,enableZoom: false,enableScroll: false,enableRotate: false,
}
<maplatitude="{{setting.latitude}}"longitude="{{setting.longitude}}"scale="{{setting.scale}}"show-compass="{{setting.showCompass}}"markers="{{setting.markers}}"enableZoom="{{setting.enableZoom}}"enableScroll="{{setting.enableScroll}}"enableRotate="{{setting.enableRotate}}"bindtap="navigatorTo"data-map="{{true}}"></map>
这里说说自定义地图导航的做法,自定义那当然就是样式和功能那些都是按照需求做的了,这里主要说下遇到的问题,避免踩坑,这里呢首先有两种做法了,一种是通过后台接入腾讯地图web service api提供接口,一种是前端接入腾讯地图,鉴于第一种需要后台还需要去调一层腾讯地图的api,这样影响调用接口的时间,为了更好的用户体验,还是前端做更好,所以采用了前端接入的方式,那么下面说下第二种的坑
前端接入微信小程序javascript SDK,一开始接入这个没发现问题,后来就是发现没有满足需求,另外就是在搜索地点的时候,默认是搜索到最近的地点,例如我搜索云南昆明,它可能搜索到的是附近有这么几个字眼的位置,而不是搜到云南昆明的那个位置,为了解决开发中遇到的这些问题,后来尝试使用了腾讯地图的web service api,也满足了需求,返回了我们需要的pos的地址列表,打点的位置,距离,还有行驶的时间,相比于微信小程序javascript SDK,有些功能更加强大,如果需要自定义这块的话,可以使用web service api处理,另外如果只是需要提供一个导航的功能,也可以使用小程序自身提供的路线规划插件
https://lbs.qq.com/miniProgram/jsSdk/jsSdkGuide/jsSdkOverview
https://lbs.qq.com/miniProgram/plugin/pluginGuide/routePlan
#图一