How to add address in marker google map?

Question

My HTML Code is like this :

<a href="#" class="button" data-latLng="53#separator#-1.33#separator#Address 1">Button 1</a>
<a href="#" class="button" data-latLng="-34.397#separator#150.644#separator#Address 2">Button 2</a>
<div id="map-canvas"></div>

My Javascript Code is like this :

$(document).on("click", ".button", function(e) {
    e.preventDefault();
    var latLng = $(this).attr("data-latLng");           
    initialize(latLng);

    function initialize(latLng) {
        console.log(latLng);
        latLng = latLng.split("#separator#");
        address = latLng[2];
        console.log(address);
        var map;        
        var myCenter=new google.maps.LatLng(latLng[0],latLng[1]);
        var marker=new google.maps.Marker({
            position:myCenter
        });

        var mapProp = {
            center: myCenter,
            zoom: 14,
            mapTypeId:google.maps.MapTypeId.ROADMAP
        };

        map=new google.maps.Map(document.getElementById("map-canvas"),mapProp);
        marker.setMap(map);

        ...
    };
    ...
});

Demo is like this : https://jsfiddle.net/oscar11/b0ahcLxw/

I want display address in marker google map, but i'm still confused. So when click the button, the map automatically displays the address on the marker.

Any solution to solve my problem?

Thank you very much

Answer 1

You did not declare infowindow and contentString variable. So you need to declare infowindow variable like bellow

var infowindow = new google.maps.InfoWindow();

And also declare contentString

var contentString ="Your Content String";

Edit:

// Add this line
var contentString ="Your Content String";
google.maps.event.addListener(marker, 'click', function() {
    // Add this line
    var infowindow = new google.maps.InfoWindow();
    infowindow.setContent(contentString);
    infowindow.open(map, marker);
}); 

JsFiddle Example
Automatically show infowindow JsFiddle Demo