高德地图POI搜索
参考：《输入提示与POI搜索》
输入提示插件 & POI搜索插件
- 输入提示插件：
AMap.Autocomplete - POI搜索插件：
AMap.PlaceSearch
实际应用中会将输入提示插件和POI搜索插件结合使用
输入提示和POI搜索插件结合使用
通常Autocomplete和PlaceSearch结合使用，使用时只需在select事件的响应函数中调用PlaceSearch的相关查询方法，这里我们使用PlaceSearch包装好的map属性来实现POI搜索结果的显示：
let map = new AMap.Map('mapContainer', {
resizeEnable: true,
// center: [116.397428, 39.90923],//地图中心点
// zoom: 13,//地图显示的缩放级别
// keyboardEnable: false
});
AMap.plugin(['AMap.Autocomplete', 'AMap.PlaceSearch'], () => {
let autoOptions = {
// city: "北京", //城市，默认全国
input: 'keyword'
};
let autocomplete = new AMap.Autocomplete(autoOptions);
let placeSearch = new AMap.PlaceSearch({
// city:'北京',
map
});
AMap.event.addListener(autocomplete, 'select', (e) => {
// TODO 针对选中的POI实现自己的功能
placeSearch.setCity(e.poi.adcode);
placeSearch.search(e.poi.name);
});
// 以下加入POI后生成的marker的点击事件代码
});
另外，加上POI搜索以后生成的marker的点击事件，用于获取经纬度：
// POI后生成的marker的点击事件
AMap.event.addListener(placeSearch, 'markerClick', (e) => {
let location = e.data.location;
setTimeout(() => {
alert(`名称：${e.data.name}\n经纬度：${location.lng},${location.lat}`);
}, 800);
});
