Develop Reference

How to draw only the markers that are visible on the map?

I want to learn drawing only the overlayitems that are visible on the map, because i'm showing a map with thousands of markers. I know that i must check if the overlayitem is visible with something like this:
private boolean isLocationVisible(location)
{
Rect currentMapBoundsRect = new Rect();
Point currentDevicePosition = new Point();
GeoPoint deviceLocation = new GeoPoint((int) (location.getLatitude() * 1000000.0), (int) (location.getLongitude() * 1000000.0));
mapView.getProjection().toPixels(deviceLocation, currentDevicePosition);
mapView.getDrawingRect(currentMapBoundsRect);
return currentMapBoundsRect.contains(currentDevicePosition.x, currentDevicePosition.y);
}
and then if this method returns true i must draw the overlayitem, and if not, i must not draw it.
The problem is that i can't override onDraw in OverlayItem, so i didn't know how to achieve my needs.
What should i change in my code to draw only the markers that are visible on the map?
This is my ItemizedOverlayClass:
public class mItemizedOverlay extends ItemizedOverlay<OverlayItem> {
private ArrayList<OverlayItem> mOverlays = new ArrayList<OverlayItem>();
boolean onTapActivated=false;
private Drawable marker = null;
private BusMap map = null;
boolean comingFromFavoriteNameEdit=false;
public BmItemizedOverlay(Drawable defaultMarker, BusMap map) {
super(boundCenterBottom(defaultMarker));
this.map=map;
this.marker=defaultMarker;
}
public mItemizedOverlay(Drawable defaultMarker, BusMap map, boolean onTapActivated) {
super(boundCenterBottom(defaultMarker));
this.map=map;
this.onTapActivated=onTapActivated;
this.marker=defaultMarker;
}
protected OverlayItem createItem(int i){return mOverlays.get(i);}
public int size() {return mOverlays.size();}
public void clear(){mOverlays.clear();}
public void addOverlay(OverlayItem overlay) {
mOverlays.add(overlay);
}
public void setOverlays(ArrayList <OverlayItem> overlays) {
mOverlays=overlays;
populate();
}
public void draw(Canvas canvas, MapView mapView, boolean shadow){
if (mapView.getZoomLevel() > 17){
boundCenterBottom(this.marker);
super.draw(canvas, mapView, false);
}
}
}

You should not have to handle this yourself. It is the job of ItemizedOverlay to only dispatch and draw the markers that are currently present inside the bounds of the visible map. What is leading you to believe this is not already occurring?
If you decide that the current Overlay implementation is not satisfactory, you will likely have better luck using your checking method to determine when to add or remove items from the Overlay, rather than attempting to override the draw calls.

aDrawable.SetBounds(...) doesn't work

I can't succeed to put a custom centered overlay item on my map. It always appears centered on bottom and middle. Here is my code:
------------My overlay item class-------------
public class EditionThumbOverlayItem extends OverlayItem {
public EditionThumbOverlayItem(GeoPoint aGeoPoint, Resources resources) {
super("", "", aGeoPoint);
Drawable pinThumbDrawable = resources.getDrawable(R.drawable.pin_thumb);
pinThumbDrawable.setBounds(pinThumbDrawable.getIntrinsicWidth() * (-2 / 5),
pinThumbDrawable.getIntrinsicHeight() * (-2 / 5), pinThumbDrawable.getIntrinsicWidth() * 3 / 5,
pinThumbDrawable.getIntrinsicHeight() * 3 / 5);
setMarker(pinThumbDrawable);
}
}
-------------my itemized overlay class-----------------
public class PinThumbOverlay extends ItemizedOverlay<OverlayItem> {
// Only one item can be set on this overlay
private OverlayItem mEditionThumb;
public PinThumbOverlay(Drawable pDefaultMarker, ResourceProxy pResourceProxy) {
super(pDefaultMarker, pResourceProxy);
}
#Override
public boolean onSnapToItem(int arg0, int arg1, Point arg2, IMapView arg3) {
return false;
}
#Override
protected OverlayItem createItem(int arg0) {
return mEditionThumb;
}
#Override
public int size() {
if (mEditionThumb == null) {
return 0;
} else {
return 1;
}
}
public void addOverlayItem(OverlayItem overlay) {
mEditionThumb = overlay;
populate();
}
public void removeOverlayItem() {
mEditionThumb = null;
populate();
}
}
-----------------itemized overlay creation----------------------
DefaultResourceProxyImpl defaultResouceProxyImpl = new DefaultResourceProxyImpl(getApplicationContext());
Drawable defaultPinEdition = getResources().getDrawable(R.drawable.pin_thumb);
mPinThumbOverlay = new PinThumbOverlay(defaultPinEdition, defaultResouceProxyImpl);
mMapView.getOverlays().clear();
mMapView.getOverlays().add(mPinThumbOverlay);
-------------------Overlay item creation-------------------------
EditionThumbOverlayItem editionThumb = new EditionThumbOverlayItem(new GeoPoint(mCurrentUserLocation),
getResources());
mPinThumbOverlay.addOverlayItem(editionThumb);
As a note: I use osmdroid map, not default google map api.

