zoukankan      html  css  js  c++  java
  • 百度地图和solr展示资源和附近等功能的实现 四

    这章主要是定位功能,首先谈谈H5的定位,开始大部分的代码都是这个上面差不多https://www.cnblogs.com/lijuntao/p/6439596.html

    但是第一步定位一直走不通, ie浏览器可以获取到定位的位置外,其他浏览器基本获取不到位置,https试过好像也不行,最后一朋友在国外试代码,结果可用,可怕啊,为啥不用百度地图自己的定位,可能是我技术不到位把,怎么也定位不准,也想过个种办法,最后还是放弃了,才用的H5定位,

    开始用的ie测试的,效果蛮好,测试工程说,其他浏览器都不行,坑啊,没办法得重新换方法。

    经过各种办法想了个委曲求全的方法,项目紧急,先用这个方法顶上去,后续想到其他方法在和大家共享。

    大致思路就是先用高德地图获取定位的位置,再把获取到的经纬度,去百度地图api里面转成百度地图的经纬度,在描绘出定位的点就完美了。

    gaodeMap.html    获取高德地图的定位位置

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="UTF-8">
    <title>Insert title here</title>
     <link rel="stylesheet" href="https://a.amap.com/jsapi_demos/static/demo-center/css/demo-center.css" />
    <!-- 地图 -->
    <script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.13&key=你的ak"></script>
    <!--  <script src="/search/jquery-ui-1.11.4.js"></script> -->
    <script src="/search/js/jquery-1.9.1.min.js"></script>
    <script src="/search/js/jquery-1.9.1.js"></script>
     <style>
            html,body,#container{
                height:100%;
            }
            .info{
                26rem;
            }
        </style>
    </head>
    <body>
     <div id='container'></div>
      <input id="lon" name="lon" type="hidden" value='${lon}'/>
    </body>
    <script type="text/javascript">
    var map = new AMap.Map('container', {
        resizeEnable: true
    });
    AMap.plugin('AMap.Geolocation', function() {
        var geolocation = new AMap.Geolocation({
            enableHighAccuracy: true,//是否使用高精度定位,默认:true
            timeout: 10000,          //超过10秒后停止定位,默认:5s
            buttonPosition:'RB',    //定位按钮的停靠位置
            buttonOffset: new AMap.Pixel(10, 20),//定位按钮与设置的停靠位置的偏移量,默认:Pixel(10, 20)
            zoomToAccuracy: true,   //定位成功后是否自动调整地图视野到定位点
    
        });
        map.addControl(geolocation);
        geolocation.getCurrentPosition(function(status,result){
            if(status=='complete'){
             var pos=result.position;
             $("#lon").val(pos);
            
            }else{
                onError(result)
            }
        });
    }); 
      
    
    
    
    	
    </script>
    </html>
    

      获取到位置后就是谷歌坐标转百度坐标   http://lbsyun.baidu.com/jsdemo.htm#a5_1

    或者是

      原始坐标转百度坐标   http://lbsyun.baidu.com/jsdemo.htm#a5_2

    这里用iframe把百度地图和高德地图放在一起,来获取高德地图的定位位置。我感觉很别扭,在把转换后的百度坐标描绘在百度地图上面,或者传到后台获取附近的功能

    <iframe id="iframeId" src="../searchV3/toGaoDeMap" width="1px" height="1px"
    					frameborder="0"></iframe>
    

      大致思路是这样的。这里也差不多写完了

  • 相关阅读:
    ASP.NET MVC+LINQ开发一个图书销售站点(4):创建一个ASP.NET MVC应用的原型
    ASP.NET MVC+LINQ开发一个图书销售站点(9):编辑目录
    ASP.NET MVC+LINQ开发一个图书销售站点(6):创建数据层
    Linq to SQL Dynamic 动态查询
    RUP简介
    ASP.NET MVC+LINQ开发一个图书销售站点(7):图书分类管理
    ASP.NET MVC+LINQ开发一个图书销售站点(3):建立数据库
    ASP.NET MVC+LINQ开发一个图书销售站点(11):图书管理
    ASP.NET MVC+LINQ开发一个图书销售站点(10):作者管理
    MSDTC不能启动的一个解决方法
  • 原文地址:https://www.cnblogs.com/w1995w/p/10559232.html
Copyright © 2011-2022 走看看