GWT Google Maps V3覆盖小部件

我使用的是GWT谷歌地图V3 API，我需要在地图上显示自定义形状。对于简单的元素，我使用了Polygon，Circle和InfoWidnow类，但我想显示其他一些小部件，如按钮或自定义面板。有没有办法使用OverlayView类来做到这一点？我尝试了一个简单的解决方案：一个包含MapWidget和我的自定义小部件的AbsolutePanel，放在顶部，但我想尽可能多地使用gwt google maps类。我已阅读文档并寻找答案，但我无法弄清楚，所以代码示例会很棒。 Thanx！GWT Google Maps V3覆盖小部件

来源

2012-04-10 Andrei F

我发现我在这里需要什么（的JavaScript API第3版）： https://developers.google.com/maps/documentation/javascript/overlays#CustomOverlays

方法名和类非常相似，所以它不是那么难找出GWT类应该如何使用（如OverlayView的）。

这里是呈现在地图上的自定义部件（包括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; 
    } 

}

来源

2012-07-25 17:24:30

只需使用标准的GWT API和您的地图V3 API。它们将互连良好。

来源

2012-04-10 10:22:21 GingerHead

我已经试过了，它是确定（使用GWT的小部件），但我想作为使用许多类，因为我可以从gwt谷歌地图api（我觉得它更像是OverlayView类）。如果你能提供一个例子或某个地方的链接会很棒。 – 2012-04-10 11:17:04

男人只是链接你的日食中的两个罐子，并使用他们两个 – GingerHead 2012-04-10 11:21:33

我不是这个意思，我的意思是一个代码示例，使用OverlayView在地图上添加自定义小部件，如果可能的话 – 2012-04-10 11:57:20

GWT Google Maps V3覆盖小部件

回答

相关问题