zoukankan      html  css  js  c++  java
  • html5获取经纬度 结合百度地图获取省市区

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html lang="en">
    
    <head>
      <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
      <title>demo</title>
    </head>
    
    <body>
    </body>
    
    </html>
    <script src="http://api.map.baidu.com/api?v=1.4" type="text/javascript"></script>
    <script type="text/javascript">
      function getLocation() {
        var options = {
          enableHighAccuracy: true,
          maximumAge: 1000
        }
        alert('this is getLocation()');
        if (navigator.geolocation) {
          //浏览器支持geolocation
          navigator.geolocation.getCurrentPosition(onSuccess, onError, options);
        } else {
          //浏览器不支持geolocation
          alert('您的浏览器不支持地理位置定位');
        }
      }
    
      //成功时
      function onSuccess(position) {
        console.log(position);
        //返回用户位置
        //经度
        var longitude = position.coords.longitude;
        //纬度
        var latitude = position.coords.latitude;
        alert('当前地址的经纬度:经度' + longitude + ',纬度' + latitude);
        //根据经纬度获取地理位置,不太准确,获取城市区域还是可以的
        var map = new BMap.Map("allmap");
        var point = new BMap.Point(longitude, latitude);
        var gc = new BMap.Geocoder();
        gc.getLocation(point, function (rs) {
          var addComp = rs.addressComponents;
          alert(addComp.province + ", " + addComp.city + ", " + addComp.district + ", " + addComp.street + ", " +
            addComp.streetNumber);
        });
        // 这里后面可以写你的后续操作了
        console.log(longitude, latitude);
      }
      //失败时
      function onError(error) {
        switch (error.code) {
          case 1:
            alert("位置服务被拒绝");
            break;
          case 2:
            alert("暂时获取不到位置信息");
            break;
          case 3:
            alert("获取信息超时");
            break;
          case 4:
            alert("未知错误");
            break;
        }
        // 这里后面可以写你的后续操作了
        // //经度
        // var longitude = 23.1823780000;
        // //纬度
        // var latitude = 113.4233310000;
        console.log(longitude, latitude);
      }
    
      // 页面载入时请求获取当前地理位置
      window.onload = function () {
        // html5获取地理位置
        getLocation();
      };
    </script>
    
    
    <!-- 参考 -->
    <!-- https://www.ucloud.cn/yun/21235.html -->

    在谷歌浏览器好像失败,在苹果电脑浏览器是可以的,手机自带gps,是没问题的

  • 相关阅读:
    Appium+python自动化(三十九)-Appium自动化测试框架综合实践
    Mish:一个新的SOTA激活函数,ReLU的继任者
    [Python爬虫] 使用 Beautiful Soup 4 快速爬取所需的网页信息
    Windows环境下的TensorFlow安装过程
    深度学习必懂的13种概率分布
    LaTeX技巧96:LaTeX 图片控制命令,位置控制
    设置UniDbGrid的整行显示颜色,如果某字段值是我们的控制字段
    UniDBGrid增加显示记录数的label及隐藏refresh按钮
    unidbgrid 设置 单元格颜色
    给uniGUI的表格控件uniDBGrid加上记录序号的列
  • 原文地址:https://www.cnblogs.com/-roc/p/14633518.html
Copyright © 2011-2022 走看看