javascript - how to make round corners of infowindow in the V3 of Google Map? - Stack Overflow

admin管理员组

文章数量:1391990

I am currently creating a map with multiple markers using the API V3 of Google Map. a click on the marker triggers the display of an InfoWindow describing details of this latter.

I need to know how to make the corners of my InfoWindow round like in the API V2 of Google Map?

I am currently creating a map with multiple markers using the API V3 of Google Map. a click on the marker triggers the display of an InfoWindow describing details of this latter.

I need to know how to make the corners of my InfoWindow round like in the API V2 of Google Map?

• javascript
• google-maps
• google-maps-api-3

Share Improve this question Follow edited Oct 28, 2016 at 21:25 geocodezip 161k1414 gold badges226226 silver badges254254 bronze badges asked Aug 16, 2012 at 14:18 user1603417user1603417 4911 silver badge22 bronze badges 1

• check this answer stackoverflow./questions/3860277/… – Jorge Commented Aug 16, 2012 at 14:31

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 1

The infobubble lets you create custom infowindows and configure them (pretty much) how you like.

You can't customize the css of the existing InfoWindow, but you can replace it with something more customizable. I like InfoBox because it is very similar to the regular InfoWIndow but with more styling options. InfoBox is actually part of the same Google Maps Utility Library that geocodezip linked to. I remend downloading both and seeing which one fits your needs best.

google-maps-utility-library-v3

I've used this code as a dirty hack to achieve this:

google.maps.event.addListener(this._w, 'domready', function () {
$('#map .bubbleContent')
    .parent().parent().parent().prev()
    .css('borderRadius', 5);
});

This code uses jQuery (can also be done width plain JS). The selector #map .bubbleContent finds the wrapping div of the HTML-Content I've put into the infoWindow. #map is my map container, just to be sure not to select any div out of the map.

Note! This code may break whenever Google changes the markup of the infowindow.

本文标签： javascripthow to make round corners of infowindow in the V3 of Google MapStack Overflow