js百度地图定位

 

<!DOCTYPE html>  
<html>  
<head>  
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />  
<script src="https://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js"></script> 
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=您的密钥"></script>   
<script type="text/javascript" src="http://developer.baidu.com/map/jsdemo/demo/convertor.js"></script>
  
    <title>html5 Gps转百度</title>  
    <style type="text/css">  
        body, html,#allmap {width: 100%;height: 300px;overflow: hidden;margin:0;font-family:"微软雅黑";}  
    </style>  
</head>  
<body>  
    <div id="allmap"></div>  
</body>  
</html>  
<script type="text/javascript">  
    var map = new BMap.Map("allmap");    
    var longitude,latitude;
    navigator.geolocation.getCurrentPosition(function (position) {      
        console.info(position);
        longitude = position.coords.longitude;    
        latitude = position.coords.latitude;  
    });    
    setTimeout(function () {    
        var gpsPoint = new BMap.Point(longitude, latitude);    
        BMap.Convertor.translate(gpsPoint, 0, function (point) {    
            var geoc = new BMap.Geocoder();    
            geoc.getLocation(point, function (rs) {    
                          
                map.addControl(new BMap.NavigationControl());   
                map.addControl(new BMap.ScaleControl());   
                map.addControl(new BMap.OverviewMapControl());   
                map.centerAndZoom(point, 18);   
                map.addOverlay(new BMap.Marker(point)) ;  
                    
                var addComp = rs.addressComponents;    
                alert(addComp.province + ", " + addComp.city + ", " + addComp.district + ", " + addComp.street + ", " + addComp.streetNumber);    
                alert('您的位置:'+rs.point.lng+','+rs.point.lat);  
            });    
        });    
    }, 1000);   
</script>  

 

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值