zoukankan      html  css  js  c++  java
  • HTML5调用百度地图API获取当前位置并直接导航目的地的方法

    <!DOCTYPE html>

    <html lang="zh-cmn-Hans">
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">
        <title>HTML5页面直接调用百度地图API,获取当前位置,直接导航目的地</title>
        <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=wDYEcxgRRheZwyC9jpN1Tt7fzr2zjosZ"></script> 
    //$ak=2051409c59b8d558c7e6bbd0c5c62ffd
     
        <script src="http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script><!--调用jQuery-->
      <style type="text/css">
            body, html,#allmap { 100%;height: 100%;overflow: hidden;margin:0;font-family:"微软雅黑";}
        </style>
    </head>
    <body> 
       <p id="allmap"></p>
    </body> 
    </html> 
    <script type="text/javascript"
        var map = new BMap.Map("allmap"); 
        var point = new BMap.Point(116.709684,39.89778);
        map.centerAndZoom(point, 16); 
        map.enableScrollWheelZoom();
        var myIcon = new BMap.Icon("myicon.png",new BMap.Size(30,30),{
            anchor: new BMap.Size(10,10)   
        });
        var marker=new BMap.Marker(point,{icon: myIcon}); 
        map.addOverlay(marker); 
        var geolocation = new BMap.Geolocation();
        geolocation.getCurrentPosition(function(r){
            if(this.getStatus() == BMAP_STATUS_SUCCESS){
                var mk = new BMap.Marker(r.point);
                map.addOverlay(mk);
                //map.panTo(r.point);//地图中心点移到当前位置
                var latCurrent = r.point.lat;
                var lngCurrent = r.point.lng;
                //alert('我的位置:'+ latCurrent + ',' + lngCurrent);
                location.href="http://api.map.baidu.com/direction?origin="+latCurrent+","+lngCurrent+"&destination=39.89778,116.709684&mode=driving&region=北京&output=html";
            }
            else {
                alert('failed'+this.getStatus());
            }       
        },{enableHighAccuracy: true})
        map.addOverlay(marker); 
        var licontent="<b>健龙森羽毛球馆</b><br>"
            licontent+="<span><strong>地址:</strong>北京市通州区滨河中路108号</span><br>"
            licontent+="<span><strong>电话:</strong>(010)81556565 / 6969</span><br>";         
        var opts = {
            width : 200,
            height: 80,
        };        
        var  infoWindow = new BMap.InfoWindow(licontent, opts); 
        marker.openInfoWindow(infoWindow); 
        marker.addEventListener('click',function(){
            marker.openInfoWindow(infoWindow);
        }); 
    </script>
  • 相关阅读:
    HDU 5977 Garden of Eden(点分治求点对路径颜色数为K)
    HDU 5828 Rikka with Sequence(线段树区间加开根求和)
    TZOJ 1689 Building A New Barn(求平面上有几个其它点求到n个点的曼哈顿距离最小)
    HDU 5734 Acperience(数学推导)
    POJ 1741 Tree(点分治点对<=k)
    HDU 5723 Abandoned country(kruskal+dp树上任意两点距离和)
    HDU 5988 Coding Contest(最小费用最大流变形)
    TZOJ 1693 Silver Cow Party(最短路+思维)
    TZOJ 4602 高桥和低桥(二分或树状数组+二分)
    TZOJ 2099 Sightseeing tour(网络流判混合图欧拉回路)
  • 原文地址:https://www.cnblogs.com/yszr/p/9267932.html
Copyright © 2011-2022 走看看