java - Google map GWT 不适合容器尺寸

Question

我在 GWT 应用程序中进行第二次调用以加载 Google map 时遇到问题。问题本身是，一旦调用 map ，它就无法适应容器的大小。这是一个常见的问题，正如之前许多 SO 问题中所描述的:

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

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

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

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

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 尚未完全构建并且检索到错误尺寸时尝试绘制 map 。尝试在回调中绘制/创建 map Scheduler.get().scheduleDeferred()称呼。

更新:另外，您正在混合 DockLayoutPanel与 RootPanel 。这会引起问题。使用RootLayoutPanel相反。

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