How do I create an automatic GoogleMap marker refresh?

Question

I am working on an mvc project that includes a google map inside

My system allows the user to send tweets to the system and store it in the database, and then display a tweet on the map

what I need to do is "Automatically update the marker on the map when the system receives new data"

any suggestion? thank you very much ^^

Answer 1

You need a script on the server that set the timestamp to check if new records were inserted into the database after this timestamp. If so, the script should return a response with the new information.

AJAX script, normal , timestamp .

AJAX , . AJAX timestamp.

- jQuery:

var lastUpdate = ''; // You need to decide what the server should return
                     //  when you load the map the first time.

function autoUpdate() {
  $.ajax({
    type: "GET",
    url: "check_updates.aspx?last_update=" + lastUpdate,
    dataType: 'json',
    success: function(jsonData) {

      // 1. Check if jsonData is empty. If empty skip to 4.
      //    Else we received some fresh data.
      //
      // 2. Update lastUpdate from the jsonData with the timestamp from 
      //    the server. Don't use JavaScript to update the timestamp, 
      //    because the time on the client and on the server will 
      //    never be exactly in sync.
      //
      // 3. Add new markers on Google Map.
      //    
      // 4. Relaunch the autoUpdate() function in 5 seconds.
      setTimeout(autoUpdate, 5000);
    }
  });
}