Weird Google Map sizing behaviour

Question

I've got a map in a GWT app up at http://corn.appspot.com - I want the map to cover 100% of the height and width of its container. I'm doing this by adding it into a layout panel and not assigning a size, like so:

public void loadMap() {
        LatLng cawkerCity = LatLng.newInstance(39.509, -98.434);
        MapOptions options = MapOptions.newInstance();
        MapWidget map = new MapWidget(cawkerCity, 2, options);
        map.setUIToDefault();
        map.addOverlay(new Marker(cawkerCity));
        mapHolder.add(map);
    }

The problem is that the map displays a small version in the area, then rights itself as soon as you try to change the size of the browser window in any way. Take a look and see for yourselves.

Does anyone have any idea why that would happen?

Answer 1

It seems like your map is rendering if off center due to the size of the container changing. Try a checkResize()

http://code.google.com/apis/maps/documentation/reference.html#GMap2.checkResize

Answer 2

new Timer() {

@Override public void run() {
map.checkResizeAndCenter(); } }.schedule(100);

this will help. regards

Answer 3

Actually, its a lot easier to just do

DeferredCommand.addCommand(new Command(){
  @Override
  public void execute(){
    map.checkResizeAndCenter();
  }
});