How to make multiple icon overlays only appear after a certain zoom level on Google Maps MapView?

Question

I am a beginner when it comes to working with the Maps API so please bear with me and I know there have been many other posts dealing with the same issue but I am still stuck.

• I have been able to place some overlay images onto my map. The only issue I am having now is that I do not know how to make them disappear when I zoom out enough levels as this causes the overlay images to crowd together and overlap - basicaly making them useless at that level. So, any help on how to make them appear (after zoom level 18) would be truly appreciated.

• I have tried using a zoom listener and an if statement but it had no change - most likely because I do not know where exactly I need to implement it and/or what other methods are required to enable it. Also, I am not sure on how to implement the draw() method as many others have used this to make it scale and disappear.

Edit:

These are the two classes I have so far which execute successfully (after applying the answer):

The Map.java file:

public class Map extends com.google.android.maps.MapActivity implements
    OnOverlayGestureListener {

private boolean mShowOverlays = true;
private MapView mMapView;
MapView mapView;
MapController mapController;

private void setOverlayVisibility() {
    boolean showOverlays = mMapView.getZoomLevel() > 18;
    if (showOverlays != mShowOverlays) {
        mShowOverlays = showOverlays;
        for (Overlay overlay : mMapView.getOverlays()) {
            if (overlay instanceof ItemOverlay) {
                ((ItemOverlay) overlay).setVisible(showOverlays);
            }
        }
    }

}

/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);

    mapView = (MapView) findViewById(R.id.mapview);
    mapView.setBuiltInZoomControls(true);
    mapController = mapView.getController();
    mapController.setZoom(17);

    boolean showOverlays = mMapView.getZoomLevel() > 18;

    List<Overlay> mapOverlays = mapView.getOverlays();
    Drawable lot = this.getResources().getDrawable(R.drawable.lot);
    ItemOverlay parking_lot = new ItemOverlay(lot, this);
    GeoPoint point1 = new GeoPoint(43806622, -79219797);
    OverlayItem parking = new OverlayItem(point1, "Shopping Center","Parking Lot");

    parking_lot.addOverlayItems(parking);
    mapOverlays.add(parking_lot);

    Drawable logo = this.getResources().getDrawable(R.drawable.entrance);
    ItemOverlay ent = new ItemOverlay(logo, this);
    GeoPoint start = new GeoPoint(43805697, -79221031);
    mapController.setCenter(start);
    OverlayItem welcome = new OverlayItem(start, "Welcome", " ");

    ent.addOverlayItems(welcome);
    mapOverlays.add(ent);

    public <ZoomEvent> boolean onZoom(ZoomEvent ze, ManagedOverlay mo) {
        setOverlayVisibility();    
        return true;
    }

}

@Override
protected boolean isRouteDisplayed() {
    // TODO Auto-generated method stub
    return false;
}

}

The ItemOverlay.java file:

public class ItemOverlay extends ItemizedOverlay<OverlayItem> {
private ArrayList<OverlayItem> mOverlays = new ArrayList<OverlayItem>();
private Context mContext;
private boolean visible = true;

private boolean mVisible = true;

    public void setVisible(boolean value) {
       mVisible = value;
    }
    public boolean isVisible() {
       return mVisible ;
    }

    @Override
    public void draw(android.graphics.Canvas canvas, MapView mapView, boolean shadow) {
        if (mVisible) {
            super.draw(canvas, mapView, shadow);
        }
     }

public ItemOverlay(Drawable defaultMarker, Context context) {
    super(boundCenterBottom(defaultMarker));
    // TODO Auto-generated constructor stub
    mContext = context;
}

public void addOverlayItems(OverlayItem overlay) {
    mOverlays.add(overlay);
    populate();
}

@Override
protected OverlayItem createItem(int i) {
    // TODO Auto-generated method stub
    return mOverlays.get(i);

}

@Override
public int size() {
    // TODO Auto-generated method stub
    return mOverlays.size();
}

@Override
protected boolean onTap(int index) {
    // TODO Auto-generated method stub
    OverlayItem item = mOverlays.get(index);
    AlertDialog.Builder dialog = new AlertDialog.Builder(mContext);
    dialog.setTitle(item.getTitle());
    dialog.setMessage(item.getSnippet());
    dialog.show();
    return true;
}

}

Answer 1

I really like using the OverlayManager library for Android. It adds features to the Google Maps code, and makes a few things a lot easier. Find it here including some demo code that uses it

Option #1: If you use this, then you can use the OverlayManager's gesture listener interface for your MapActivity, to receive a callback for each zoom (in/out) event.

public class Map extends MapActivity implements OnOverlayGestureListener 
{ 
    private boolean mShowOverlays = true;
    private MapView mMapView;     // assign this in onCreate()

    private void setOverlayVisibility() {
        boolean showOverlays = mMapView.getZoomLevel() >= 18;
        if (showOverlays != mShowOverlays) {
           mShowOverlays = showOverlays;
           for (Overlay overlay : mMapView.getOverlays()) { 
              if (overlay instanceof ItemOverlay) { 
                 ((ItemOverlay)overlay).setVisible(showOverlays); 
              } 
           } 
        }
    }

    // this is the onOverlayGestureListener callback:
    public boolean onZoom(ZoomEvent ze, ManagedOverlay mo) {
        setOverlayVisibility();    
        return true;
    }
}

You will have to also add your Map instance as a gesture listener with ManagedOverlay.setOnOverlayGestureListener(). See the sample code for that.

Finally, in your ItemOverlay class, you can override the draw() method, and selectively draw based on whether the overlay has been marked as visible or not. You need to add a custom visible property:

public class ItemOverlay extends ItemizedOverlay {

    private boolean mVisible = true;

    public void setVisible(boolean value) {
       mVisible = value;
    }
    public boolean isVisible() {
       return mVisible ;
    }

    @Override
    public void draw(android.graphics.Canvas canvas, MapView mapView, boolean shadow) {
       if (mVisible) {
           super.draw(canvas, mapView, shadow);
       }
    }
 }

Option #2: Now, using the Overlay Manager library just for this one purpose might be overkill. So, another, probably simpler alternative is to create a zoom listener in the way described in this stack overflow answer. The code Kurru provides would go in your Map class. You would replace this in the answer's code:

checkMapIcons();

with the method I showed above:

setOverlayVisibility();

So, now you have two ways to "watch" the zoom level, and overriding ItemOverlay.draw() allows you to make the markers disappear whenever you like (zoom level < 18 in this example).