首页 > 代码库 > 百度地图 驾车导航
百度地图 驾车导航
<!DOCTYPE html><html><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script type="text/javascript" src=http://www.mamicode.com/"http://api.map.baidu.com/api?v=1.4"></script> <script type="text/javascript" src=http://www.mamicode.com/"http://api.map.baidu.com/library/TextIconOverlay/1.2/src/TextIconOverlay_min.js"></script> <script type="text/javascript" src=http://www.mamicode.com/"http://api.map.baidu.com/library/MarkerClusterer/1.2/src/MarkerClusterer_min.js"></script> <title>20.1驾车导航</title></head><body> <div style="height: 160px; color: #FFF; width: 960px; padding: 20px;"> <h1 style="color:Black"> 你要去哪儿啊?</h1> <div style="clear: both;"> <div style="float: left;"> <p> <label for="placeStart" style="color:Black"> 起点</label>:<input type="text" id="placeStart" /></p> <p> <label for="placeEnd" style="color:Black"> 终点</label>:<input type="text" id="placeEnd" /></p> </div> <div style="float: left; padding: 20px 0 0 10px;"> <button onclick="findWay();" style="height: 60px; line-height: 60px; width: 50px; background: #005EAC; color: #FFF; font-size: 20px;"> <b>OK</b></button> </div> </div> </div> <div style="clear: both;"> <div style="float: left; width: 500px; height: 340px; border: 1px solid gray" id="container"> </div> <div id="divResult" style="float: left; width: 500px; height: 340px; background: #eee"> </div> </div></body></html><script type="text/javascript"> var map = new BMap.Map("container"); map.centerAndZoom(new BMap.Point(116.404, 39.915), 14); function findWay() { var start = document.getElementById("placeStart"); var end = document.getElementById("placeEnd"); if (start.value.length <= 0) { alert("please input start place."); start.focus(); } if (end.value.length <= 0) { alert("please input end place."); end.focus(); } var driving = new BMap.DrivingRoute(map, {//创建驾车导航对象 renderOptions: { map:map,//驾车路线显示地图 panel: "divResult",//文字路线显示容器 autoViewport:true//自动调节视野 } }); driving.setSearchCompleteCallback(function (result) {//判断驾车路线是否存在 if (driving.getStatus() == BMAP_STATUS_SUCCESS) { } else { alert("没有搜索到路线,请确认起始点是否有效。"); start.focus(); } }); driving.search(start.value, end.value);//查询路线 }</script>
百度地图 驾车导航
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。