Re: GWT Maps api v3 Custom overlays

1,145 views
Skip to first unread message

Giorgos Kritsotakis

unread,
Nov 16, 2012, 6:53:16 AM11/16/12
to google-we...@googlegroups.com
 I have been able to draw the label, still I can't get the positioning right. This is the code in case someone wants to do something similar:


public class MapLabel {
    private Element div;
    private LatLng latLng;
    private SimplePanel textPanel;
    private String text;
    private OverlayView overlay = OverlayView.create();

    public MapLabel(LatLng latLng, String text, GoogleMap map) {
   
        this.latLng = latLng;
        this.text = text;

        HTML textWidget = new HTML(text);

        textPanel = new SimplePanel();
        textPanel.setStyleName("textOverlayPanel");
        textPanel.add(textWidget);

        initOverlay(overlay);
   
        overlay.setMap(map);
    }

    private final native void initOverlay(JavaScriptObject jso) /*-{
        var instance = this;

        jso.draw = function() {
            $entry(instance.@gr.palmera.maps.client.MapLabel::myDraw()());
        };

        jso.onAdd = function() {
            $entry(instance.@gr.palmera.maps.client.MapLabel::myOnAdd()());
        };

        jso.onRemove = function() {
            $entry(instance.@gr.palmera.maps.client.MapLabel::myOnRemove()());
        };
    }-*/;

    public void myDraw() {
        Point ne = overlay.getProjection().fromLatLngToDivPixel(overlay.getMap().getBounds().getNorthEast());
        Point sw = overlay.getProjection().fromLatLngToDivPixel(overlay.getMap().getBounds().getSouthWest());

        Point p = overlay.getProjection().fromLatLngToDivPixel(latLng);
       
        div.getParentElement().getStyle().setTop(p.getY(), Unit.PX);
        div.getParentElement().getStyle().setLeft(p.getX(), Unit.PX);
       
        div.getStyle().setWidth(100, Unit.PX);
        div.getStyle().setHeight(25, Unit.PX);
    }

    public void myOnAdd() {
        div = DOM.createDiv();
        div.appendChild(textPanel.getElement());
        overlay.getPanes().getFloatPane().appendChild(div);
    }

    public void myOnRemove() {
        div.removeFromParent();
        textPanel.removeFromParent();

        div = null;
        textPanel = null;
    }
}
 

 

msa...@gmail.com

unread,
Feb 23, 2013, 3:38:39 PM2/23/13
to google-we...@googlegroups.com
Try Sasha Maps: http://www.maryanovsky.com/sasha/maps/

It's a maps library written from scratch in GWT, so no issues like inconsistency between the underlying JavaScript API and the Java API that wraps it.



On Thursday, November 15, 2012 3:27:30 PM UTC+4, Giorgos Kritsotakis wrote:
Hello,

I have implemented a gwt map widget for the company that i'm working for.
Everything works great with markers, rectangles et cetera.

The problem is that we need labels (like the white labels used for country names on the
map for instance) on the map and there seems to be a problem with the OverlayView class.

I am supposed to extend OverlayView and implement onAdd, onRemove and draw,
but those methods are now declared final.

From what I have seen, it is a matter of Overlays introduced to GWT, the JavascriptObject class
being changed, and the api not following up. Even the javadoc is outdated. The documentation isn't helping
and all of the articles and tutorials I have found on the net are about previous editions of
the maps library.

Can anybody who has done something similar point me to the right direction?

Reply all
Reply to author
Forward
0 new messages