title: Refresh google map markers from mysql
body: <p>I can pull this information from my MySQL table and display what I need to but I would like some help on how to refresh this data every 5 seconds or so with the current code that I have.  </p>
  
  <p>There isn't much data to show, just like 5 or 8 markers at any given time. I have included my current code that I use to pull the data.  I am sort of OK with PHP/MySQL but very new to Google Maps.
      </p>
  
  <pre><code>&lt;script type='text/javascript'&gt;
  //This javascript will load when the page loads.
  jQuery(document).ready( function($){
  
          //Initialize the Google Maps
          var geocoder;
          var map;
          var markersArray = [];
          var infos = [];
  
          geocoder = new google.maps.Geocoder();
          var myOptions = {
                zoom: 8,
                mapTypeId: google.maps.MapTypeId.ROADMAP
              }
          //Load the Map into the map_canvas div
          var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
          map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
  
          //Initialize a variable that the auto-size the map to whatever you are plotting
          var bounds = new google.maps.LatLngBounds();
  
          //Initialize the encoded string       
          var encodedString;
  
          //Initialize the array that will hold the contents of the split string
          var stringArray = [];
  
          //Get the value of the encoded string from the hidden input
          encodedString = document.getElementById("encodedString").value;
  
          //Split the encoded string into an array the separates each location
          stringArray = encodedString.split("****");
  
          var x;
       for (x = 0; x &lt; stringArray.length; x = x + 1)
          {
              var addressDetails = [];
              var marker;
              //Separate each field
              addressDetails = stringArray[x].split("&amp;&amp;&amp;");
              //Load the lat, long data
              var lat = new google.maps.LatLng(addressDetails[1], addressDetails[2]);
              var image = new google.maps.MarkerImage(addressDetails[3]);
  
              //Create a new marker and info window
              var marker = new google.maps.Marker({
                  map: map,
                  icon: image,
                  position: lat,
                  content: addressDetails[0]
              });
  
  
  
              //Pushing the markers into an array so that it's easier to manage them
              markersArray.push(marker);
              google.maps.event.addListener( marker, 'click', function () {
                  closeInfos();
                  var info = new google.maps.InfoWindow({content: this.content});
                  //On click the map will load the info window
                  info.open(map,this);
                  infos[0]=info;
              });
  
  
  
  
             //Extends the boundaries of the map to include this new location
             bounds.extend(lat);
          }
          //Takes all the lat, longs in the bounds variable and autosizes the map
          map.fitBounds(bounds);
  
  
  
          //Manages the info windows
          function closeInfos(){
         if(infos.length &gt; 0){
            infos[0].set("marker",null);
            infos[0].close();
            infos.length = 0;
         }
          }
  
  });
  &lt;/script&gt;
  
  &lt;/head&gt;
  &lt;body&gt;
  &lt;div id='input'&gt;
  
      &lt;?php
  
  
      //Initialize your first couple variables
      $encodedString = ""; //This is the string that will hold all your location data
      $x = 0; //This is a trigger to keep the string tidy
  
      //Now we do a simple query to the database
  
      // DB  INFO CONNECTION IS HERE AND WORKS
  
      $result = mysql_query("SELECT * FROM `ulocation` WHERE `ul_lat`!='' AND `ul_long`!='' AND `ul_onduty`='1'",$db1);
  
      //Multiple rows are returned
      while ($row = mysql_fetch_array($result, MYSQL_NUM))
      {
          //This is to keep an empty first or last line from forming, when the string is split
          if ( $x == 0 )
          {
               $separator = "";
          }
          else
          {
               //Each row in the database is separated in the string by four *'s
               $separator = "****";
          }
          $status='0';
          $cadd  = sql::getval('cal_address', 'call', "WHERE    `cal_id`='$row[14]'");
          $num  = sql::getval('cal_num', 'call', "WHERE `cal_id`='$row[14]'");
          $pcond  = sql::getval('cal_pcond', 'call', "WHERE `cal_id`='$row[14]'");
          $list="$num $cadd";
          //Saving to the String, each variable is separated by three &amp;'s
          $encodedString = $encodedString.$separator.
          "&lt;table border=0 width='350' height='20' class='maincolm' cellpadding=0   cellspacing=0&gt;&lt;td align=left valign=top&gt;&lt;h2&gt;&lt;/h2&gt;&lt;/td&gt;&lt;tr&gt;&lt;td width=100%&gt;&lt;font size=3  face=arial&gt;&lt;p&gt;&lt;b&gt;".$row[2].
          "&lt;/b&gt;".
          "&lt;br&gt;Address: $list".
          "&lt;br&gt;Call Type: $pcond".
          "&lt;br&gt;&lt;br&gt;Lat: ".$row[5].
          "&lt;br&gt;Long: ".$row[6].
          "&lt;/td&gt;&lt;/table&gt;".
          "&lt;/p&gt;&amp;&amp;&amp;".$row[5]."&amp;&amp;&amp;".$row[6]."&amp;&amp;&amp;".$row[8]."&amp;&amp;&amp;".$row[14];
          $x = $x + 1;
      }        
      ?&gt;
  
      &lt;input type="hidden" id="encodedString" name="encodedString" value="&lt;?php echo   $encodedString; ?&gt;" /&gt;
  
  
  
  
    &lt;? echo "&lt;body oncontextmenu=\"return false\" style=\"overflow: hidden; \"   topmargin=0 leftmargin=0 rightmargin=0 bottommargin=0&gt;";
  
  
    &lt;div id=\"map_canvas\"&gt;&lt;/div&gt;
    &lt;/body&gt;
    &lt;/html&gt;";
  
    ?&gt;
  </code></pre>
  
  <p>   </p>