It seems that osmdroid overwrites any values you set with the drawble.setBounds() method in the onDrawItem method in ItemizedOverlay:
protected void onDrawItem(final Canvas canvas, final Item item, final Point curScreenCoords) {
final int state = (mDrawFocusedItem && (mFocusedItem == item) ? OverlayItem.ITEM_STATE_FOCUSED_MASK
: 0);
final Drawable marker = (item.getMarker(state) == null) ? getDefaultMarker(state) : item
.getMarker(state);
final HotspotPlace hotspot = item.getMarkerHotspot();
boundToHotspot(marker, hotspot);
// draw it
Overlay.drawAt(canvas, marker, curScreenCoords.x, curScreenCoords.y, false);
}
Or rather, the actual overwriting will be done in the boundToHotspot(marker,hotspot); method.
To overcome this set your hotspot on your OverlayItem instead of setting the bounds on the drawable.
Example:
GeoPoint point = new GeoPoint(currentLoc);
OverlayItem item = new OverlayItem("my location", "my loc", point);
item.setMarkerHotspot(HotspotPlace.BOTTOM_CENTER);
This should produce the result your looking for.

If you just want to put a marker in the map center, use this code snippet:
public class MyActivity extends Activity {
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
this.setContentView(R.layout.main);
mapView = (MapView) findViewById(R.id.mapview);
mapView.setBuiltInZoomControls(true);
mapView.setMultiTouchControls(true);
mapView.setClickable(true);
mapView.setUseDataConnection(true);
mapView.getController().setZoom(MAP_DEFAULT_ZOOM);
mapView.setTileSource(TileSourceFactory.MAPNIK);
resourceProxy = new DefaultResourceProxyImpl(getApplicationContext());
GeoPoint location = getLocation()
ItemizedIconOverlay<OverlayItem> currentLocationOverlay;
Drawable marker = this.getResources().getDrawable(R.drawable.custom_marker);
OverlayItem myLocationOverlayItem = new OverlayItem("Here", "Current Position", location);
myLocationOverlayItem.setMarker(marker);
final ArrayList<OverlayItem> items = new ArrayList<OverlayItem>();
items.add(myLocationOverlayItem);
currentLocationOverlay = new ItemizedIconOverlay<OverlayItem>(items,
new ItemizedIconOverlay.OnItemGestureListener<OverlayItem>() {
public boolean onItemSingleTapUp(final int index, final OverlayItem item) {
return true;
}
public boolean onItemLongPress(final int index, final OverlayItem item) {
return true;
}
}, resourceProxy);
mapView.getOverlays().add(this.currentLocationOverlay);
mapView.getController().setCenter(location);
}

Android Map with selectable pushpin

Is there any way to put a pushpin on an android map and when it's touched displays a popup with some extra info?

You need to extend this http://code.google.com/android/add-ons/google-apis/reference/com/google/android/maps/ItemizedOverlay.html.
public class CustomOverlay extends ItemizedOverlay<OverlayItem> {
private Context context;
private ArrayList<OverlayItem> mOverlays = new ArrayList<OverlayItem>();
public CustomOverlay(Drawable defaultMarker, Context context) {
super(boundCenterBottom(defaultMarker));
this.context = context;
//after adding things to the overlay, call these:
setLastFocusedIndex(-1);
populate();
}
#Override
protected boolean onTap(int index) {
//called when an item is tapped
return true;
}
#Override
public boolean onTap (final GeoPoint p, final MapView mapV) {
boolean tapped = super.onTap(p, mapV);
if(!tapped){
//you can use this to check for other taps on the custom elements you are drawing
}
return true;
}
#Override
public void draw(Canvas canvas, MapView mapV, boolean shadow){
if(!shadow)
// if you have a custom image you may not want the shadow to be drawn
super.draw(canvas,mapV,shadow);
if(selected != null) {
// selected just means that something was clicked
// it isn't defined in this example
Projection projection = mapV.getProjection();
Point drawPoint = projection.toPixels(selected.getPoint(), null);
//get coordinates so you can do your drawing code afterward
}
}
#Override
protected OverlayItem createItem(int i) {
return mOverlays.get(i);
}
#Override
public int size() {
return mOverlays.size();
}
}
This is a very rough sketch of what you need to do. Hope this helps.

