百度地图JSAPI实现加载当前位置并导航到目的地（web应用）

调用百度地图提供的api获取当前地理位置并导航到目的地（目的地需预先指定）

//html头部的引入信息<style type="text/css">        #allmap {width: 100%;height: 100%;overflow: hidden;margin:0;font-family:"微软雅黑";}    </style><script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=百度开发者中心申请到的密钥"></script>//html内容<div id="allmap"></div>//尾部自定义js代码<script type="text/javascript">        // 百度地图API功能        var map = new BMap.Map("allmap");        //创建步行规划对象        var walking = new BMap.WalkingRoute(map, {            renderOptions : {                map : map,                autoViewport : true            }        });        //获取当前的地理位置（百度地图转换后的经纬坐标）        var geolocation = new BMap.Geolocation();        geolocation.getCurrentPosition(function(r) {            if (this.getStatus() == BMAP_STATUS_SUCCESS) {                var opts = {                    position : r.point, // 指定文本标注所在的地理位置                    offset : new BMap.Size(30, -30)                //设置文本偏移量                }                //在地图上标注当前位置                var label = new BMap.Label("您的位置", opts); // 创建文本标注对象                label.setStyle({                    color : "red",                    fontSize : "12px",                    height : "20px",                    lineHeight : "20px",                    fontFamily : "微软雅黑"                });                map.addOverlay(label);                //预先查找好的目的地经纬坐标（可通过百度开发者中心的坐标拾取器获得）                var dest = new BMap.Point(113.345954, 23.181294);                var opts1 = {                    position : dest, // 指定文本标注所在的地理位置                    offset : new BMap.Size(30, -30)                //设置文本偏移量                }                //在地图上标注目的地位置                var label1 = new BMap.Label("天河客运站", opts1); // 创建文本标注对象                label1.setStyle({                    color : "red",                    fontSize : "12px",                    height : "20px",                    lineHeight : "20px",                    fontFamily : "微软雅黑"                });                map.addOverlay(label1);                walking.search(r.point, dest);                addCon();            } else {                //获取当前位置失败时的处理                alert('获取当前位置坐标失败,默认导航为从天河客运站到天河客运站');                var dest = new BMap.Point(113.345954, 23.181294);                walking.search("天河客运站", dest);                addCon();            }        }, {            enableHighAccuracy : true        })        //添加百度地图缩放的控件        function addCon() {            var top_left_control = new BMap.ScaleControl({                anchor : BMAP_ANCHOR_TOP_LEFT            });// 左上角，添加比例尺            var top_left_navigation = new BMap.NavigationControl(); //左上角，添加默认缩放平移控件            var top_right_navigation = new BMap.NavigationControl({                anchor : BMAP_ANCHOR_TOP_RIGHT,                type : BMAP_NAVIGATION_CONTROL_SMALL            }); //右上角，仅包含平移和缩放按钮            /*缩放控件type有四种类型:            BMAP_NAVIGATION_CONTROL_SMALL：仅包含平移和缩放按钮；            BMAP_NAVIGATION_CONTROL_PAN:仅包含平移按钮；            BMAP_NAVIGATION_CONTROL_ZOOM：仅包含缩放按钮*/            //添加控件和比例尺            map.addControl(top_left_control);            map.addControl(top_left_navigation);            map.addControl(top_right_navigation);        }    </script>

最后效果如图