美文网首页
JavaScript引入百度地图标注点偏移左上角问题

JavaScript引入百度地图标注点偏移左上角问题

作者: 白纸和笔 | 来源:发表于2018-05-14 16:42 被阅读0次

    在项目中引入了百度地图,运行是发现标注的位置发生了偏移,标注点在左上角(0,0)的位置:


    1.png

    此时看不到标注点,拖动时可以看见。在网上各种百度,在JavaScript中加各种代码,都没有效果,但在一篇博客中看见有这么一段代码:

      var loadCount = 0;
      map.addEventListener("tilesloaded",function(){
          if(loadCount == 1){
              map.setCenter(point);
          }
           loadCount = loadCount + 1;
     });
    

    但运行时标注点依旧在左上角,偶然我将loadCount=1改为loadCount=0,起效果了,打印loadCount出现的是:进入页面是为0:


    01.png

    显示带地图的那个div时为1,2,打印了两次:


    02.png
    (在项目中嵌入地图模块的div开始是隐藏的,选择了模块后才会进入之后才会显示带地图的div)地图上的标注点可以正常的显示页面上:
    2.png

    tilesloaded是检测地图块是否加载完成,当地图所有图块完成加载时触发此事件,每次拖动地图也会触发tilesloaded事件。
    但之后再多次测试中,发现 :
    1)若开始引入百度地图的div显示,则loadCount无论等于多少,if(loadCount == 1)这个判断条件无论判断loadCount等于几,都可以成功将标注点显示在正中心,但一定要有if(loadCount == N)的这个判断条件,不然即使拖动了地图,还是会自动回到正中心位置,这对于有需要拖动地图进行查看的话无疑是弊端,并且loadCount==N的这个条件成立时,拖动地图,标注点会回到正中心。
    2)若打开页面时,引入百度地图的div隐藏了,得初始化loadCount=0 ,再显示时才会正常使标注点处于正中心,代码如下:
    但在项目中最开始使标注点处于正中心的代码为以下代码:
    将此段代码插入到生成地图的JavaScript中:

      var loadCount = 0;
      map.addEventListener("tilesloaded",function(){
         if(loadCount == 1){
              map.setCenter(point);
         }
         loadCount = loadCount + 1;
       });
    

    emmmmm…..虽然不知所云,但确实解决了实际问题。

    相关文章

      网友评论

          本文标题:JavaScript引入百度地图标注点偏移左上角问题

          本文链接:https://www.haomeiwen.com/subject/cejjdftx.html