Placing shape into MapView in Android

Is there a way to place a shape (drawable or shape of any kind) that occupies a specific area in MapView (lat/lon area) not pixel area . I need that for GeoPoint Clustering purposes
If that is not possible any guidance to do it with projection coordinates would be greatly appreciated. But using the MapView canvas to do this doesn't seem performance-wise since i recycle my Overlay Items all the time and i wish i could take advantage of that too.

Look atItemizedOverlay
I'm culling from my code, so this probably wont' compile out of the box, but should give you enough to figure it out from here...
extended class:
public class MyOverlay extends ItemizedOverlay<OverlayItem>
{
private ArrayList<OverlayItem> mOverlays = new ArrayList<OverlayItem>();
private Context mContext;
private OverlayItem item;
public MyOverlay(Drawable defaultMarker, Context context)
{
super(boundCenterBottom(defaultMarker));
mContext = context;
}
public void addOverlay(OverlayItem overlay)
{
mOverlays.add(overlay);
}
public void doPopulate()
{
populate();
}
#Override
protected OverlayItem createItem(int i)
{
return mOverlays.get(i);
}
#Override
public int size()
{
return mOverlays.size();
}
}
and then in your activity....
public void addLocations(GeoPoint _center)
{
final GeoPoint center = _center;
mapOverlays = mapView.getOverlays();
Drawable drawable = MyActivity.this.getResources().getDrawable(R.drawable.map_annotation_pin);
itemizedoverlay = new ScoopOverlay(drawable,mContext);
//add as many points as you wish...
itemizedoverlay.addOverlay(
new OverlayItem(new GeoPoint(/*lon lat data here*/));
);
showResults.sendEmptyMessage(0);
}
private Handler showResults = new Handler()
{
#Override
public void handleMessage(Message msg)
{
itemizedoverlay.doPopulate();
mapOverlays.add(itemizedoverlay);
mapView.invalidate();
}
};

So the solution is to draw to the ItemizedOverlay that holds the items.
#Override
public void draw(Canvas canvas, MapView mapView, boolean shadow) {
super.draw(canvas, mapView, shadow);
// cycle through all overlays
for (int index = 0; index < mOverlays.size(); index++) {
OverlayItemExtended item = mOverlays.get(index);
// Converts lat/lng-Point to coordinates on the screen
GeoPoint point = item.getPoint();
Point ptScreenCoord = new Point();
mapView.getProjection().toPixels(point, ptScreenCoord);
Paint boxPaint = new Paint();
boxPaint.setColor(android.graphics.Color.WHITE);
boxPaint.setStyle(Paint.Style.FILL);
boxPaint.setAlpha(140);
canvas.drawCircle(ptScreenCoord.X, ptScreenCoord.y,
20, boxPaint);
}
}

adding multiple marker on google map in android

