高德地图系列(三):vue项目利用高德地图实现地址搜索功能

目录

第一章 效果图

第二章 源代码

第一章 效果图

  • 高德地图为我们提供了搜索联想,以及搜索结果标记,该案例已将基础功能打通,后续我们肯定还会对功能有所修改,想实现自己想要的效果,基本上看高德地图文档对着改就好了(跟我们用别的工具一样做即可) 

第二章 源代码

  • 代码描述如下:




  •  注意事项:
  1. 需要搭配申请key和的密钥key一起使用
  2. 地图2.0使用的是AMap.AutoComplete记得区分1.x的Autocomplete
  3. 高德地图组件已经能实现搜索事件了,只需要输入框id对应填好即可
  4. 搜索功能还有许多功能,我们可以根据给的典例了解参数(小编认为上面的解释比接口文档更详细),实例文档如下:
  5. 接口文档如下:

 示例文档:获取搜索数据-POI搜索-示例中心-JS API 2.0 示例 | 高德地图API

高德地图系列(三):vue项目利用高德地图实现地址搜索功能_第1张图片高德地图系列(三):vue项目利用高德地图实现地址搜索功能_第2张图片 

接口文档:参考手册-地图 JS API 2.0 | 高德地图API 

你可能感兴趣的:(高德地图系列,vue.js,前端,javascript,高德地图,地址搜索,工具使用)