微信小程序map组件结合高德地图API实现wx.chooseLocation功能示例

<view class="map-inputtips-input"> <input bindinput="bindInput" placeholder="搜索" focus="true" /></view><view class="map_container"> <map class="map" latitude='{{latitude}}' longitude='{{longitude}}' markers='{{markers}}'> <cover-view class="map-search-list {{isShow ? '' : 'map-hide'}}">  <cover-view bindtouchstart="bindSearch" wx:key="searchId" data-keywords="{{item.name}}" data-location="{{item.location}}" class="map-box" wx:for="{{tips}}">  {{item.name}}  </cover-view> </cover-view> </map></view>

.map-inputtips-input{ height: 80rpx; line-height: 80rpx; width: 100%; box-sizing: border-box; font-size: 30rpx; padding: 0 10px; background-color: #fff; position: fixed; top: 0; left: 0; z-index: 1000; border-bottom:1px solid #c3c3c3;}.map-inputtips-input input{ border: 1px solid #ddd; border-radius: 5px; height: 60rpx; line-height: 60rpx; width: 100%; box-sizing: border-box; padding: 0 5px; margin-top: 10rpx;}.map-box{ margin: 0 10px; border-bottom:1px solid #c3c3c3; height: 80rpx; line-height: 80rpx;}.map-box:last-child{border: none;}.map-search-list{ position: fixed; top: 80rpx; left: 0; width: 100%; z-index: 1000; background-color: #fff;}

const app = getApp();const amap = app.data.amap;const key = app.data.key;Page({ data: { isShow: false, tips: {}, longitude: '', latitude: '', markers: [] }, onLoad() { var _this = this; wx.getLocation({  success: function(res) {  if (res && res.longitude){   _this.setData({   longitude: res.longitude,   latitude: res.latitude,   markers:[{    id:0,    longitude: res.longitude,    latitude: res.latitude,    iconPath: '../../src/images/ding.png',    width:32,    height:32   }]   })  }  } }) }, bindInput: function (e) { var _this = this; var keywords = e.detail.value; var myAmap = new amap.AMapWX({ key: key }); myAmap.getInputtips({  keywords: keywords,  location: '',  success: function (res) {  if (res && res.tips) {   _this.setData({   isShow: true,   tips: res.tips   });  }  } }) }, bindSearch: function (e) { var keywords = e.target.dataset.keywords; var location = e.target.dataset.location.split(','); this.setData({  isShow: false,  longitude: location[0],  latitude: location[1],  markers: [{  id: 0,  longitude: location[0],  latitude: location[1],  iconPath: '../../src/images/ding.png',  width: 32,  height: 32,  anchor: { x: .5, y: 1 },  label: {   content: keywords,   color: 'blue',   fontSize: 12,   borderRadius: 5,   bgColor: '#fff',   padding: 3,   x: 0,   y: -50,   textAlign: 'center'  }  }] }) }})