Keeping map center at the same position after resizing

[Snowak]

Hello,
I'm having problems keeping the map centered at the same position
after resizing the div. How can I achieve it? Suprisingly the
map.get_center() returns the same position after resizing as it was
before even though the map points to different location...

How can I fix it?
Thanks in advance

[Snowak]

I've just realized there's one more problem. After resizing the map
and then using map.set_center() the point isn't in the middle of the
map. It's position is calculated basing on previous map size...

[Esa]

wctang discovered something new in documentation (Map events):

Developers should trigger this event on the map when the div changes
size: google.maps.event.trigger(map, 'resize') .

[Esa]

See how it works:
http://esa.easypagez.com/v3boundsbox/resize_v3.htm

[Snowak]

Thank you for the answer, but it's not about the size but about
keeping the map center ;) Anyway I've just noticed there's a second
problem related to it - after resizing the map the markers aren't
moved to valid position - they remain where they are...

[Esa]

On Aug 10, 7:42 pm, Snowak <psno...@gmail.com> wrote:
> Thank you for the answer, but it's not about the size but about
> keeping the map center ;)

Right. Following function seems to handle the centering at least with
FF3.5

function checkResize(){
var center = map.get_center();
google.maps.event.trigger(map, 'resize');
map.set_center(center);
}

If the map <div> is dimensioned with relative dimensions, you have to
trigger the function also by:

window.onresize = checkResize;

Haven't tried with markers yet.

[Snowak]

Thanks, it solved the problem. There's just one place left where it's
not working, but it's probably a bug in my code ;) The mistake here
was that I was reading the map center before the div was resized.

[kilkul]

Hey Esa,

I've followed your code sample, but was unable to reposition the map's
center after the container resizing... If you need to see my sample
code, there it is: http://am.fost.ro/

I'm resizing the main window, the container is resizing properly, but
the map's center remains in the original position...

Any clues? I've tested in Firefox 3.5.2, Safari 4.0.2 and Opera 9.64.
In Internet Explorer 8.0.6001 it crashes (but it might be my bad).

[kilkul]

Correction: it seems to be working (even though I don't think
developers should read and set the map's center before and after
triggering the resize event), but only AFTER I drag the map. That is,
when I first load the map, it doesn't recenter on container resize;
but if I drag the map a little, then, on window / container resize, it
will recenter correctly... Damn, that's weird!

On Aug 10, 8:59 pm, Esa <esa.ilm...@gmail.com> wrote:

[Esa]

On Aug 11, 5:31 am, kilkul <kil...@gmail.com> wrote:

> when I first load the map, it doesn't recenter on container resize;
> but if I drag the map a little, then, on window / container resize, it
> will recenter correctly... Damn, that's weird!

I think it is related to this issue:
http://code.google.com/p/gmaps-api-issues/issues/detail?id=1567

[Snowak]

I was just about to report the same thing - markers are jumping to
weird positions if the map is moved a little. Let's just wait till
they fix it ;) Probably a temporary fix would be zooming in and out
the map to make it refresh... sample code:

map.set_zoom(map.get_zoom());

I've just tested it and it's working.

[kilkul]

Nope, I don't think it's related to that bug (even though they seem
similar). My problem occurs when trying to (re)set the map's center,
after resizing (no matter how much) the map's container.

I think my sample should be relevant enough: http://am.fost.ro/

When the page loads, everything is nice and dandy.

If you resize the browser window (let's say, to the size of an iPhone
window), the map's center doesn't "jump" into the viewable area. If
you drag the map and center it, again, in the middle of the (small)
window, and the maximize the browser, the map WILL re-center
correctly. But if you restore it to small-size, same issue: the center
is way outside the viewable area...

BUT: if you position the map by dragging it, to a "relative" center,
then shrink the browser window, the center will be correctly
displayed. Yet again, if you re-maximize the browser, the center WILL
be where it should. But if you shrink the window again... the magic is
gone!

So, is there ANY logical explanation? I KNOW it should only work by
calling the "resize" event (as in google.maps.event.trigger(map,
'resize') ) after resizing the map's container, but... it doesn't! :(

[Dann (Google Employee)]

FYI, this bug has been fixed. The changelog will be updated soon to
reflect other changes in the new release.


If you find that this is still an issue, please reply back to the
thread.


Thanks!

Dann

[kilkul]

Hey Dann,

Indeed, it seems that, now, re-centering the map after resizing its
DIV container works, with the following code (called after the
container resize):

var center = map.get_center();
google.maps.event.trigger(map, 'resize');
map.set_center(center);

But can't there be a more simpler way, without having to read and (re)
set the map's center, before and after calling the "resize" event...?

Thanks!