how to change the size of infowindow

24,030 views
Skip to first unread message

zjm1126

unread,
Apr 9, 2010, 2:59:11 AM4/9/10
to Google Maps JavaScript API v3
i want to set the width and height of the infowindow using v3

thanks

Jason Sanford

unread,
Apr 9, 2010, 11:30:46 AM4/9/10
to google-map...@googlegroups.com
The max width of an InfoWindow can be easily changed by: myInfoWindow.setOptions({maxWidth:400});

Then you'd want to style your InfowWindow content with the width you'd like with CSS: .iwContent{width:400px;}

I'm not sure but I think the height is set automatically depending on the content you inject.

On Fri, Apr 9, 2010 at 2:59 AM, zjm1126 <zjm...@gmail.com> wrote:
i want to set the width and height of the infowindow using v3

thanks

--
You received this message because you are subscribed to the Google Groups "Google Maps JavaScript API v3" group.
To post to this group, send email to google-map...@googlegroups.com.
To unsubscribe from this group, send email to google-maps-js-a...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/google-maps-js-api-v3?hl=en.


Tony

unread,
Apr 14, 2010, 8:26:23 AM4/14/10
to Google Maps JavaScript API v3
I have similar req of having to change the width of the infowindow.
What I'm noticing is that there is no issue in making the window
wider, but making it smaller doesnt seem to work. I want the with to
be around 200px. This doesnt seem to work.


On Apr 9, 11:30 am, Jason Sanford <jasonsanf...@gmail.com> wrote:
> The max width of an InfoWindow can be easily changed by:
> myInfoWindow.setOptions({maxWidth:400});
>
> Then you'd want to style your InfowWindow content with the width you'd like
> with CSS: .iwContent{width:400px;}
>
> I'm not sure but I think the height is set automatically depending on the
> content you inject.
>

> On Fri, Apr 9, 2010 at 2:59 AM, zjm1126 <zjm1...@gmail.com> wrote:
> > i want to set the width and height of the infowindow using v3
>
> > thanks
>
> > --
> > You received this message because you are subscribed to the Google Groups
> > "Google Maps JavaScript API v3" group.
> > To post to this group, send email to
> > google-map...@googlegroups.com.
> > To unsubscribe from this group, send email to

> > google-maps-js-a...@googlegroups.com<google-maps-js-api-v3%2Bunsu...@googlegroups.com>

Bradley

unread,
May 17, 2010, 1:32:59 PM5/17/10
to Google Maps JavaScript API v3
I'm also in the same boat here... maxWidth appears to have no affect
whatsoever. I've set maxWidth:150 in my InfoWindowOpts and it's still
200+ px wide.

On Apr 14, 8:26 am, Tony <antonyignat...@gmail.com> wrote:
> I have similar req of having to change the width of theinfowindow.
> What I'm noticing is that there is no issue in making the window
> wider, but making it smaller doesnt seem to work. I want the with to
> be around 200px. This doesnt seem to work.
>
> On Apr 9, 11:30 am, Jason Sanford <jasonsanf...@gmail.com> wrote:
>
>
>
> > The max width of anInfoWindowcan be easily changed by:
> > myInfoWindow.setOptions({maxWidth:400});
>
> > Then you'd want to style your InfowWindow content with the width you'd like
> > with CSS: .iwContent{width:400px;}
>
> > I'm not sure but I think the height is set automatically depending on the
> > content you inject.
>
> > On Fri, Apr 9, 2010 at 2:59 AM, zjm1126 <zjm1...@gmail.com> wrote:
> > > i want to set the width and height of theinfowindowusing v3
>
> > > thanks
>
> > > --
> > > You received this message because you are subscribed to the Google Groups
> > > "Google Maps JavaScript API v3" group.
> > > To post to this group, send email to
> > > google-map...@googlegroups.com.
> > > To unsubscribe from this group, send email to
> > > google-maps-js-a...@googlegroups.com<google-maps-js-api-v3%2B unsub...@googlegroups.com>
> > > .
> > > For more options, visit this group at
> > >http://groups.google.com/group/google-maps-js-api-v3?hl=en.

--
You received this message because you are subscribed to the Google Groups "Google Maps JavaScript API v3" group.
To post to this group, send email to google-map...@googlegroups.com.
To unsubscribe from this group, send email to google-maps-js-a...@googlegroups.com.

Esa

unread,
May 17, 2010, 4:51:32 PM5/17/10
to Google Maps JavaScript API v3
There are certain minimum dimensions for the standard info window. If
you set {maxWidth: 1}, you get an info window with content div of
199px width and 247px total width.

Bradley

unread,
May 26, 2010, 2:25:21 PM5/26/10
to Google Maps JavaScript API v3
For one this min width should definitely be mentioned in the
documentation, i've been ripping my hair out with this. From a
developers perspective it appears to be a bug.

Secondly, is there a reason for this? 250px width is a pretty large
area considering some maps can be pretty small (ie mobile devices)
I'd prefer the min width to be whatever the combined corner radii are
(something like 30px) I don't see any reason why this isn't the case.

Esa

unread,
May 26, 2010, 3:18:36 PM5/26/10
to Google Maps JavaScript API v3
Maybe you should consider a custom info window of your own. In Demo
Gallery you can find two great examples by Pamela:
Custom InfoWindow
http://gmaps-samples-v3.googlecode.com/svn/trunk/infowindow_custom/infowindow-custom.html
and SmartInfoWindow using jQuery
http://gmaps-samples-v3.googlecode.com/svn/trunk/smartinfowindow/smartinfowindow.html

Esa

unread,
May 26, 2010, 3:44:26 PM5/26/10
to Google Maps JavaScript API v3
One more in the utility library. InfoBox by Gary Little
http://google-maps-utility-library-v3.googlecode.com/svn/tags/infobox/1.0/

Reply all
Reply to author
Forward
0 new messages