Javascript谷歌地图创建标记从xml数据

Javascript google maps creating markers from xml data

本文关键字：xml 数据 谷歌地图 创建 Javascript      更新时间：2023-09-26

-我有这段代码，我正在Mozilla上测试它。这个代码应该在地图上做大量的标记。我在XML文件中有标记的纬度和经度。当它运行时，它会冻结浏览器几秒钟，只做15个标记。控制台说这"递归太多了"。我还尝试使用for(var I =0; I <x.length;i++)循环，但结果是一样的，除了我在控制台没有得到"太多递归"。>

var map;
var i =0;
var xmldoc=loadXMLDoc("skoly.xml");
var x= xmldoc.getElementsByTagName("skoly");
var image = {url: 'images/blackmarker.png',
                    anchor: new google.maps.Point(0, 10)};
function loop(){
 createMarker(function(){loop();});
 }
  function createMarker(callback) {
  var location =new google.maps.LatLng (xmldoc.getElementsByTagName("gps_latitude")[i].childNodes[0].nodeValue,xmldoc.getElementsByTagName("gps_longitude")[i].childNodes[0].nodeValue);
  var marker = new google.maps.Marker({
        position: location,
        map:map,
        icon: image
         });
         i++;
  if(i < x.length)callback();       
         }
function initialize() {
  var startlatlng = new google.maps.LatLng(49.8037633,15.4749126,7);
  var mapOptions = {
    zoom: 7,
    center: startlatlng
  }
  map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions); 
  loop();
}
google.maps.event.addDomListener(window, 'load', initialize);

for循环代码:

var map;
var xmldoc=loadXMLDoc("skoly.xml");
var x= xmldoc.getElementsByTagName("skoly");
var image = {url: 'images/blackmarker.png',
                    anchor: new google.maps.Point(0, 10)};
  function createMarker(i) {
  var location =new google.maps.LatLng (xmldoc.getElementsByTagName("gps_latitude")[i].childNodes[0].nodeValue,xmldoc.getElementsByTagName("gps_longitude")[i].childNodes[0].nodeValue);
  var marker = new google.maps.Marker({
        position: location,
        map:map,
        icon: image
         });       
         }
function initialize() {
  var startlatlng = new google.maps.LatLng(49.8037633,15.4749126,7);
  var mapOptions = {
    zoom: 7,
    center: startlatlng
  }
  map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);  
  for(var i =0;i < x.length;i++){createMarker(i);}
}
google.maps.event.addDomListener(window, 'load', initialize);

XML文件看起来像:

  <DocumentElement>
    <skoly>
      <stuff1>someting</stuff1>
      <stuff2>something</stuff2>    
      <gps_latitude>49,2816216</gps_latitude>
      <gps_longitude>15,4402835</gps_longitude>
   </skoly>
   <skoly>
     .
     .
   </skoly>
</DocumentElement>

您的loop()和createMarker()函数是相互递归的，这仅仅意味着它们相互调用。

如果我们去掉Google Maps代码，简化loop()函数，并将回调参数重命名为 ，您可以更清楚地看到这一点:
function loop() {
  createMarker(loop);
} 
function createMarker(loop) {
  i++;
  if(i < x.length) loop();
}

loop()调用createMarker()，而createMarker()又调用loop()—直到它在x集合结束时触底。调用堆栈大小将是x长度的两倍，当集合很大时将导致"Too much recursive "错误。

在这种情况下，for循环应该工作得更好，但我们需要看到您的for循环代码(可能还有XML文件)来知道为什么它失败。

相关文章：