如何使用mapstraction延迟标记加载openlayers地图

发布于 2024-12-03 14:52:43 字数 1298 浏览 2 评论 0原文

我有一个页面，在通过 mapstraction 使用的 openlayers 地图中显示 10 个标记。

我想先加载地图，然后逐个标记，比如每秒一次，我尝试使用 window.setTimeout() 它加载地图，并在停止后仅加载第一个标记。

  var map;
  var lat = new Array() ;
  lat=${latitude};
  var lon= new Array();
  lon=${longitude};
  var oneByOneCounter=0;
  var count=10;
  function initMap(){  
       map = new Mapstraction('mymap','openlayers');
       map.setCenter(new LatLonPoint(0.0,0.0));
       map.addControls({pan: true, zoom:'small', map_type:true});
       renderMarkerOneByOne();
       map.autoCenterAndZoom();
     };


   function renderMarkerOneByOne() {
   if (oneByOneCounter < count) {
       latitude= lat[oneByOneCounter];
       longitude= lon[oneByOneCounter];
       var point = new LatLonPoint(latitude,longitude);
       var marker = new Marker(point);
       var info = "("+(oneByOneCounter+1)+")";
       marker.setInfoBubble(info);
       marker.setHover(true);
       marker.setIcon('icon_green.png', [27,31]);
       map.addMarker(marker);    
       oneByOneCounter++;
       window.setTimeout("renderMarkerOneByOne()", 1000);
     } else {
       oneByOneCounter = 0;
    }
   }

我无法弄清楚我在哪里做错了 renderMarkerOneByOne() 函数正确执行并且在放置alert() 时我可以看到标记对象一直在创建，但是，出于某种原因，在第一个标记被绘制后，其他标记被绘制出来没有被绘制在地图上。

欢迎任何帮助或建议

谢谢

原文

I have a page with displays 10 markers in an openlayers map used via mapstraction.

I want to load map first then marker one by one say after every second, I tried using window.setTimeout() it loads the map and loads only first marker after that it stops.

  var map;
  var lat = new Array() ;
  lat=${latitude};
  var lon= new Array();
  lon=${longitude};
  var oneByOneCounter=0;
  var count=10;
  function initMap(){  
       map = new Mapstraction('mymap','openlayers');
       map.setCenter(new LatLonPoint(0.0,0.0));
       map.addControls({pan: true, zoom:'small', map_type:true});
       renderMarkerOneByOne();
       map.autoCenterAndZoom();
     };


   function renderMarkerOneByOne() {
   if (oneByOneCounter < count) {
       latitude= lat[oneByOneCounter];
       longitude= lon[oneByOneCounter];
       var point = new LatLonPoint(latitude,longitude);
       var marker = new Marker(point);
       var info = "("+(oneByOneCounter+1)+")";
       marker.setInfoBubble(info);
       marker.setHover(true);
       marker.setIcon('icon_green.png', [27,31]);
       map.addMarker(marker);    
       oneByOneCounter++;
       window.setTimeout("renderMarkerOneByOne()", 1000);
     } else {
       oneByOneCounter = 0;
    }
   }

I am not able to figure out where I am doing wrong renderMarkerOneByOne() function executes properly and on putting alert() I can see the marker object is getting created all the time but, for some reason after the first marker gets plotted the other markers are not getting plotted on the map.

Any help or suggestion is welcomed

Thanks

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

行至春深 2024-12-10 14:52:43

尝试 setInterval()，而不是 setTimeout()。

回复收藏 0 原文

轻拂→两袖风尘 2024-12-10 14:52:43

一定是这样的，

var map;
var lat = new Array() ;
lat=${latitude};
var lon= new Array();
lon=${longitude};
var oneByOneCounter=0;
var count=10;
var centerPoint;
function initMap(){  
   map = new Mapstraction('mymap','openlayers');    
   map.addControls({pan: true, zoom:'small', map_type:true});
  centerPoint= new LatLonPoint(lat[0],lon[0]);// or any point anyone wants to put center
   renderMarkerOneByOne();
   map.setCenterAndZoom(centerPoint,"desired zoom level");
 };

我在调试代码上浪费了太多时间后找到了解决方案。许多 mapstraction 函数无法与 openlayers api 一起正常工作

It has to be something like this

var map;
var lat = new Array() ;
lat=${latitude};
var lon= new Array();
lon=${longitude};
var oneByOneCounter=0;
var count=10;
var centerPoint;
function initMap(){  
   map = new Mapstraction('mymap','openlayers');    
   map.addControls({pan: true, zoom:'small', map_type:true});
  centerPoint= new LatLonPoint(lat[0],lon[0]);// or any point anyone wants to put center
   renderMarkerOneByOne();
   map.setCenterAndZoom(centerPoint,"desired zoom level");
 };

I found the solution after wasting too much time on debugging the code. Lots of mapstraction functions doesn't work properly with openlayers api

回复收藏 0 原文

~没有更多了~