jQuery Google Maps Get Marker By Id

15,324

You can create a global associative array and store all your markers in there. E.g. like this

var arrMarkers = {};
jQuery.each(json,function(index,value){
    ...
    marker = new google.maps.Marker({
         ...
    });
    arrMarkers[id] = marker;
    ...
    jQuery('.get-direction').on('click', function(){
            var markerID = this.id.replace( /[^\d.]/g,'');
            console.log(arrMarkers[markerID]);
        });
}
Share:
15,324
Admin
Author by

Admin

Updated on June 04, 2022

Comments

  • Admin
    Admin almost 2 years

    I currently have the following code:

    jQuery.each(json,function(index,value){
                var id =json[index]["id"];
                var location =json[index]["location"];
                var tel =json[index]["tel"];
                var lat=json[index]["lat"];
                var lng=json[index]["lng"];
    
                marker = new google.maps.Marker({
                  id:id,
                  position: new google.maps.LatLng (lat, lng),
                  icon: {
                        path: google.maps.SymbolPath.CIRCLE,
                        fillOpacity: 1,
                        fillColor: '#002664',
                        strokeWeight: 1, 
                        strokeColor: '#FFFFFF',
                        scale: 5 //pixels
                    },
                  map: map
                });
    
                google.maps.event.addListener(marker, 'click', function() {
                    jQuery('.office-information').slideUp(300);
                    if(!jQuery('#office-info-'+id).is(':visible')){
                        jQuery('#office-info-'+id).slideDown(300);
                    }
                });
    
                google.maps.event.addListener(marker, 'click', function() {
                });
    
                jQuery('.get-direction').on('click', function(){
                    var markerID = this.id.replace( /[^\d.]/g,'');
                    console.log(marker);
                });
    
          });
    

    The problem area is:

    jQuery('.get-direction').on('click', function(){
                        var markerID = this.id.replace( /[^\d.]/g,'');
                        console.log(marker);
                    });
    

    basically, when I click on a link with a class of get-direction i grab its id and strip everything but the numbers from it, that leaves me with the markers id. But How do I get a marker by id? I actually just need the latitude and longitude from the marker.

    Any Help Greatly Appreciated.