how to add more marker in osm map in android

Question

I've found a solution how to map balloon in openstreet map I customize osmbonuspack according to my need is work fine but is only show one map.

How do I add more then one marker in this code which I paste below?

My output URL is work fine just tell me how do I add text in image bubble and also how I add more then one marker in map?

import android.widget.Button;
import android.widget.EditText;
import android.widget.TextView;
import android.widget.Toast;
import com.osmbonuspackdemo.R;

public class NavigationActivity extends Activity 
{
    protected MapView map;
    protected ItemizedOverlayWithBubble<ExtendedOverlayItem> markerOverlays;
    protected ExtendedOverlayItem markerStart;

    @Override public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);

        map = (MapView) findViewById(R.id.map);
        map.setBuiltInZoomControls(true);
        map.setMultiTouchControls(true);
        MapController mapController = map.getController();

        GeoPoint myPoint1 = new GeoPoint(24.893379000000000000, 67.028060900000010000);
        mapController.setZoom(9);
        mapController.setCenter(myPoint1);


        final ArrayList<ExtendedOverlayItem> waypointsItems = new ArrayList<ExtendedOverlayItem>();
        markerOverlays = new ItemizedOverlayWithBubble<ExtendedOverlayItem>(this, waypointsItems, map);
        map.getOverlays().add(markerOverlays);
        markerStart = putMarkerItem(null, myPoint1, "Start", R.drawable.marker_a, R.drawable.rogger_rabbit);
    }

    public ExtendedOverlayItem putMarkerItem(ExtendedOverlayItem item, GeoPoint p, String title, int markerResId, int iconResId) {
            Drawable marker = getResources().getDrawable(markerResId);
            ExtendedOverlayItem overlayItem = new ExtendedOverlayItem(title, "", p);

            overlayItem.setMarker(marker);
            overlayItem.setImage(getResources().getDrawable(iconResId));
            markerOverlays.addItem(overlayItem);
            map.invalidate();

            return overlayItem;
   }  

}

import org.osmdroid.util.GeoPoint;
import org.osmdroid.views.overlay.OverlayItem;
import android.graphics.drawable.Drawable;

public class ExtendedOverlayItem extends OverlayItem {

    private String mTitle, mDescription; // now, they are modifiable
    private String mSubDescription; //a third field that can be displayed in the infowindow, on a third line
    private Drawable mImage; //that will be shown in the infowindow.
    //private GeoPoint mGeoPoint //unfortunately, this is not so simple...

    public ExtendedOverlayItem(String aTitle, String aDescription, GeoPoint aGeoPoint) {
        super(aTitle, aDescription, aGeoPoint);
        mTitle = aTitle;
        mDescription = aDescription;
        mSubDescription = null;
        mImage = null;
    }

    public void setTitle(String aTitle){
        mTitle = aTitle;
    }

    public void setDescription(String aDescription){
        mDescription = aDescription;
    }

    public void setSubDescription(String aSubDescription){
        mSubDescription = aSubDescription;
    }

    public void setImage(Drawable anImage){
        mImage = anImage;
    }

    public String getTitle() {
        return mTitle;
    }

    public String getDescription() {
        return mDescription;
    }

    public String getSubDescription() {
        return mSubDescription;
    }

    public Drawable getImage() {
        return mImage;
    }
}


public class InfoWindow {

    protected View mView;
    protected boolean mIsVisible = false;
    protected MapView mMapView;

    public InfoWindow(int layoutResId, MapView mapView) {
        mMapView = mapView;
        mIsVisible = false;
        ViewGroup parent=(ViewGroup)mapView.getParent();
        Context ctx = mapView.getContext();
        LayoutInflater inflater = (LayoutInflater)ctx.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        /*
        if (layoutResId == 0)
            layoutResId = R.layout.bonuspack_bubble;
        */
        mView = inflater.inflate(layoutResId, parent, false);
        mView.setOnClickListener(new View.OnClickListener() {
            public void onClick(View v) {
                close();
            }
        });
    }

    public View getView() {
        return(mView);
    }

    public void open(GeoPoint position, int offsetX, int offsetY) {
        MapView.LayoutParams lp=new MapView.LayoutParams(
            MapView.LayoutParams.WRAP_CONTENT,
            MapView.LayoutParams.WRAP_CONTENT,
            position, MapView.LayoutParams.BOTTOM_CENTER,
            offsetX, offsetY);
        close();
        mMapView.addView(mView, lp);
        mIsVisible = true;
    }

    public void close() {
        if (mIsVisible) {
            mIsVisible = false;
            ((ViewGroup)mView.getParent()).removeView(mView);
        }
    }

    public void setPosition(GeoPoint p, int offsetX, int offsetY){
        if (mIsVisible){
            open(p, offsetX, offsetY);
        }
    }
}

import org.osmdroid.util.GeoPoint;
import org.osmdroid.views.MapView;
import org.osmdroid.views.overlay.ItemizedIconOverlay;
import org.osmdroid.views.overlay.OverlayItem;
import android.content.Context;
import android.graphics.drawable.Drawable;
import android.view.View;
import android.widget.ImageView;
import android.widget.TextView;

