I need to put a link in my Google Maps

Question

I have a map on my site, where the location of the property on the map has the logo, in place of the standard Google Maps PIN, a PNG image appears.

I need this image, when clicking, to take to a specific URL, within the site itself. I’ve searched some codes, but it didn’t work.

Follow my code used on the site:

    <script>

// This example adds a marker to indicate the position of Bondi Beach in Sydney,
// Australia.

function initMap() {
  var map = new google.maps.Map(document.getElementById('map'), {
    zoom: 18,
    center: {lat: -27.6041949, lng: -48.466012}
  });


  var image = 'img/marcador.png';
  var beachMarker = new google.maps.Marker({
    position: {lat: -27.6041949, lng: -48.466012},
    map: map,
    icon: image
  });
}

    </script>
    <script async defer
        src="https://maps.googleapis.com/maps/api/js?key=AQUI_VAI_O_MEU_API_&signed_in=true&callback=initMap"></script>

 <style>
     #map {
        height: 432px;
      }
    </style>

Thanks in advance for your cooperation!

Answer 1

Try adding a listener for the event click on marker as in the example below. Using the property window.location you will be able to redirect to a path within the site.

beachMarker.addListener('click', function() {
  window.location = '/index.html';
});

Google Maps API Markers Information at that link.