PHP：如何更改标记而不刷新PHP ajax调用中的谷歌地图？

Question

I'm currently implementing google maps in my php project. I'm showing the markers according to database values. In ajax call the markers are changing. I want to show markers on google map with out refreshing the map.

function load() {

    var map = new google.maps.Map(document.getElementById("offers-map"), {
        center: new google.maps.LatLng(44.910398, -93.271976),
        zoom: 15,
        mapTypeId: 'roadmap'
      });
    var infoWindow = new google.maps.InfoWindow;
     /*  var infoWindow = new google.maps.InfoWindow(); */
      // Change this depending on the name of your PHP file
       $.ajax({  
            type: "POST",  
            url: "logic_abstract.php",   
            success: function(msg){ 
                //alert(msg);
                // call the count values
                countthedata(msg);
                msg = jQuery.parseJSON(msg);
                var len1 = Object.keys(msg).length;
                if(msg =="")
                {
                    swal("There is no data that matches your search criteria");
                }
                for (i=0;i<len1;i++){
                 var mapimgpath = msg[i].imagepath;
                 var type = msg[i].reason_name;
                 var zip = msg[i].zip;
                 var addr = msg[i].addr;
                 var repname = msg[i].repname;
                 var point = new google.maps.LatLng(parseFloat(msg[i].latitude), parseFloat(msg[i].longitude));
                 var html = "<div class='gm-style-iw'><b>" + type + "</b><br>" + repname + "<br>" + addr + " , " + zip+"</div>";
                 var icon='<?php echo  BASE_PATH;?>/mapview/'+mapimgpath;
                 marker = new google.maps.Marker({ map: map, position: point,icon: icon});
                 bindInfoWindow(marker, map, infoWindow, html);
                }
            }
        });    
    }

Answer 1

//create map as global    
var map = new google.maps.Map(document.getElementById("offers-map"), {
        center: new google.maps.LatLng(44.910398, -93.271976),
        zoom: 20,
        mapTypeId: 'roadmap'
      });
      //create global marker array
    var gMarkers=[];
      //global variable for length
    var locationLength=0;
    // call in loading time


    // remove the previous markers
        for(i=0; i<gMarkers.length; i++){
            gMarkers[i].setMap(null);
        }
        gMarkers=[];//empty the global marker array

     var map = new google.maps.Map(document.getElementById("offers-map"), {
            center: new google.maps.LatLng(44.910398, -93.271976),
            zoom: 15,
            mapTypeId: 'roadmap'
          });
        var infoWindow = new google.maps.InfoWindow;
         /*  var infoWindow = new google.maps.InfoWindow(); */
          // Change this depending on the name of your PHP file
           $.ajax({  
                type: "POST",  
                url: "logic_abstract.php",   
                success: function(msg){ 
                    //alert(msg);
                    // call the count values
                    countthedata(msg);
                    msg = jQuery.parseJSON(msg);
                    var len1 = Object.keys(msg).length;
                    if(msg =="")
                    {
                        swal("There is no data that matches your search criteria");
                    }
                    for (i=0;i<len1;i++){
                     var mapimgpath = msg[i].imagepath;
                     var type = msg[i].reason_name;
                     var zip = msg[i].zip;
                     var addr = msg[i].addr;
                     var repname = msg[i].repname;
                     var point = new google.maps.LatLng(parseFloat(msg[i].latitude), parseFloat(msg[i].longitude));
                     var html = "<div class='gm-style-iw'><b>" + type + "</b><br>" + repname + "<br>" + addr + " , " + zip+"</div>";
                     var icon='<?php echo  BASE_PATH;?>/mapview/'+mapimgpath;
                     marker = new google.maps.Marker({ map: map, position: point,icon: icon});
                     bindInfoWindow(marker, map, infoWindow, html);
                    }
                }
            });