public class ItemizedOverlayWithBubble<Item extends OverlayItem> extends  
ItemizedIconOverlay<Item> {
    protected InfoWindow mBubble; //only one for all items of this overlay => one at  
 a  time
 private Context context;
    protected OverlayItem mItemWithBubble; //the item currently showing the bubble.  
   Null if none.
    final int mTitleId, mDescriptionId, mSubDescriptionId, mImageId;

    public ItemizedOverlayWithBubble(final Context context, final List<Item> aList,  
  final MapView mapView) {
        super(context, aList, new OnItemGestureListener<Item>() {
            @Override public boolean onItemSingleTapUp(final int index, final  
  OverlayItem item) {
                return false;
            }
            @Override public boolean onItemLongPress(final int index, final  
  OverlayItem item) {
                return false;
            }
        });

        String packageName = context.getClass().getPackage().getName();
        int layoutId =  
 context.getResources().getIdentifier("layout/bonuspack_bubble" , null, packageName);
        mTitleId = context.getResources().getIdentifier("id/bubble_title", null, 
 packageName);
        mDescriptionId = 
 context.getResources().getIdentifier("id/bubble_description", null, packageName);
        mSubDescriptionId = 
 context.getResources().getIdentifier("id/bubble_subdescription", null, packageName);
        mImageId = context.getResources().getIdentifier( "id/bubble_image", null,  
 packageName);
        mBubble = new InfoWindow(layoutId, mapView);
        mItemWithBubble = null;
    }

    public void showBubbleOnItem(int index, MapView mapView) {
        ExtendedOverlayItem eItem = (ExtendedOverlayItem)(getItem(index));
        mItemWithBubble = eItem;
        GeoPoint position = eItem.getPoint();
        //update the content of the bubble, based on the item tapped:
        View view = mBubble.getView();
        ((TextView)view.findViewById(mTitleId /*R.id.title*  
/)).setText(eItem.getTitle());
        ((TextView)view.findViewById(mDescriptionId /*R.id.description* 
  /)).setText(eItem.getDescription());

        //handle mSubDescription, hidding or showing the text view:
        TextView subDescText = (TextView)view.findViewById(mSubDescriptionId);
        String subDesc = eItem.getSubDescription();
        if (subDesc != null && !("".equals(subDesc))){
            subDescText.setText(subDesc);
            subDescText.setVisibility(View.VISIBLE);
        } else {
            subDescText.setVisibility(View.GONE);
        }

        ImageView imageView = (ImageView)view.findViewById(mImageId   
   /*R.id.image*/);
        Drawable image = eItem.getImage();
        if (image != null){
            imageView.setBackgroundDrawable(image);
            imageView.setVisibility(View.VISIBLE);
        } else
            imageView.setVisibility(View.GONE);

        int offsetY = -20;
        Drawable marker = eItem.getMarker(OverlayItem.ITEM_STATE_FOCUSED_MASK);
        if (marker != null)
            offsetY = -marker.getIntrinsicHeight()*3/4;
        mBubble.open(position, 0, offsetY);
        mapView.getController().animateTo(position);
    }

    @Override protected boolean onSingleTapUpHelper(final int index, final Item item,  
    final MapView mapView) {
        showBubbleOnItem(index, mapView);
        return true;
    }

    /** @return the item currenty showing the bubble, or null if none.  */
    public OverlayItem getBubbledItem(){
        //TODO: if user taps the bubble to close it, mItemWithBubble is not set 
 to  null...
        return mItemWithBubble;
    }

    @Override public boolean removeItem(Item item){
        boolean result = super.removeItem(item);
        if (mItemWithBubble == item){
                mBubble.close();
                mItemWithBubble = null;
        }
        return result;
    }

    @Override public void removeAllItems(){
        super.removeAllItems();
        mBubble.close();
        mItemWithBubble = null;
    }

  @Override
    public boolean onTouchEvent(MotionEvent event, MapView mapView) 
    {   

        if (event.getAction() == 0) {                
            GeoPoint geopoint = (GeoPoint) mapView.getProjection().fromPixels(
                (int) event.getX(),
                (int) event.getY());
            // latitude
            double lat = geopoint.getLatitudeE6() / 1E6;
            // longitude
            double lon = geopoint.getLongitudeE6() / 1E6;
            Toast.makeText(context, "Lat: " + lat + ", Lon: "+lon,   
  Toast.LENGTH_SHORT).show();
        }                            
        return false;
    } 
 }

Answer 1

Use Itemized Overlay like this (populate method is most important)

public class CustomOverLay extends ItemizedOverlay<OverlayItem> {

private ArrayList<OverlayItem> overlayItems = new ArrayList<OverlayItem>();
private MapView mapView;

public CustomOverLay(Drawable drawable, MapView mapView) {
    super(boundCenterBottom(drawable));
    this.mapView = mapView;
}

public void addOverlayItem(OverlayItem item) {
    overlayItems.add(item);
    populate();
}

@Override
protected OverlayItem createItem(int index) {
    return overlayItems.get(index);
}

@Override
public int size() {
    return overlayItems.size();
}

@Override
protected boolean onTap(int index) {
    return true;
}

}

and once you did this follow the code bellow, add OverlayItem for the number markers you want to place in the Map

List<Overlays> mapOverlays = mapView.getOverlays();
CustomOverLay overlays = new CustomOverLay(drawable, mapView);

GeoPoint p = new GeoPoint(getLat(util.getLatitude()), getLong(util.getLongitude()));
OverlayItem overlayItem = new OverlayItem(p, "", "");
overlays.addOverlayItem(overlayItem);


GeoPoint p = new GeoPoint(getLat(util.getLatitude()), getLong(util.getLongitude()));
OverlayItem overlayItem = new OverlayItem(p, "", "");
overlays.addOverlayItem(overlayItem);

..... so on

mapOverlays.add(overlays);

cheers