java - 在使用GWT Google Map API3调整网页大小之前，Google map 显示错误

我的应用程序（单个Web页面应用程序）使用GWT-Maps-V3-Api-3.8.1创建Google Map。该应用程序具有许多视图。使用GWT-Maps-V3-Api-3.8.1有两个视图（视图A和视图B）。第一次进入网页时，如果我在视图B之前打开视图A，则视图A中的地图可以，当我导航至视图B时，视图B中的地图显示为不正确


同样，如果fistime转到网页，则在视图A之前打开视图B。视图B中的地图确定，但视图A中的地图具有上述错误。
这是我用来创建地图的代码

public class UiGoogleMap implements IsWidget,ClickMapHandler {

private MapWidget mapWidget=null;

private EventBus eventBus = null;

private List<UiMarker> selectedMarkers = new ArrayList<UiMarker>();

/**
 * ....
 * Some feild here
 * ....
 */


/**
 * Construct the Google map V3 without using {@link EventBus},
 * asynchronously loads the Maps API.
 */
public UiGoogleMap() {
    this(null);
}

public UiGoogleMap(EventBus bus) {
    this(bus, "");
}


public UiGoogleMap(EventBus bus, String mapApiKey) {
    super();
mapWidget=new MapWidget(MapOptions.newInstance());
    this.eventBus = bus;
    initMap();

    mapController = new MapController(mapWidget);
}
private void initMap() {
    mapWidget.setZoom(zoomLevel);
    mapWidget.addClickHandler(this);

    mapWidget.addIdleHandler(new IdleMapHandler() {

        @Override
        public void onEvent(IdleMapEvent event) {
            mapWidget.setSize("100%", "100%");
        }
    });
}

我在正确的情况下检查了mapWidget的div是

<div class="gwt-map-MapWidget-div"><div style="overflow: hidden;"></div></div>

并且mapWidget的div在不正确的情况下是

<div class="gwt-map-MapWidget-div" style="position: relative; overflow: hidden; -webkit-transform: translateZ(0px); background-color: rgb(229, 227, 223);"><div class="gm-style" style="position: absolute; left: 0px; top: 0px; overflow: hidden; width: 100%; height: 100%; z-index: 0;"><div style="position: absolute; left: 0px; top: 0px; overflow: hidden; width: 100%; height: 100%; z-index: 0; cursor: url(http://maps.gstatic.com/mapfiles/openhand_8_8.cur) 8 8, default;"><div style="position: absolute; left: 0px; top: 0px; z-index: 1; width: 100%; transform-origin: 0px 0px 0px; transform: matrix(1, 0, 0, 1, 0, 0);"><div style="-webkit-transform: translateZ(0px); position: absolute; left: 0px; top: 0px; z-index: 100; width: 100%;"><div style="position: absolute; left: 0px; top: 0px; z-index: 0;"><div style="position: absolute; left: 0px; top: 0px; z-index: 1;"></div></div></div><div style="-webkit-transform: translateZ(0px); position: absolute; left: 0px; top: 0px; z-index: 101; width: 100%;"></div><div style="-webkit-transform: translateZ(0px); position: absolute; left: 0px; top: 0px; z-index: 102; width: 100%;"></div><div style="-webkit-transform: translateZ(0px); position: absolute; left: 0px; top: 0px; z-index: 103; width: 100%;"></div><div style="position: absolute; z-index: 0;"><div style="overflow: hidden;"></div></div></div><div style="position: absolute; left: 0px; top: 0px; z-index: 2; width: 100%; height: 100%;"></div><div style="position: absolute; left: 0px; top: 0px; z-index: 3; width: 100%; transform-origin: 0px 0px 0px; transform: matrix(1, 0, 0, 1, 0, 0);"><div style="-webkit-transform: translateZ(0px); position: absolute; left: 0px; top: 0px; z-index: 104; width: 100%;"></div><div style="-webkit-transform: translateZ(0px); position: absolute; left: 0px; top: 0px; z-index: 105; width: 100%;"></div><div style="-webkit-transform: translateZ(0px); position: absolute; left: 0px; top: 0px; z-index: 106; width: 100%;"></div><div style="-webkit-transform: translateZ(0px); position: absolute; left: 0px; top: 0px; z-index: 107; width: 100%;"></div></div></div></div></div>

当我更改窗口浏览器的大小（最小化等）时，错误映射会更改大小并提供正确的映射


我认为也许是问题所在


mapWidget = new MapWidget（MapOptions.newInstance（））;


此代码将创建与上面不同的代码div并导致问题。
感谢您的帮助。

修正：我已经通过添加处理程序解决了上述错误

mapWidget.addIdleHandler(new IdleMapHandler() {

        @Override
        public void onEvent(IdleMapEvent event) {
             MapHandlerRegistration.trigger(mapWidget, MapEventType.RESIZE);
        }
    });

最佳答案

看看triggerResize方法：http://branflake2267.github.io/GWT-Maps-V3-Api/javadoc/3.9.0-build-17/

也许像这样：mapWidget.getMap().triggerResize();