Berry
Berry

Reputation: 115

Google Maps custom info window

http://plnkr.co/edit/VcsNt1roifC0n64MgzrP

});
var node=document.createElement('div');
  node.innerHTML= '';//set chart URL
  self.infowindow.setOptions({content:node,map:self.map});
 };
}

Line 126: Trying to draw a custominfo window (in which I will have html) for my polygon layer. I can't manage to get it to work once I get to the stage above; causing my map not load. Any help appreciated.

===

Line 108

// Polygon for Outlines
self.polygon2 = new google.maps.FusionTablesLayer({
  suppressInfoWindows: true,
  query: {
    from: self.outlineFTID,
    select: self.outlineColumn
  },
  styleId: 2,
  templateId: 2
});

// generate new polygon window
self.infowindow = new google.maps.InfoWindow();
google.maps.event.addListener(self.polygon1, 'click', function(e) {});
//call drawVisualization when the infowindow is ready
google.maps.event.addListenerOnce(self.infowindow, 'domready', function() {

});

It works so far as here... but when I add the following it breaks:

//create the content for the infowindow
  var node=document.createElement('div');
  node.innerHTML= 'hello';//set your chart URL
  self.infowindow.setOptions({position:e.latLng,content:node,map:self.map});
 });
}

Upvotes: 0

Views: 523

Answers (1)

Ahmad
Ahmad

Reputation: 1474

Cusomize info window like this, you can write any html in description variable as in my case, i write HTML of my own need.

var description = '<h3>'+j.name+'</h3>'
                + '<div>'
                + '<p><b>Map:</b> Open Society Map, <a href="#" onclick="abcd(\''
                + mapOpengeneral + '\')">'+j.name+" "+'Map</a></p>'
                + '</div>';
          var infowindow = new google.maps.InfoWindow({
                content : description
            });
          google.maps.event.addListener(marker,
                    'mouseover', function() {
                        infowindow.open(map, marker);
                    });

Upvotes: 3

Related Questions