title: Update Markers without refreshing entire MAP/Page
body: <p>Ok so I got this.</p>
  
  <pre><code>&lt;?php
  
                  $json_pos = file_get_contents("C:\Users\KLAUS\Desktop\New\This SAMP\scriptfiles\positions.json");
              ?&gt;
  
              &lt;!DOCTYPE html&gt;
              &lt;html&gt;
                  &lt;head&gt;
  
                      &lt;title&gt;SA:MP live map&lt;/title&gt;
                      &lt;script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
                      &lt;script type="text/javascript" src="https://www.google.com/jsapi"&gt;&lt;/script&gt;
                      &lt;script src="http://maps.google.com/maps/api/js?sensor=false"&gt;&lt;/script&gt;
                      &lt;style type="text/css"&gt;
                          #map-canvas { display: inline-block; height: 800px; width: 800px; }
                          #map-legend { padding: 10px; background-color: rgba(141, 142, 127, 0.46);}
                      &lt;/style&gt;
                  &lt;/head&gt;
  
                  &lt;body&gt;
                      &lt;div id="map-canvas"&gt;&lt;/div&gt;
  
                      &lt;script src="js/SanMap.min.js"&gt;&lt;/script&gt;
                      &lt;script type="text/javascript"&gt;
  
  
                          // POISION DATA
  
                          var p_pos = &lt;?php echo (empty($json_pos)) ? "" : $json_pos ?&gt;;
  
  
  
  
                          // MAP TYPE
  
                          var mapType = new SanMapType(0, 1, function (zoom, x, y) {
                              return x == -1 &amp;&amp; y == -1 
                              ? "images/tiles/map.outer.png" 
                              : "images/tiles/map." + zoom + "." + x + "." + y + ".png";//Where the tiles are located
                          });
  
                          // SAT TYPE
  
                          var satType = new SanMapType(0, 3, function (zoom, x, y) {
                              return x == -1 &amp;&amp; y == -1 
                              ? null 
                              : "images/tiles/sat." + zoom + "." + x + "." + y + ".png";//Where the tiles are located
                          });
  
                          // CREATE MAP
  
                          var map = SanMap.createMap(document.getElementById('map-canvas'), 
                              {'Map': mapType, 'Satellite': satType}, 2, SanMap.getLatLngFromPos(0,0), false, 'Satellite');
  
                          map.controls[google.maps.ControlPosition.TOP_RIGHT].push(document.getElementById('map-legend'));
  
  
                          // IF ONLINE THEN DO FUNCTION CREATE MARKER
  
                          if(p_pos !== "")
                          {
                              for (var i = 0; i &lt; Object.keys(p_pos).length; i++) 
                              {
                                  if(p_pos[i].online == 1) createMarker(i);
                              }
                          }
  
  
  
  
  
  
  
  
  
  
                      // MAKRER FUNCTION
  
                          function createMarker(id)
                          {
  
  
  
  
                              var p_marker = new google.maps.Marker({
                                  position: SanMap.getLatLngFromPos(p_pos[id].x, p_pos[id].y),
                                  map: map,
                                  icon: "images/marker.png"
                              });
  
  
                          }
  
                              function updateMarker(id)
                          {
                              p_marker.setMap(null);
                              p_marker.setPosition(SanMap.getLatLngFromPos(p_pos[id].x, p_pos[id].y))
  
                          }
  
  
                          setInterval(function()
                              { "updateMarker" }, 1000);
  
  
  
                      &lt;/script&gt;
                  &lt;/body&gt;
              &lt;/html&gt;
  </code></pre>
  
  <p>Using that works but I have to refresh the page to see the updated marker position. What I am trying to do is get the markers to update every second without having to refresh the entire page/map</p>
  
  <p>I added this to the bottom thinking it would make it work</p>
  
  <pre><code>    function updateMarker(id)
                          {
                              p_marker.setMap(null);
                              p_marker.setPosition(SanMap.getLatLngFromPos(p_pos[id].x, p_pos[id].y))
  
                          }
  
  
                          setInterval(function()
                              { "updateMarker" }, 1000);
  </code></pre>
  
  <p>So the total page I have now is this</p>
  
  <pre><code>                &lt;?php
  
                  $json_pos = file_get_contents("C:\Users\KLAUS\Desktop\New\This SAMP\scriptfiles\positions.json");
              ?&gt;
  
              &lt;!DOCTYPE html&gt;
              &lt;html&gt;
                  &lt;head&gt;
  
                      &lt;title&gt;SA:MP live map&lt;/title&gt;
                      &lt;script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
                      &lt;script type="text/javascript" src="https://www.google.com/jsapi"&gt;&lt;/script&gt;
                      &lt;script src="http://maps.google.com/maps/api/js?sensor=false"&gt;&lt;/script&gt;
                      &lt;style type="text/css"&gt;
                          #map-canvas { display: inline-block; height: 800px; width: 800px; }
                          #map-legend { padding: 10px; background-color: rgba(141, 142, 127, 0.46);}
                      &lt;/style&gt;
                  &lt;/head&gt;
  
                  &lt;body&gt;
                      &lt;div id="map-canvas"&gt;&lt;/div&gt;
  
                      &lt;script src="js/SanMap.min.js"&gt;&lt;/script&gt;
                      &lt;script type="text/javascript"&gt;
  
  
                          // POISION DATA
  
                          var p_pos = &lt;?php echo (empty($json_pos)) ? "" : $json_pos ?&gt;;
  
  
  
  
                          // MAP TYPE
  
                          var mapType = new SanMapType(0, 1, function (zoom, x, y) {
                              return x == -1 &amp;&amp; y == -1 
                              ? "images/tiles/map.outer.png" 
                              : "images/tiles/map." + zoom + "." + x + "." + y + ".png";//Where the tiles are located
                          });
  
                          // SAT TYPE
  
                          var satType = new SanMapType(0, 3, function (zoom, x, y) {
                              return x == -1 &amp;&amp; y == -1 
                              ? null 
                              : "images/tiles/sat." + zoom + "." + x + "." + y + ".png";//Where the tiles are located
                          });
  
                          // CREATE MAP
  
                          var map = SanMap.createMap(document.getElementById('map-canvas'), 
                              {'Map': mapType, 'Satellite': satType}, 2, SanMap.getLatLngFromPos(0,0), false, 'Satellite');
  
                          map.controls[google.maps.ControlPosition.TOP_RIGHT].push(document.getElementById('map-legend'));
  
  
                          // IF ONLINE THEN DO FUNCTION CREATE MARKER
  
                          if(p_pos !== "")
                          {
                              for (var i = 0; i &lt; Object.keys(p_pos).length; i++) 
                              {
                                  if(p_pos[i].online == 1) createMarker(i);
                              }
                          }
  
  
  
  
  
  
  
  
  
  
                      // MAKRER FUNCTION
  
                          function createMarker(id)
                          {
  
  
  
  
                              var p_marker = new google.maps.Marker({
                                  position: SanMap.getLatLngFromPos(p_pos[id].x, p_pos[id].y),
                                  map: map,
                                  icon: "images/marker.png"
                              });
  
  
                          }
  
                              function updateMarker(id)
                          {
                              p_marker.setMap(null);
                              p_marker.setPosition(SanMap.getLatLngFromPos(p_pos[id].x, p_pos[id].y))
  
                          }
  
  
                          setInterval(function()
                              { "updateMarker" }, 1000);
  
  
  
                      &lt;/script&gt;
                  &lt;/body&gt;
              &lt;/html&gt;
  </code></pre>
  
  <p>But its still the same thing, I have to refresh the page to see the updated marker location.</p>
  
  <p>I am so lost in this. Do I have the right idea? Am I putting these in the wrong order? Please help me out </p>