Skip to content
This repository has been archived by the owner on Jan 19, 2024. It is now read-only.

unable to implement infowindow #155

Open
shu8hamrajput opened this issue Mar 3, 2021 · 1 comment
Open

unable to implement infowindow #155

shu8hamrajput opened this issue Mar 3, 2021 · 1 comment

Comments

@shu8hamrajput
Copy link

i am trying to implement multiple marker with infowindows when marker id clicked but somwhow value of infowindow is undefined. i am new to jquery but all other issues and code examples on internet seems similar to this.
I am really confused if it is happening to me only or there is some change in usage of infowindow functionality.

$('#map')
      .gmap3({
          center:[stores[0].latitude, stores[0].longitude],
          zoom:10,
          mapTypeId: google.maps.MapTypeId.ROADMAP,
          mapTypeControl: true,
          mapTypeControlOptions: {
              style: google.maps.MapTypeControlStyle.DROPDOWN_MENU
            },
            navigationControl: true,
            scrollwheel: true,
            streetViewControl: true
        })
        .marker(markers)
        .infowindow(markers)
        .then(function(infowindow) {
            console.log("info: ", infowindow)
            var map = this.get(0);
            var marker = this.get(1);
            marker.forEach(function(item,i){
                item.addListener('click', function() {
                    infowindow.open(map, item);
                });
            })

        })
@0x77-pl
Copy link

0x77-pl commented Jun 26, 2021

It is not a jQuery problem. Just leave the "content" property of infowindow empty, and add "ctext" or similar property to each marker and use it in your marker.forEach loop. It will dynamically set the content of infowindow.

$('#cmap')
          .gmap3({
              center: [51.08314890, 17.04792140],
              zoom: 11
          })
          .marker([
              //foreach loop or sth similar to generate your markers
              { position: [/*item latitude*/, /*item longitude*/],
                icon: "img/pin.png",
                ctext: "item text to display on infowindow" },
              // end foreach loop
          ])
          .infowindow({
            content: ''
          })
          .then(function (infowindow) {
              var map = this.get(0);
              var marker = this.get(1);
              marker.forEach(function(item,i){
                  item.addListener('click', function() {
                      infowindow.setContent(item.ctext);
                      infowindow.open(map, item);
                  });
              })
          });

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants