谷歌地图 GWT 不适合容器大小

Question

我在进行第二次调用以在 GWT 应用中加载 Google 地图时遇到问题。问题本身是，一旦调用地图，它将不适合容器大小。这是一个常见的问题，正如之前许多 SO 问题中所描述的那样：

1. Here
2. Here
3. Here
4. Here

让我声明我已经尝试了上述所有方法，但遗憾的是似乎没有任何效果。我还必须说我使用的是 GWT Maps API v3 的非官方版本，可以在 here 找到。因此，这就是问题所在：

现在，很奇怪，如果我更改浏览器大小，地图会正确显示：

因此，看起来我需要以某种方式“调度” onResize 事件......但我尝试了上述所有方法，但似乎没有任何效果。只是为了澄清这一点，这是我构建地图并将其添加到容器的部分：

private void buildMapMarinesPark() {
    //Visualizar datos...
    LatLng center = LatLng.newInstance(52.62715,1.7734);
        MapOptions opts = MapOptions.newInstance();
        opts.setZoom(9);
        opts.setCenter(center);
        opts.setMapTypeId(MapTypeId.HYBRID);
        MapTypeControlOptions controlOptions = MapTypeControlOptions.newInstance();
        controlOptions.setMapTypeIds(MapTypeId.values()); // use all of them
        controlOptions.setPosition(ControlPosition.TOP_RIGHT);
        opts.setMapTypeControlOptions(controlOptions);
        mapMarinePark = new MapWidget(opts);
        mapMarinePark.setSize("100%", "100%");
        // Add some controls for the zoom level
        List<EuropeanMarineParkDataEntity> parksPerAnio = null;
        listPolygon = new ArrayList<Polygon>();
        Polygon poly = null;
        for(int i=2003;i<=ANIO_MAP_PARK;i++){   
            parksPerAnio = this.hashAnioParks.get(""+i);
            if(parksPerAnio != null){
            for(EuropeanMarineParkDataEntity emp : parksPerAnio){
                poly = this.createPolygon(emp);
                poly.setMap(mapMarinePark);
                listPolygon.add(poly);
                }
            }
        }       
        ((Element)DOM.getElementById("currentYear")).setPropertyObject("innerHTML", ""+(ANIO_MAP_PARK));

        // Add the map to the HTML host page
        final DockLayoutPanel dock = new DockLayoutPanel(Unit.PX);
        dock.addNorth(mapMarinePark, 500);

        RootPanel.get("mapContainerProfile2").add(dock); 
        RootPanel.get("timeline").setVisible(true); 
        RootPanel.get("mapPanel2").setVisible(true); 
        RootPanel.get("gadget_marinepark").setVisible(true); 
        mapMarinePark.triggerResize(); --> Does not work!           
        onLoadedMapMarinePark();

    }

Answer 1

我猜您在 DOM 尚未完全构建并且检索到错误尺寸时尝试绘制地图。 尝试在 a 的回调中绘制/创建地图 Scheduler.get().scheduleDeferred() 打电话。

更新： 此外，您将DockLayoutPanel 与RootPanel 混合在一起。 那会引起问题。请改用RootLayoutPanel。

在您通常将地图添加到DockLayoutPanel 调用scheduleDeferred() 并在回调中将地图添加到面板的位置正常构建 DOM