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

2018-05-14  本文已影响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…..虽然不知所云,但确实解决了实际问题。

上一篇下一篇

猜你喜欢

热点阅读