引用第三方高德地圖接口---使用js腳本進行開發地圖定位的步驟

時間 2019-12-06

標籤引用第三方地圖接口使用腳本進行開發定位步驟欄目 JavaScript 简体版

原文原文鏈接

①在高德地圖開發平臺註冊一個帳號，獲取keyjavascript

②添加新的keyjava

③引入map插件web

④複製過來map的腳本代碼和編寫搜索框api

<script type="text/javascript" src="http://webapi.amap.com/maps?v=1.4.2&key=你申請的key&plugin=AMap.Autocomplete,AMap.PlaceSearch"></script>spa

<body>
<input type="text" id="tipinput" style="margin-left:380px;width:300px;height:40px;padding-left:10px;font-weitht:900px;"/> //搜索框
<div id="container" style="width:1000px;height:600px;"></div> //地圖顯示區域
</body>
插件

<script type="text/javascript">
//地圖加載
var map = new AMap.Map("container", {
resizeEnable: true
});
//輸入提示
var autoOptions = {
input: "tipinput"
};
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); //關鍵字查詢查詢
}
</script>code

相關文章

相關標籤/搜索

高德地圖開發1

高德地圖開發

高德地圖開發3

高德地圖API

iOS地圖開發

Hibernate教程

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。

最新文章

本站公眾號

歡迎關注本站公眾號,獲取更多信息

相關文章

>>更多相關文章<<