• HTML5 调用百度地图API地理定位


    <!DOCTYPE html>
    <html>
    <title>HTML5 HTML5 调用百度地图API地理定位实例</title>
        <head>
            <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
            <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=E4805d16520de693a3fe707cdc962045"></script>
        </head>
        <body style="margin:50px 10px;">
            <div id="status" style="text-align: center"></div>
            <div style="600px;height:480px;border:1px solid gray;margin:30px auto" id="container"></div>
        </body>
    </html>
    
    <script type="text/javascript">
    
        window.onload = function() {
            if(navigator.geolocation) {
                document.getElementById("status").innerHTML = "HTML5 Geolocation is supported in your browser.";
                    // 百度地图API功能
                    var map = new BMap.Map("container");
                    var point = new BMap.Point(116.331398,39.897445);
                    map.centerAndZoom(point,12);
    
                    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);
                            alert('您的位置:'+r.point.lng+','+r.point.lat);
                        }
                        else {
                            alert('failed'+this.getStatus());
                        }        
                    },{enableHighAccuracy: true})
            }
        };
    
    </script>

    转自:http://blog.csdn.net/goodnew/article/details/7318625

    需要使用自己的AK,申请一个百度地图应用即可。

    相关参考:

    http://blog.csdn.net/zhang_shi_yu920/article/details/51469329

    http://blog.163.com/hongshaoguoguo@126/blog/static/1804698120149249044488/

    http://blog.csdn.net/cyzero/article/details/42584193

    百度地图开放平台:

    http://lbsyun.baidu.com/

    百度地图API实例:

    http://lbsyun.baidu.com/jsdemo.htm#a1_2

  • 相关阅读:
    解决:微信小程序富文本识别不了空白p标签的方法
    微信小程序
    fastadmin
    微信小程序
    fastadmin使用笔记
    fastadmin使用笔记
    您有新的订单,请注意查收 提示音
    js获取视频第一帧生成图片
    解决JQ WeUI 的 Picker无法动态传值的问题
    微擎 人人商城小程序获取不到用户信息
  • 原文地址:https://www.cnblogs.com/itfantasy/p/6637737.html
Copyright © 2020-2023  润新知