在前一篇的基础上加入了搜索提示,和通过搜索定位
前文:
https://blog.csdn.net/Zdelta/article/details/87072653
加入搜索:
1,引入js
//引入高德地图API,多个插件用逗号分隔
<script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.12&key=开发者key&plugin=AMap.Geocoder,AMap.Autocomplete,AMap.PlaceSearch"></script>
<script type="text/javascript" src="https://cache.amap.com/lbs/static/addToolbar.js"></script>
2,js:
//搜索
var autoOptions = {
input: "partyPlace"//前端搜索框
};
var auto = new AMap.Autocomplete(autoOptions);
var placeSearch = new AMap.PlaceSearch({
map: map
});
AMap.event.addListener(auto, "select", select);//注册监听,当选中某条记录时会触发
function select(e) {
placeSearch.setCity(e.poi.adcode);
placeSearch.search(e.poi.name); //关键字查询查询
}
3,效果:
搜索提示:
点击下拉框中的一项时,定位过去: