How to display an image in the marker information window?


When you click on a marker created with the Google Maps API, you can add an info window, which is what the code below does:

google.maps.event.addListener(marker, 'click', (function(marker, i) {
    return function() {
      infowindow.setContent("image.png");, marker);
  })(marker, i));

How it is played:

However, I would like instead of displaying the text of the image in the balloon, image.png , I would like to see the image in fact. How do I display an image in the marker information window?

asked by anonymous 27.04.2017 / 16:34

1 answer


According to doc from google, you can simply put tag the image into a string and pass it to content of infowindow .


var contentString = '<img src="image.png">';

var infowindow = new google.maps.InfoWindow({
    content: contentString

Following is a fiddle available in the documentation on how to do this.

27.04.2017 / 16:52