From what I see, in v2 of GMaps API there was a property \"buttons\" of the InfoWindow object that one could define in a way that given InfoWindow has no close button:
You can just use the option
closeBoxURL : ""
http://google-maps-utility-library-v3.googlecode.com/svn/trunk/infobox/docs/reference.html
From Google Documentation
closeBoxURL | string |
The URL of the image representing the close box. Note: The default is the URL for Google's standard close box. Set this property to "" if no close box is required.
Example
var infowindow = new google.maps.InfoWindow({
closeBoxURL: "",
closeBoxMargin : ""
});
I can't find correct answer in here, so I fixed it myself. It will work well.
google.maps.event.addListener(infowindow, 'domready', function(){
$(".gm-style-iw").parent().find("button").removeAttr("style").hide();
});
I couldn't get any of the $(".gm-style-iw").next("div").hide();
answers to work even when calling the code after the DOM was loaded, since there was a delay between the code being called and the info window being created. What I did was create an interval that runs until it finds the info window and removes the "X" element. If there's a better way please tell me.
var removeCloseButton = setInterval(
function()
{
if ($(".gm-style-iw").length)
{
$(".gm-style-iw").next("div").remove();
clearInterval(removeCloseButton);
}
},
10
);
You can set "closeBoxURL" property of the Info Window to "" and it will make the button disappear.
var infowindow = new google.maps.InfoWindow({
content: contentString,
closeBoxURL: ""
});
My own way (without Jquery) and with realign to the center of the infoWindow:
var content = document.querySelector('.gm-style-iw');
content.parentNode.removeChild(content.nextElementSibling);
content.style.setProperty('width', 'auto', 'important');
content.style.setProperty('right', content.style.left, 'important');
content.style.setProperty('text-align', 'center', 'important');
You can use this. This will not hide other images like zoom control, pan control etc. on dom ready of info window you can use this.
google.maps.event.addListener(infoWindow, 'domready', function () {
document.querySelector(".gm-style-iw").nextElementSibling.style.display = "none";
});