如何在每次搜索时清除地图?

时间:2015-07-16 14:29:36

标签: javascript ajax google-maps

我有一个带有基本标记和AJAX的实时舰队谷歌地图。我的查询(PHP)具有公交车号码(12031)和路线(A11)的过滤器。当我第一次进行搜索时它完美地工作并向我显示标记,但是当我进行第二次搜索时,旧标记会保留在地图中。如何在每次搜索时清除地图?

地图:

http://190.216.202.35/busestr/pruebabuses.php

AJAX:

    function ajax(){    //When the Window finishes loading...
var dire;

//$('#ruta').on("focus", function(){
var value=$.trim($("#ruta").val());
if(value.length>0)
{

dire = "marks.php?ruta="+ruta;

}
var value=$.trim($("#bus").val());
if(value.length>0)
{
dire = "marks.php?bus="+bus;
}



  $.ajax({                
          type: "POST",
          dataType: "json",
          // data: {name:'A21'},
          url: dire,                  
          //cache: true,
          success: function setmap(data){

                  for (var i =0; i < data.length; i++){
                    //  console.log (data[i].BUSNUMBER)

    // console.log (data);
    data[i].GPSX = data[i].GPSX.replace("-76","-76.");
        data[i].GPSY = data[i].GPSY.replace("3","3.");  
      var myLatLng = new google.maps.LatLng(data[i].GPSY, data[i].GPSX);
// console.log (myLatLng);
        if (markerarray[data[i].BUSNUMBER] && markerarray[data[i].BUSNUMBER].setPosition){
          markerarray[data[i].BUSNUMBER].setPosition(myLatLng)}
        else {
          marker[i] =  new MarkerWithLabel({
            map:map,
            //labelClass: "mylabels",
            labelStyle: {opacity: 1.0},
            labelContent: '<div>'+ data[i].BUSNUMBER+'<br>'+data[i].LINEA+'</div>',
            //icon:{
              //some options here
            //}
          });
          markerarray[data[i].BUSNUMBER] = marker[i];
          marker[i].setPosition(myLatLng);
        markers.push(marker[i])



        }}}
        });


    }

按钮:

       $("#Botbuscar").click(function() {
     ruta = document.getElementById("ruta").value;
      if (marker.length == 0){var casa = setInterval(ajax,2000);}
      else  (clearInterval(casa), clearMarkers())


     $("#Botbuscar").val("");
     return false; 

  });
    $("#Botbuscar").click(function() {
     bus = document.getElementById("bus").value;
      if (marker.length == 0){var casa = setInterval(ajax,2000);}
      else  (clearInterval(casa), clearMarkers())
     $("#Botbuscar").val("");
     return false; 

  });



    function setAllMap(map) {
     for (var i = 0; i < marker.length; i++ ) {
        marker[i].setMap(map);
      }
    }


    function clearMarkers() {
      setAllMap(null);
    }

输入

 <form >
Ruta:<input type="text" id="ruta" /><br/>
Bus:<input type="text" id="bus" />
<button id="Botbuscar" >Buscar</button>
</form>

更新

完成清除地图更改输入搜索,但首先用户必须清除de field(额外问题),但是当我想要进行新搜索时,许多标记会保留在地图中如何解决这个问题?

1 个答案:

答案 0 :(得分:0)

在您提供的URL中,我看不到任何要测试的控件,但对于您提供的代码,我认为问题在于for (var i =0; i < data.length; i++){您只编辑了一部分标记,因此标记更大比data.lenght还要像第二次调用之前那样。