百度地圖API在如何網站上展示十分鐘的步行圈?
2023-03-27 分類： 網站建設
隨著地圖應用的發展，開發了很多地圖API接口，網站使用地圖API也變得越來越頻繁，今天創新互聯給大家講下百度地圖API如何展示一個點或一座大廈的周邊環境，也可以叫步行圈，
首先看下展示圖片：
這就是用十分鐘的步行圈(周圍一千米)，現在做房產網站時經常會用的功能，就是一座大廈周邊有哪些便民信息，以便用戶通過了解大廈周邊情況來考慮是否租賃。使用案例可參考《快租街》網站。
很多網站地圖開發的程序員可能已經在百度地圖API示例找到相關的代碼了，不過由于輸出的列表信息是地圖API自帶的，所以無法更改樣式，需要擁有獨特的網站排版樣式，就得靠自己獲得接口的信息了，下面給大家講下如何用JS接口獲取這些列表信息的返回值，并標注一些參數的使用說明.
var map = new BMap.Map("l-map"); //初始化地圖
var mPoint = new BMap.Point(113.94442,22.527899); //初始化坐標
var circle = new BMap.Circle(mPoint,1000,{fillColor:"red", strokeWeight: 1 ,fillOpacity: 0.0001, strokeOpacity: 0.5});//圓形初始化，自己可根據自己的需要對參數進行修改
//strokeWeight 圓形區域的大小
//strokeOpacity:透明度，1為實，不能為0，
//fillOpacity：區域內的背景透明度，1為實，0.01為透明
map.addOverlay(circle);//畫一個圓
最重要的一步，循環所有的坐標點：
for (var i = 0; i < results.getCurrentNumPois(); i ++){
var title = results.getPoi(i).title; //標題
Var content =results.getPoi(i).address;//地址信息，包括公交站臺，地鐵站點
var lng = results.getPoi(i).point.lng;//坐標經度
var lat = results.getPoi(i).point.lat;//坐標緯度
}
local.searchNearby('公交',mPoint,1000);//1000是1000米的圓形范圍
local.disableAutoViewport();//自動調整地圖視野功能
由以上信息就能把這些坐標點集合在一起，然后組成一個JS的字符串,將這個字符串的內容賦予一個div,如$(‘#map_result’).html(content);
首先看下展示圖片：
這就是用十分鐘的步行圈(周圍一千米)，現在做房產網站時經常會用的功能，就是一座大廈周邊有哪些便民信息，以便用戶通過了解大廈周邊情況來考慮是否租賃。使用案例可參考《快租街》網站。
很多網站地圖開發的程序員可能已經在百度地圖API示例找到相關的代碼了，不過由于輸出的列表信息是地圖API自帶的，所以無法更改樣式，需要擁有獨特的網站排版樣式，就得靠自己獲得接口的信息了，下面給大家講下如何用JS接口獲取這些列表信息的返回值，并標注一些參數的使用說明.
var map = new BMap.Map("l-map"); //初始化地圖
var mPoint = new BMap.Point(113.94442,22.527899); //初始化坐標
var circle = new BMap.Circle(mPoint,1000,{fillColor:"red", strokeWeight: 1 ,fillOpacity: 0.0001, strokeOpacity: 0.5});//圓形初始化，自己可根據自己的需要對參數進行修改
//strokeWeight 圓形區域的大小
//strokeOpacity:透明度，1為實，不能為0，
//fillOpacity：區域內的背景透明度，1為實，0.01為透明
map.addOverlay(circle);//畫一個圓
最重要的一步，循環所有的坐標點：
for (var i = 0; i < results.getCurrentNumPois(); i ++){
var title = results.getPoi(i).title; //標題
Var content =results.getPoi(i).address;//地址信息，包括公交站臺，地鐵站點
var lng = results.getPoi(i).point.lng;//坐標經度
var lat = results.getPoi(i).point.lat;//坐標緯度
}
local.searchNearby('公交',mPoint,1000);//1000是1000米的圓形范圍
local.disableAutoViewport();//自動調整地圖視野功能
由以上信息就能把這些坐標點集合在一起，然后組成一個JS的字符串,將這個字符串的內容賦予一個div,如$(‘#map_result’).html(content);
詳細可見源文件，源文件還包括手機版的十分鐘的步行圈,頁面可直接打開查看。
網站名稱：百度地圖API在如何網站上展示十分鐘的步行圈?
鏈接地址：http://m.newbst.com/news43/248043.html
成都網站建設公司_創新互聯，為您提供響應式網站、網站營銷、網站策劃、ChatGPT、網站導航、網站維護
聲明：本網站發布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網站立場，如需處理請聯系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經允許不得轉載，或轉載時需注明來源： 創新互聯
猜你還喜歡下面的內容
- 網站搭建的基本流程是什么？ 2023-03-27
- 如何才能有效的把網站推廣出去這些手段不可少 2023-03-27
- 建設企業網站務必遵循的規則有哪些 2023-03-27
- 從日常生活到藝術設計技術實現，更有視覺層次 2023-03-27
- 創新互聯教你網站被K怎么辦 2023-03-27
- 404頁面制作是否有必要，該如何做呢？ 2023-03-27
- ?項目維護優化建議 2023-03-27
- 兒童教育類網站 2023-03-27
- 建設營銷型網站如何更好的發揮作用 2023-03-27
- 大連翼搏教育咨詢有限責任公司網站由創新互聯改版升級 2023-03-27
- 創新互聯干貨分享|做個人網站有哪些方法和技巧？ 2023-03-27
- 怎么確定網站的主體風格和要求 2023-03-27
- 一個站長眼中的夢想與現實 2023-03-27
- 推廣費用少，一樣可以引爆產品，用的就是快上推 2023-03-27
- 怎樣開發和優化移動APP？ 2023-03-27
- 系統平臺核心需求 2023-03-27
- 模板網站的優點和缺點有哪些 2023-03-27
- 北京建網站需要具備哪些知識? 2023-03-27
- 網站購買流程客戶管理系統和財務結算系統及銷售管理 2023-03-27