1

JSNI を使用して、アプリケーション内に Google マップを表示しようとしています。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 は null です。そこに何か助けはありますか？

gwt-maps および gwt-maps-v3 プロジェクトを認識しています。1 つ目は 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 に答える