Map DIV canvas with round corners?

[Jurgis Stepanovs]

Hallo!

How could I round Google maps DIV canvas corners, is it possible?

Thanks,

Jurgis

[Chad Killingsworth]

By far the easiest way is to use the CSS3 border-radius property:
http://www.css3.info/preview/rounded-border/
Of course with that you will only see the rounded corners in the
newest browsers.

After that, the next best option would be to use transparent PNG files
as custom controls: http://code.google.com/apis/maps/documentation/javascript/controls.html#CustomControls
Custom controls don't actually have to have any interactivity.

Chad Killingsworth

On Nov 3, 6:05 am, Jurgis Stepanovs <jurgis.stepan...@gmail.com>
wrote:

[Jurgis Stepanovs]

I tried but 1st example does not work with Google maps canvas.
Yes, browser correctly creates rounded corners as CSS3 describes, but
Google maps
plot procedures draws over rounded corners, at the end map has shaped
corners.

Will look for 2nd example...

But maybe there some how is possibility to control map canvas draw
function using options?

Jurgis

On 3 nov., 13:44, Chad Killingsworth

<chadkillingswo...@missouristate.edu> wrote:
> By far the easiest way is to use the CSS3 border-radius property:http://www.css3.info/preview/rounded-border/
> Of course with that you will only see the rounded corners in the
> newest browsers.
>
> After that, the next best option would be to use transparent PNG files

> as custom controls:http://code.google.com/apis/maps/documentation/javascript/controls.ht...

[Rossko]

> But maybe there some how is possibility to control map canvas draw
> function using options?

No, there are no options in the maps API for rounded corners. You can
check this for yourself -
http://code.google.com/apis/maps/documentation/javascript/reference.html#MapOptions

[Chad Killingsworth]

There aren't any map options, or methods to override, which allow for
this directly.

I tried a slightly different method here:
http://search.missouristate.edu/map/mobile/examples/corners.htm
Just be careful not to cover the terms of service or the Google logo.

Chad Killingsworth

On Nov 3, 8:51 am, Jurgis Stepanovs <jurgis.stepan...@gmail.com>

[dfd]

On 3 Nov., 16:05, Chad Killingsworth

<chadkillingswo...@missouristate.edu> wrote:
> There aren't any map options, or methods to override, which allow for
> this directly.
>
> I tried a slightly different method here:http://search.missouristate.edu/map/mobile/examples/corners.htm
> Just be careful not to cover the terms of service or the Google logo.

And take care not to "overlay" the "X" Close for StreetView with the
transparent part of the border image - in this specific page above
you cannot escape from StreetView once you are there ;-)

frank