0

好的，我的页面通过 JSON 从数据库中获取一些标记，并将它们放在谷歌地图上。它工作正常，但问题是要以一个小的滞后一个一个地显示这个标记，而不是同时显示所有标记。作为谷歌地图 API，我试图使用 setTimeout() 方法......没有进一步的成功。¿ 它与 json 响应不兼容吗？

这是代码：

此函数从数据库中检索所有标记数据并且工作正常。

function cargarsonidos(cuales)
{      
 $.getJSON("automatizar1.php",{que:cuales},function(json)
        {
          marcadores(json);          
        });
}

响应示例：

[{"id_marcador":"2","lat_marcador":"42.9912","long_marcador":"-7.54505","titulo_marcador":"Example data","tipo_marcador":"Example data","nombre_mp3":"example.mp3","dia":"no","descripcion":"Example data","url_video":"NO","video":"NO"}]

现在是在地图中创建标记、信息窗口和地点的功能

var id="";
function marcadores(json)
 {

          $.each(json,function(index,value)
          { 

        id ="a"+json[index].id_marcador;
                var popid="pop"+json[index].id_marcador;
                var lat=json[index].lat_marcador;
                var long=json[index].long_marcador;
                var titulo=json[index].titulo_marcador;
                var icono=json[index].tipo_marcador;
                var mp3=json[index].nombre_mp3;
                var pagina=json[index].id_marcador;
                var descripcion=json[index].descripcion;
                var url_video=json[index].url_video;
                var video=json[index].video;

        id = new google.maps.Marker(
                {

                  position: new google.maps.LatLng (lat, long),
                  map: map,
                  title: titulo,
                  animation: google.maps.Animation.DROP,
                  icon: 'iconos/'+icono+'.png'
                });

setTimeout(function(){markersArray.push(id);}, 200);

                if (video === 'SI')
                {
                       popid = new google.maps.InfoWindow(
                  {

                       content:'<h3>'+titulo+'</h3><br /><iframe width="420" height="315" src="'+url_video+'"       frameborder="0" allowfullscreen></iframe><div id="cambiar"><a href="paginas/contenido.php?sonido='+pagina+'" onMouseOver="mouse_in();" onMouseOut="mouse_out();"><br /><img src="imagenes/datos.png"></a></div>'

                         });
                }   

                google.maps.event.addListener(id,'click', function(){popid.open(map,id);});     

          }); 
}

一切正常，但每个标记之间没有延迟¿为什么？

4

2 回答 2

0

好的，我在这里有解决方案！问题出在线路图：地图中，我必须在所有时间结束时放置标记

功能马卡多雷斯（json）{ 

      $.each(json,function(index,value)
      {    

            var id ="a"+json[index].id_marcador;
            var popid="pop"+json[index].id_marcador;
            var lat=json[index].lat_marcador;
            var long=json[index].long_marcador;
            var titulo=json[index].titulo_marcador;
            var icono=json[index].tipo_marcador;
            var mp3=json[index].nombre_mp3;
            var pagina=json[index].id_marcador;
            var descripcion=json[index].descripcion;
            var url_video=json[index].url_video;
            var video=json[index].video;

            id = new google.maps.Marker(
            {
              //position: new google.maps.LatLng(json[index].posicion_marcador),
              position: new google.maps.LatLng (lat, long),
              //map: map,
              //title: '"'+json[index].titulo_marcador+'"',
              title: titulo,
              animation: google.maps.Animation.DROP,

              icon: 'iconos/'+icono+'.png'
            });
            markersArray.push(id);   

 [...]



      indice=0;     
      for (var i = 0; i<markersArray.length; i++) 
      {
        setTimeout(function() {putMarkers();}, i * 100);
      }

}

function putMarkers()
{
  markersArray[indice].setMap(map);
  indice=indice+1;
}
于 2013-05-12T00:02:33.697 回答
0

首先，您在循环中使用 setTimeout 。这是错误的。

尝试这个;

var index = 0;
function CreateMarker(json) {    
  var id;
  id = "a" + json[index].id_marcador;
  var popid = "pop" + json[index].id_marcador;
  var lat = json[index].lat_marcador;
  var long = json[index].long_marcador;
  var titulo = json[index].titulo_marcador;
  var icono = json[index].tipo_marcador;
  var mp3 = json[index].nombre_mp3;
  var pagina = json[index].id_marcador;
  var descripcion = json[index].descripcion;
  var url_video = json[index].url_video;
  var video = json[index].video;

  markersArray[index] = new google.maps.Marker({
    position: new google.maps.LatLng(lat, long),
    map: map,
    title: titulo,
    animation: google.maps.Animation.DROP,
    icon :'iconos/'+icono+'.png'
  });
  index = index + 1;
  if(index != json.length)
   setTimeout(function() { CreateMarker(json); }, 500); //Recursive
}
于 2013-05-10T19:57:16.913 回答