Home/ Questions/Q 7190809
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-28T19:35:45+00:00

I’m trying to move a single marker along a route with a function. I

  • 0

I’m trying to move a single marker along a route with a function. I tried to declare the marker in the global scope but it doesn’t seem to work… my other global variables do…

var marker = new google.maps.Marker({map: map});    

        function playTrip(i) {
            if (i < numRows) {
                var lat_value = data.getValue(i,3);
                var lon_value = data.getValue(i,4);
                var loc = new google.maps.LatLng(lat_value, lon_value);
                marker.setPosition(loc);
                i++; 
                setTimeout("playTrip("+(i)+")",20);
            }
        }
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    It is possible to use global variable to store the marker and map also.

    Here is code which will dynamically change the map and marker location.

    <html>
  <head>

<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>     
<script type="text/javascript">     


  var marker = null, map = null;
       var lon = 14.7730;       

        function playTrip() {
            if (lon < 400){
                lon += 1
                var loc = new google.maps.LatLng(56.8848, lon);
                marker.setPosition(loc);
                setTimeout("playTrip()", 3000);
                //bounds.extend(loc);
                map.setCenter(loc);               
            }
            console.log(lon);            
        }   

      (function() {
        window.onload = function(){
            // Creating a LatLng object containing the coordinate for the center of the map  
          var latlng = new google.maps.LatLng(56.83, 15.16);  
          // Creating an object literal containing the properties we want to pass to the map  
          var options = {  
            zoom: 7,
            center: latlng,
            mapTypeId: google.maps.MapTypeId.ROADMAP
          };  
          // Calling the constructor, thereby initializing the map  
          map = new google.maps.Map(document.getElementById('google_map'), options);  

          marker = new google.maps.Marker({
            position: new google.maps.LatLng(56.8848, 14.7730), 
            map: map,
            title: 'My workplace',
            clickable: false,
            icon: 'http://google-maps-icons.googlecode.com/files/factory.png'
          });

          playTrip();                 
        }
      })();

 </script>
  <body>
    <div id="google_map" style="width:500px;height:400px;"></div>
  </body>
</html>

    i have created a page here

    • 0