GWT GoogleマップV3オーバーレイウィジェット

Question

私はGWT google maps V3 APIを使用しており、マップ上にカスタムシェイプを表示する必要があります。 単純な要素については、Polygon、Circle、およびInfoWidnowクラスを使用しましたが、ボタンやカスタムパネルなどの他のウィジェットを表示したいとします。 OverlayViewクラスを使用する方法はありますか？私は単純な解決策を試みました：MapWidgetと私のカスタムウィジェットを含むAbsolutePanelが上に置かれましたが、できる限り私はgwt google mapsクラスを使いたいと思います。私はドキュメントを読んで答えを探しましたが、私はそれを理解することができませんでしたので、コード例が素晴らしいでしょう。 Thanx！

Answer 1

私は私がここで必要なものを（ジャバスクリプトv3のAPIを）見つけ： https://developers.google.com/maps/documentation/javascript/overlays#CustomOverlays

メソッド名とクラスは非常に似ているので、GWTクラスを使用すべきかを把握するそう難しいことではない（のようなオーバーレイビュー）。ここで

が地図上にレンダリング（SVG要素やアニメーションを含む）、カスタムウィジェットを持つ例です。

private class TargettingOverlay extends OverlayView { 

    protected Element div ; 
    protected PanelWrapper panelWrapper; 
    private TargettingEffect targetEffect; 

    TargettingOverlay(){ 
     targetEffect = new TargettingEffect(); 
     targetEffect.setLinedDimension(10500); 
     targetEffect.setLinesOffset(-5000); 
    } 

    void positionTarget(LatLng loc, boolean withoutLines){ 
     if (targetEffect == null) 
      return; 

     if (loc == null) { 
      targetEffect.setElementsVisible(false); 
      return; 
     } 
     targetEffect.setElementsVisible(true); 


     Point p = null; 
     Point sw = null; 
     Point ne = null; 
     LatLng locSW = (LatLng)this.getMap().getBounds().getSouthWest(); 
     LatLng locNE = (LatLng)this.getMap().getBounds().getNorthEast(); 

     // 
     p = (Point)getProjection().fromLatLngToDivPixel(loc); 
     sw = (Point)getProjection().fromLatLngToDivPixel(locSW); 
     ne = (Point)getProjection().fromLatLngToDivPixel(locNE); 



     targetEffect.setWithoutLinles(withoutLines); 
     targetEffect.target((int)ne.getY(), (int)p.getY(), (int)sw.getX(), (int)p.getX()); 
    } 

    @Override 
    public void draw() { 
     Point ne = (Point)getProjection().fromLatLngToDivPixel((LatLng) 
       this.getMap().getBounds().getNorthEast()); 
     Point sw = (Point)getProjection().fromLatLngToDivPixel((LatLng) 
       this.getMap().getBounds().getSouthWest()); 


     div.getStyle().setTop(ne.getY(), Unit.PX); 
     div.getStyle().setLeft(sw.getX(), Unit.PX); 
    } 

    @Override 
    public void onAdd() { 
     div = DOM.createDiv(); 

     getPanes().getOverlayLayer().appendChild(div); 

     panelWrapper = new PanelWrapper(div); 
     panelWrapper.attach();   

     targetEffect.setContainer(panelWrapper); 
    } 

    @Override 
    public void onRemove() { 
     div.removeFromParent(); 
     panelWrapper.removeFromParent(); 

     div = null; 
     panelWrapper = null; 
    } 

} 

Answer 2

地図V3 APIとともに標準のGWT APIを使用してください。彼らは十分に相互接続します。