PHP群:95885625 Hbuilder+MUI群:81989597 站长QQ:634381967
    您现在的位置: 首页 > 开发编程 > HBuilderX教程 > 正文

    mui获取百度地图定位功能

    作者:admin来源:网络浏览:时间:2020-09-30 00:07:50我要评论
    导读:mui获取百度地图定位功能,把你的key放在下面的代码上就ok了
    把你的key放在下面的代码上就ok了

    1. <!doctype html> 
    2. <html> 
    3.  
    4.     <head> 
    5.         <meta charset="UTF-8"
    6.         <title>mui百度地图定位-www.bcty365.com</title> 
    7.         <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" /> 
    8.         <link href="css/mui.css" rel="stylesheet" /> 
    9.         <style> 
    10.             #container { 
    11.                 width: 100%; 
    12.                 height: 500px; 
    13.                 background: #0062CC; 
    14.             } 
    15.         </style> 
    16.     </head> 
    17.  
    18.     <body> 
    19.         <div class="mui-content"
    20.             <div id="container"
    21.             </div> 
    22.         </div> 
    23.  
    24.         <script src="js/mui.min.js"></script> 
    25.         <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=你的key值"></script> 
    26.         <script type="text/javascript" src="http://developer.baidu.com/map/jsdemo/demo/convertor.js"></script> 
    27.         <script type="text/javascript"
    28.             mui.init(); 
    29.  
    30.             mui.plusReady(function() { 
    31.  
    32.                 var longitude, latitude; 
    33.                 //var map = new BMap.Map("container"); 
    34.  
    35. //                navigator.geolocation.getCurrentPosition(function(position) { 
    36. //                    longitude = position.coords.longitude; 
    37. //                    latitude = position.coords.latitude; 
    38. // 
    39. //                    console.log("longitude:" + longitude + "==latitude:" + latitude); 
    40. //                    var point = new BMap.Point(longitude, latitude); 
    41. //                    map.centerAndZoom(point, 20); // 初始化地图,设置中心点坐标和地图级别   
    42. //                    var marker = new BMap.Marker(point); // 创建标注 
    43. //                    map.addOverlay(marker); // 将标注添加到地图中 
    44. //                    map.panTo(point); 
    45. //                }); 
    46.  
    47.                 plus.geolocation.getCurrentPosition(translatePoint, function(e) { 
    48.                     mui.toast("异常:" + e.message); 
    49.                 }); 
    50.  
    51.                 function translatePoint(position) { 
    52.                     var currentLon = position.coords.longitude; 
    53.                     var currentLat = position.coords.latitude; 
    54.                     var gpsPoint = new BMap.Point(currentLon, currentLat); 
    55.                     BMap.Convertor.translate(gpsPoint, 2, initMap); //坐标转换 
    56.                 } 
    57.  
    58.                 function initMap(point) { 
    59.                     map = new BMap.Map("container"); //创建地图 
    60.                     map.addControl(new BMap.NavigationControl()); 
    61.                     map.addControl(new BMap.ScaleControl()); 
    62.                     map.addControl(new BMap.OverviewMapControl()); 
    63.                     map.centerAndZoom(point, 15); 
    64.                     map.addOverlay(new BMap.Marker(point)); 
    65.  
    66.                 } 
    67.  
    68.                 //                setTimeout(function() { 
    69.                 //                    var gpsPoint = new BMap.Point(longitude, latitude); 
    70.                 //                    BMap.Convertor.translate(gpsPoint, 0, function(point) { 
    71.                 //                        var geoc = new BMap.Geocoder(); 
    72.                 //                        geoc.getLocation(point, function(rs) { 
    73.                 //                            var addComp = rs.addressComponents; 
    74.                 //                            mui.alert(addComp.province + ", " + addComp.city + ", " + addComp.district + ", " + addComp.street + ", " + addComp.streetNumber); 
    75.                 //                        }); 
    76.                 //                    }); 
    77.                 //                }, 3000); 
    78.  
    79.             }); 
    80.         </script> 
    81.     </body> 
    82.  
    83. </html> 

     

    转载请注明(B5教程网)原文链接:https://b5.mxunkeji.com/content-146-5665-1.html
    相关热词搜索: