Question

I just got an assigment were I have to embed a Google map, from a “My Places” map layer with some “PlaceMarks” on it.

This is pretty easy thanks to Google’s nice built in function.

However, the problem is that it is suppose to change the content on the page that it is embeded on, when a guest click at one of the placemarkers. For example by calling some JavaScript functions.
Another way that will be okay is if there could be some test in the Placemarker description and in this, a link that when pressed, changes the content on the page embeded on, again by calling a JavaScript function of some kind.

Are there any nice way to do this?

Answer 1

You need to listen for the click event for the marker. This is some code from my site:

var marker =new google.maps.Marker({
    position: new google.maps.LatLng(searchResult.Latitude,searchResult.Longitude),
    map: googleMap,
});
google.maps.event.addListener(marker, 'click', function() {
    //Function called when user clicks on the marker.
    //change page content here.
});

You could use an infoWindow to display whatever you need:

google.maps.event.addListener(marker, 'click', function () {
    var infoWindow = new google.maps.InfoWindow();
    infoWindow.setContent("Content shown in infowindow above the map marker.");
    infoWindow.open(googleMap,marker);
});