Google Map Marker Event

  

Hello,

I have a web application, google map in the page, and in the preparation i have AddMapEvent which has its TrigerringEvent equal to "click", 

and Handler equal to 

SyntaxEditor Code Snippet

function(event) {
    var lat = event.latLng.lat();
    var lng = event.latLng.lng();
    var myLatLng = {lat, lng};
    var marker = new google.maps.Marker({
      position: myLatLng,
      map: this,
      title: 'Hello World!'
     });
    marker.addListener('click', function() {
      alert('test');
      var contentString = '<div>test
            </div>';
      var infowindow = new google.maps.InfoWindow({
          content: contentString
        });
      infowindow.open(this, marker);
    });
};

so, the behavior i want to achieve is that when i click on the map, i get a marker, and when i click on the marker i get an infowindow.

however, i do not get anything with this code.

But, if i remove this portion of the code, the marker appears at map click:

SyntaxEditor Code Snippet

 var contentString = '<div>test
            </div>';

        var infowindow = new google.maps.InfoWindow({
          content: contentString
        });
infowindow.open(this, marker);

Hi Mariam,

I tested your code without making any changes and it worked as expected. When I click on the map, I get a marker, and when I click on the marker, I get an alert message and then an info window.

Are you getting any errors in the console?

Hello,

I have attached my module. Can you please check it?

i am not getting any errors in the console.

Aurelio Santos wrote:

Hi Mariam,

I tested your code without making any changes and it worked as expected. When I click on the map, I get a marker, and when I click on the marker, I get an alert message and then an info window.

Are you getting any errors in the console?



Hi Mariam,

You seem to be using an outdated version of the Google Maps component. I couldn't even run your eSpace in my environment. Is it possible for you to update it to the latest version and test it again?

Hi Mariam,

As @Aurelio mentioned you seem to have an outdated version, did you updated it?

Cheers,

Henrique


Hello,

It did not work with you because i have modified my google maps, however i have removed my modification and updated the google maps. please find the attached module.

hi Mariam,

I have tested google map API using marker and popus, and it works:

Part of the codes is most likely the same with yours:



regards,

bb

Hi Mariam, as your friends comment, are you up to date with the Google Maps components?

Solution

Hi Mariam,

I think I found the problem. You have to remove the line break from the info window content. So this:

var contentString = '<div>test
            </div>';

Becomes this:

var contentString = '<div>test</div>';

I tested it with your OML and it worked.

Solution

Thank you so much it has worked!


Aurelio Santos wrote:

Hi Mariam,

I think I found the problem. You have to remove the line break from the info window content. So this:

var contentString = '<div>test
            </div>';

Becomes this:

var contentString = '<div>test</div>';

I tested it with your OML and it worked.