zoukankan      html  css  js  c++  java
  • map.js

    map.js: 定位,下面这个小demo,可以精确到市

    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="utf-8" />
            <title>map</title>
            
            <style>
                
                #pos{
                    text-align: center;
                }
                
                #container{
                    width: 600px;
                    height: 480px;
                    margin: 30px auto;
                    border: 1px solid gray;
                    text-align: center;
                }
                
            </style>
            
            <script type="text/javascript" src="js/map.js"></script>
            
        </head>
        <body>
            
            <div id="pos"></div>
            <div id="container"></div>
            
            <script type="text/javascript">
                
                //检查浏览器是否支持定位
                function check(){
                    if(navigator.geolocation) alert("支持定位!");
                    else alert("不支持定位!");
                }
                //check();
                
                window.onload = function(){
                    var x,y;
                    if (navigator.geolocation) {
                        
                        //百度API功能
                        var map = new BMap.Map("container");
                        
                        //地图中心点
                        var point = new BMap.Point(x,y);
                        
                        //地图初始化,参数一: 中心点坐标   参数二: 地图缩放等级(百度为1~17)
                        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);
                                
                                //addOverlay(): 使用添加图层的方法, 将当前坐标覆盖到地图, mk代表当前坐标
                                map.addOverlay(mk);
                                
                                //将地图中心位置移动到当前坐标
                                map.panTo(r.point);
                                
                                document.getElementById("pos").innerHTML = "您当前的位置: 经度" + r.point.lng +",    纬度" + r.point.lat;
                            } else{
                                
                            }
                        },{enableHighAccuracy:true})//enableHighAccuracy: 是否使用精确定位, true使用, false不使用
                        
                    } else{
                        //getStats(): 获取状态
                        alert("获取定位失败!" + this.getStats());
                    }
                }
            </script>
            
        </body>
    </html>
  • 相关阅读:
    Java 密码扩展无限制权限策略文件
    深入浅出Mybatis系列(八)---mapper映射文件配置之select、resultMap
    git 常用功能 _fei
    ActiveMQ 使用
    【dp】导弹拦截
    【dp】求最长上升子序列
    【贪心】1225 金银岛
    最大子矩阵
    归并排序求逆序对
    服务器安全部署文档
  • 原文地址:https://www.cnblogs.com/HRurl/p/7705300.html
Copyright © 2011-2022 走看看