1

Google マップ InfoWindow 内のコンポーネントのイベントを伝播する方法を理解しようとしています。アンカーまたはボタンを作成し、それらのいずれかでクリック イベントを処理したいと考えています。

ここ と ここで説明されている解決策を見つけました

しかし、どちらも gwt の Google マップ ラッパーを使用しています。これらのライブラリは避けたいと思います。

質問：

これらのイベントを情報ウィンドウから Google マップをラップする GWT パネルに伝達する方法を知っていますか?

4

4 に答える 4

3

ここにあるコードに基づく：http： //gwt-maps3.googlecode.com/svn/trunk/src/com/googlecode/maps3/client/

外部ライブラリを使用しない場合の問題を解決するこのクラスを作成しました（指定されたリンクからInfoWindowJSOソースのみを取得する必要があります）。代わりに、InnerHtmlを文字列としてsetContentに渡します...Widget要素を渡すだけです。

import com.google.gwt.core.client.JavaScriptObject;
import com.google.gwt.dom.client.Element;
import com.google.gwt.user.client.ui.ComplexPanel;
import com.google.gwt.user.client.ui.Widget;

public class InfoWindow
{
        static class FakePanel extends ComplexPanel
        {
                public FakePanel(Widget w)
                {
                        w.removeFromParent();
                        getChildren().add(w);
                        adopt(w);
                }

                @Override
                public boolean isAttached()
                {
                        return true;
                }

                public void detachWidget()
                {
                        this.remove(0);
                }
        }

        /** */
        InfoWindowJSO jso;

        /** If we have a widget, this will exist so we can detach later */
        FakePanel widgetAttacher;

        /** Keep track of this so we can get it again later */
        Widget widgetContent;

        /** */
        public InfoWindow()
        {
                this.jso = InfoWindowJSO.newInstance();
        }

        /** */
        public InfoWindow(InfoWindowOptions opts)
        {
                this.jso = InfoWindowJSO.newInstance(opts);
        }

        /** Detaches the handler and closes */
        public void close()
        {
                this.detachWidget();
                this.jso.close();
        }

        /** Detaches the content widget, if it exists */
        private void detachWidget()
        {
                if (this.widgetAttacher != null)
                {
                        this.widgetAttacher.detachWidget();
                        this.widgetAttacher = null;
                }
        }

        /** */
        public void open(JavaScriptObject map)
        {
                this.jso.open(map);
        }

        public void open(JavaScriptObject map, JavaScriptObject marker)
        {
                this.jso.open(map, marker);
        }

        /** */
        public void setOptions(InfoWindowOptions value)
        {
                this.jso.setOptions(value);
        }

        /** */
        public void setContent(String value)
        {
                this.widgetContent = null;
                this.detachWidget();
                this.jso.setContent(value);
        }

        /** */
        public void setContent(Element value)
        {
                this.widgetContent = null;
                this.detachWidget();
                this.jso.setContent(value);
        }

        /** */
        public void setContent(Widget value)
        {
                this.widgetContent = value;
                this.detachWidget();
                this.jso.setContent(value.getElement());

                if (this.widgetAttacher == null)
                {
                        // Add a hook for the close button click
                        this.jso.addListener("closeclick", new Runnable() {
                                @Override
                                public void run()
                                {
                                        detachWidget();
                                }
                        });
                        this.widgetAttacher = new FakePanel(value);
                }
                else if (this.widgetAttacher.getWidget(0) != value)
                {
                        this.widgetAttacher.detachWidget();
                        this.widgetAttacher = new FakePanel(value);
                }
        }

        /** @return the widget, if a widget was set */
        public Widget getContentWidget()
        {
                return this.widgetContent;
        }

        /** */
        public JavaScriptObject getPosition()
        {
                return this.jso.getPosition();
        }

        /** */
        public void setPosition(JavaScriptObject value)
        {
                this.jso.setPosition(value);
        }

        /** */
        public int getZIndex()
        {
                return this.jso.getZIndex();
        }

        /** */
        public void setZIndex(int value)
        {
                this.jso.setZIndex(value);
        }

        /** */
        public void addListener(String whichEvent, Runnable handler)
        {
                this.jso.addListener(whichEvent, handler);
        }
}
于 2012-09-30T07:01:24.407 に答える
3

A. ブラウザ イベントは DOM ツリーの一番上までバブルします。マップ InfoWindow とウィジェットの両方の親であるウィジェットに、クリック ハンドラーをアタッチできます。次に、ユーザーがボタンをクリックしたときに、イベントのソースをチェックして、それがボタンからのものであることを確認する必要があります。

public void onClick(final ClickEvent event) {    
    Element e = Element.as(event.getNativeEvent().getEventTarget());
    // check if e is your button
}

B. 通常の GWT ボタンを作成し、それに ClickHandler をアタッチできます。InfoWindow 内に配置しないでください。絶対配置とより高い z-index を使用して、その上に配置してください。

于 2012-09-29T22:45:12.447 に答える
1

非常に簡単な解決策は、gwtquery を使用することです。

クリック ハンドラーを追加するマップ内のアンカーを特定し、そのための css セレクターを定義します (たとえば、id=my_link)。

gquery を使用して検索し、イベントを追加します。

$('#my_link').click(new Function() {
   public boolean f(Event e) {
     [...]
     return false; //false means stop propagation and prevent default
   }
});

gwtquery は jquery のラッパーではなく、その API の完全な gwt 実装であるため、プロジェクトに含めてもオーバーロードされず、コンパイラは使用するものだけを取得することに注意してください。

于 2012-10-01T07:23:34.000 に答える