I am triyng to add multiple marker on google map. Here is my code section
public class GoogleMap extends MapView
{
MapController mc;
MapView mapView;
GeoPoint p;
#Override
public void onCreate(Bundle savedInstanceState)
{
....
double lat = Double.parseDouble(bundle.getString("paramLat"));
double lng = Double.parseDouble(bundle.getString("paramLong"));
mc = mapView.getController();
p = new GeoPoint( (int) (lat * 1E6), (int) (lng * 1E6));
mc.animateTo(p);
mc.setZoom(17);
//---Add a location marker---
MapOverlay mapOverlay = new MapOverlay();
List<Overlay> listOfOverlays = mapView.getOverlays();
listOfOverlays.clear();
listOfOverlays.add(mapOverlay);
mapView.invalidate();
}
class MapOverlay extends com.google.android.maps.Overlay
{
#Override
public boolean draw(Canvas canvas, MapView mapView, boolean shadow, long when)
{
super.draw(canvas, mapView, shadow);
//---translate the GeoPoint to screen pixels---
Point screenPts = new Point();
mapView.getProjection().toPixels(p, screenPts);
//---add the marker---
Bitmap bmp = BitmapFactory.decodeResource(getResources(), R.drawable.pushpin);
canvas.drawBitmap(bmp, screenPts.x, screenPts.y-50, null);
return true;
}
}
I have two question here. When i tried to add only one marker, it works but draw method is invoked many times. But why? and when is it invoked?
The second question is how can i add new marker. I created second geoPoint named p2 and after that what should i do? Thank you very much.

I have implemented the multiple markers in my project. Here is the sample code; some things that you need to change is the marker image, the length (number of marker you want define in the for loop). Hope this will help!!!
public class ShowMapActivity extends MapActivity{
private MapController mapControll;
private GeoPoint geoPoint=null;
private MapView mapview;
private MyItemizedOverlay userPicOverlay;
private MyItemizedOverlay nearPicOverlay;
private Drawable userPic,atmPic;
private OverlayItem nearatms[] = new OverlayItem[50];
public static Context context;
#Override
protected void onCreate(Bundle icicle) {
// TODO Auto-generated method stub
super.onCreate(icicle);
context = getApplicationContext();
setContentView(R.layout.your layout xml);
showMap();
}
public void showMap() {
// TODO Auto-generated method stub
try {
geoPoint = new GeoPoint((int)(latitude * 1E6),(int)(longitude * 1E6));
mapview = (MapView)findViewById(R.id.mapview);
mapControll= mapview.getController();
mapview.setBuiltInZoomControls(true);
mapview.setStreetView(true);
mapControll.setZoom(16);
mapControll.animateTo(geoPoint);
userPic = this.getResources().getDrawable(R.drawable.your pic);
userPicOverlay = new MyItemizedOverlay(userPic);
OverlayItem overlayItem = new OverlayItem(geoPoint, "I'm Here!!!", null);
userPicOverlay.addOverlay(overlayItem);
mapview.getOverlays().add(userPicOverlay);
atmPic = this.getResources().getDrawable(R.drawable.your pic);
nearPicOverlay = new MyItemizedOverlay(atmPic);
for (int i = 0; i < define your length here; i++) {
nearatms[i] = new OverlayItem(new GeoPoint((int)((latitude) * 1E6)),(int)(longitude) * 1E6)),"Name", null);//just check the brackets i just made change here so....
nearPicOverlay.addOverlay(nearatms[i]);
}
mapview.getOverlays().add(nearPicOverlay);
//Added symbols will be displayed when map is redrawn so force redraw now
mapview.postInvalidate();
} catch (Exception e) {
e.printStackTrace();
}
}
#Override
protected boolean isRouteDisplayed() {
// TODO Auto-generated method stub
return false;
}
}
Itemized Class for placing the marker
public class MyItemizedOverlay extends ItemizedOverlay<OverlayItem> {
private ArrayList<OverlayItem> myOverlays ;
public MyItemizedOverlay(Drawable defaultMarker) {
super(boundCenterBottom(defaultMarker));
myOverlays = new ArrayList<OverlayItem>();
populate();
}
public void addOverlay(OverlayItem overlay){
myOverlays.add(overlay);
populate();
}
#Override
protected OverlayItem createItem(int i) {
return myOverlays.get(i);
}
// Removes overlay item i
public void removeItem(int i){
myOverlays.remove(i);
populate();
}
// Returns present number of items in list
#Override
public int size() {
return myOverlays.size();
}
public void addOverlayItem(OverlayItem overlayItem) {
myOverlays.add(overlayItem);
populate();
}
public void addOverlayItem(int lat, int lon, String title) {
try {
GeoPoint point = new GeoPoint(lat, lon);
OverlayItem overlayItem = new OverlayItem(point, title, null);
addOverlayItem(overlayItem);
} catch (Exception e) {
// TODO: handle exception
e.printStackTrace();
}
}
#Override
protected boolean onTap(int index) {
// TODO Auto-generated method stub
String title = myOverlays.get(index).getTitle();
Toast.makeText(ShowMapActivity.context, title, Toast.LENGTH_LONG).show();
return super.onTap(index);
}
}

To prevent the multiple drawing you need a cache. This is a bug in the draw method of MapOverlay
To add multiple markers you have to use ItemizedOverlay. This may help you.

You should follow the Android Map View tutorial on the developers site.
Part 2 has the section for building an Overlay.
http://developer.android.com/resources/tutorials/views/hello-mapview.html
Minimal work should be done in the Draw method; it is called a lot including everytime the map is moved/zoomed/"invalidated"

Your going to want to start with an ItemizedOverlay which is an array of points. You can find the documentation here http://code.google.com/android/add-ons/google-apis/reference/index.html . Then your going to want to invoke the ItemizedOverlay.draw() method which will draw all the points within it based on their position. Hope this helps.