當前位置：首頁 > 编程资源 > 编程问答 >内容正文

编程问答

百度地图获取规划路径信息

發布時間：2024/1/8 编程问答 22 豆豆

生活随笔收集整理的這篇文章主要介紹了百度地图获取规划路径信息小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

本文意在解決通過制定兩點坐標獲取百度搜索的路徑結果信息，用途是重現路徑（比如在mapv上繪制軌跡顯示效果圖等）。
實現思路：

加載百度地圖所需的js引用；

html布局用于顯示結果；

初始化百度地圖并加載到頁面上，給地圖對象添加點擊事件的監聽；

實現地圖的點擊監聽方法，主要是獲取到點擊地圖的坐標，并確定是起點和終點；

實現pointPathSearch()方法，創建百度地圖駕車路徑檢索的實例從而實現輸入起點終點進行路徑規劃搜索并設置檢索完成的事件監聽（主要是實現路徑返回的數據的封裝），實現搜索方法，主要是處理點擊獲取的坐標，并調用之前pointPathSearch()方法

<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>獲取百度地圖點擊兩點的路線規劃信息</title><script src="http://libs.baidu.com/jquery/2.1.1/jquery.min.js"></script><script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=CmVUh1GnOGsl7YcRNDSBb3AEzrEE0RXr"></script><style>html,body{width:100%;height: 100%;padding: 0;margin: 0}.map{width:100%;height:100%;padding:0;margin:0}</style> </head> <body> <div id="map" class="map"></div> <div style="position:absolute;top:10px;left: 10px;"><table><tr><td><span>起點</span></td><td><input type="text" id="sPoint"></td></tr><tr><td><span>終點</span></td><td><input type="text" id="ePoint"></td></tr><tr><td ><input type="button" value="查詢" id="btnSearch"> </td><td ><input type="button" value="重置" id="btnReset"> </td></tr><tr><td><span>時間</span></td><td><input type="text" id="time" readonly style="width:50px"> | <input type="text" id="timeformate" readonly style="width:50px"></td></tr><tr><td><span>距離</span></td><td><input type="text" id="distance" readonly style="width:50px"> | <input type="text" id="distanceformate" readonly style="width:50px"></td></tr></table><hr/><br/><textarea id="result" rows="6" cols="4"></textarea> </div> </body> </html> <script>function creat(){// 創建Map實例map = new BMap.Map("map", { enableMapClick: false });var point = new BMap.Point(112.571757,37.798085);map.centerAndZoom(point, 9);map.enableScrollWheelZoom();if(typeof(mapClickHandler) === "function"){map.addEventListener("click", mapClickHandler);}}creat();var flag = true;function mapClickHandler(e){// 從經緯度得到地址var curPos = e.point.lng + "," + e.point.lat;if(flag){$("#sPoint").val(curPos);flag = false;}else{$("#ePoint").val(curPos);flag = true;}}$("#btnSearch").click(function(){var sp = $("#sPoint").val();var ep = $("#ePoint").val();if(sp && ep){/*/!*var sPoint = new BMap.Point(sp.split(",")[0],sp.split(",")[1]);var ePoint = new BMap.Point(ep.split(",")[0],ep.split(",")[1]);*!/*/pointPathSearch(sp.split(",")[0],sp.split(",")[1],ep.split(",")[0],ep.split(",")[1]);}//namePathSearch("天津","太原",1,array);});$("#btnReset").click(function(){var sp = $("#sPoint").val("");var ep = $("#ePoint").val("");flag = true;map.clearOverlays();});function onSearchCompleteYeWHandler(data){//data中包含搜索返回的一些數據if(data){$("#result").text(data.coors);$("#time").val(data.time);$("#timeformate").val(data.formattime);$("#distance").val(data.distance);$("#distanceformate").val(data.formatdistance);}}function pointPathSearch(slng,slat,elng,elat,policy,tujd){//確定查詢的策略，百度現在只支持最短時間，最短路程，不走高速三種策略if(policy){if(policy === 1){policy = BMAP_DRIVING_POLICY_LEAST_TIME;}else if(polycy === 2){policy = BMAP_DRIVING_POLICY_LEAST_DISTANCE;}else if(polycy === 3){policy = BMAP_DRIVING_POLICY_AVOID_HIGHWAYS;}}else{policy = BMAP_DRIVING_POLICY_LEAST_TIME;}if(slng && slat && elng && elat){var pA = new BMap.Point(slng,slat);var pB = new BMap.Point(elng,elat);driving = new BMap.DrivingRoute(map,{renderOptions:{map: map, autoViewport: true},onSearchComplete:onSearchCompleteHandler,policy:policy});if(tujd && tujd.length>0){driving.search(pA, pB,{waypoints:tujd});}else{driving.search(pA, pB);}}}function onSearchCompleteHandler(result){//DrivingRouteResult//console.log(result.policy.length);var t = result.getPlan(0);var tt = t.getRoute(0).getPath();var result = "";$.each(tt,function(index,item){if(item){if(result === ""){result += item.lng + "," + item.lat;}else{result += ";" + item.lng + "," + item.lat;}}});var ob = new Object();ob.coors = result;ob.time = t.getDuration(false);ob.formattime = t.getDuration(true);ob.distance = t.getDistance(false);ob.formatdistance = t.getDistance(true);if(typeof onSearchCompleteYeWHandler === "function"){onSearchCompleteYeWHandler(ob);}} </script>

demo只是顯示了一個起點終點路徑規劃，這個方法可以實現批量獲取起點和終點的路徑規劃，主要可以獲取到規劃的路徑的途經點數據，此demo可以擴展到其它支持路徑規劃功能地圖平臺上。

總結

以上是生活随笔為你收集整理的百度地图获取规划路径信息的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。