1

我正在尝试使用 JSNI 在应用程序中显示谷歌地图。我已经在我的 index.html 页面中定义了脚本。

这是 uibinder 的定义（摘录到要点）：

<g:HTMLPanel ui:field="mapboxV3ContentPanel">
    <!-- div for display of the actual map -->
    <div id="map"><!-- --></div>
</g:HTMLPanel>

这是 initializeMap() 原生函数：

private native void initializeMap() /*-{

    var latLng = new $wnd.google.maps.LatLng(-34.397, 150.644);
    var mapOptions = {
        zoom: 8,
        center: latLng,
        mapTypeId: $wnd.google.maps.MapTypeId.ROADMAP
    };
    var mapDiv = $doc.getElementById('map');
    if (mapDiv==null) {
        alert("MapDiv is null!");
    }
    var map = new $wnd.google.maps.Map(mapDiv, mapOptions);
}-*/;

不幸的是，mapDiv 为空。有什么帮助吗？

我知道 gwt-maps 和 gwt-maps-v3 项目。第一个只支持 API 的 v2，而 gwt-maps-v3 对我不起作用，因此是 JSNI 方法。

4

1 回答 1

3

原则上，您的代码应该可以工作，而且我已经对其进行了快速测试（顺便说一下，它根本不应该与 Google Maps API 相关）。

唯一重要的是，您在调用之前将您的添加<div id="map"> 到文档initializeMap()中。

请尝试以下方法：

@Override
public void onModuleLoad() {

  RootPanel.get().add(new MyUiBinderWidget()); // your widget with the map div
  initializeMap();
}

请特别注意，您不能initializeMap()从 的构造函数内部调用MyUiBinderWidget，因为此时小部件尚未附加到文档。

于 2011-04-10T17:11:11.100 回答