Google Maps on Android – Part 2: Overlays

In my last post about Google Maps on Android I showed you how to use the basic navigation features of google maps, like moving the map to a defined area and zooming to a given level.
Now as you have centred your map and zoomed in, it would be a good idea to show some kind of marker. Otherwise the user won’t actually realize what you want to show him. How a basic overlay is done, is described in the tutorial on the android developer site, already mentioned in the last post. The HelloItemizedOverlay that is created there, enables you to add as many markers to your map as you want:

List mapOverlays = mapView.getOverlays();
Drawable drawable = this.getResources().getDrawable(R.drawable.synyxLogo);
HelloItemizedOverlay itemizedOverlay = new HelloItemizedOverlay(drawable);
OverlayItem synyxOfficeOverlay = new OverlayItem(synyxOfficeLocation, "Synyx", "This is the Synyx office!");
itemizedOverlay.addOverlay(synyxOfficeOverlay);
// add more overlayItems...
mapOverlays.add(itemizedOverlay);

This will draw a nice marker just at the location of the synyx office. The drawback of this method is, that all markers on the map just look the same. You might think: No problem – just use the setMarker() method of the OverlayItem to set a new marker for just this item. As this looks like the way to do it, it won’t work. All you get is no marker (not the one you just set, nor the default one). The map is just shown as if your marker was not defined at all.
So how to do it? The trick is the static method boundCenterBottom() of the ItemizedOverlay class. This method is also called in the constructor of the HelloItemizedOverlay, when the default marker is set:

public RouteMapOverlay(Drawable defaultMarker, Context context) {
    super(boundCenterBottom(defaultMarker));
    this.context = context;
}

The problem is, that the visibility of this method is set to protected (why?!). So calling it when setting the marker won’t work:

// won't work as boundCenterBottom is protected
synyxOfficeOverlay.setOverlay(ItemizedOverlay.boundCenterBottom(myNewMarker));

Because of this visibility feature, the “easier” way is to add a new setter to your HelloItemizedOverlay class, accepting an OverlayItem and a Drawable to use as the marker. Within that setter, you are able to call the boundCenterBottom() method to set up the marker correctly:

public void addOverlay(OverlayItem overlayItem, Drawable marker) {
    overlayItem.setMarker(boundCenterBottom(marker));
    addOverlay(overlayItem);
}

Now if you use that setter, the map will correctly show your OverlayItem with your marker.
Btw: instead of calling boundCenterBottom() (which places the bottom centre of your Drawable over the defined GeoPoint), you can also use boundCenter() to place the centre of your Drawable over the GeoPoint.

Kommentare

  1. thank u for usefull post

  2. http://mirnauman.wordpress.com/2012/02/13/adding-image-to-googlemaps-using-map-overlays-android-tutorial-part-3/
    solves basic issues with using overlays. and gives a step by step way of adding images to google maps

  3. Really nice post, i think this link too very helpful for the developers searching for map with marker http://android-codes-examples.blogspot.com/2011/04/google-map-example-in-android-with-info.html

  4. Thank you! Very helpful blog post.