How to over lay images on the googlemaps

Question

I am some images on the SD card. I have also save their longitude and latitude ..Now i want to overlay all these images on the Google map as thumbnail image..and when i click on any thumbnail image it will move to the next activity as show the full picture.I can over lay only one image...and its code is this.....

public void onCreate(Bundle savedInstanceState) 
    {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.googlemap);
        mapView = (MapView) findViewById(R.id.mapView);
        mapView.setBuiltInZoomControls(true);
    //  imm=(ImageView)findViewById(R.id.Google_Img_View);
        mapView.setSatellite(true);
        b=(Button)findViewById(R.id.googleImageDone);
        b.setOnClickListener(this);
        Intent i = getIntent();
        //Parcelable myParcelableObject = (Parcelable) i.getParcelableExtra("name_of_extra");
        bit = (Bitmap) getIntent().getParcelableExtra("Map");
        //imm.setImageBitmap(bit);
        String id = i.getStringExtra("lon");
        String name = i.getStringExtra("long");
//      mapView.setTraffic(true);

        mc = mapView.getController();
        String coordinates[] = {id,name};
        double lat = Double.parseDouble(coordinates[0]);
        double lng = Double.parseDouble(coordinates[1]);
        pp = new GeoPoint((int) (lat * 1E6),    (int) (lng * 1E6));
        mc.animateTo(pp);
        mc.setZoom(19);

        MapOverlay mapOverlay = new MapOverlay();
    List<Overlay> listOfOverlays = mapView.getOverlays();
        listOfOverlays.clear();
        listOfOverlays.add(mapOverlay);
    }

    private class MapOverlay extends Overlay
    {

        @Override
        public boolean draw(Canvas canvas, MapView mapView,
                boolean shadow, long when)
        {
            super.draw(canvas, mapView, shadow);
            Point screenPts = new Point();
            //---translate the GeoPoint to screen pixels---
            mapView.getProjection().toPixels(pp, screenPts);
            //---convert the gif image into bmp         
    //      Bitmap bmp = BitmapFactory.decodeResource(
    //              getResources(), R.drawable.e);
            //---add the marker---
            canvas.drawBitmap(bit, screenPts.x, screenPts.y-50, null);
            return true;
        }

        @Override
        public boolean onTouchEvent(MotionEvent event, MapView mapView)
        {
            if (event.getAction() == 1) 
            {
                GeoPoint p = mapView.getProjection().fromPixels(
                        (int) event.getX(), (int) event.getY());
                st1=p.getLatitudeE6() / 1E6+"";
                st2=p.getLongitudeE6() /1E6+"";

                Toast.makeText(getBaseContext(), "Location: "+
                        p.getLatitudeE6() / 1E6 + "," + p.getLongitudeE6() /1E6 ,
                        Toast.LENGTH_SHORT).show();
            }
            return false;
        }
    }

You should try using Maps API v2 and it's `GroundOverlay`s, as v1 of the API will soon be deprecated. You can create the overlays from `Bitmap`s using `BitmapDescriptor`. — lucian.pantelimon, Jan 31 '13 at 09:04

Anukool · Answer 1 · 2013-01-31T09:27:52.690

Create a class -

public class HelloItemizedOverlay extends ItemizedOverlay<OverlayItem> {
private ArrayList<OverlayItem> mOverlays = new ArrayList<OverlayItem>();
private Context mContext;

public HelloItemizedOverlay(Drawable defaultMarker, Context context) {
    super(boundCenterBottom(defaultMarker));
    mContext = context;
}

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

@Override
protected OverlayItem createItem(int i) {
    return mOverlays.get(i);
}

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

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

Create one more class for Latitute and Longitude conversion-

public class LatLonPoint extends GeoPoint {
public LatLonPoint(double latitude, double longitude) {
    super((int) (latitude * 1E6), (int) (longitude * 1E6));
}
}

And then in your main activity -

mMapView = (MapView) findViewById(R.id.mv);
    mMapView.setBuiltInZoomControls(true);
    List<Overlay> mapOverlays = mMapView.getOverlays();
    Drawable drawable = this.getResources().getDrawable(
            R.drawable.ic_launcher);
    HelloItemizedOverlay itemizedoverlay = new HelloItemizedOverlay(
            drawable, this);
    GeoPoint point = new LatLonPoint(12.917745600000000000,
            77.623788300000000000);
    OverlayItem overlayitem = new OverlayItem(point, "Bangalore!",
            "I'm in Silkboard!");

    GeoPoint point2 = new LatLonPoint(12.8511803, 77.6635172);
    OverlayItem overlayitem2 = new OverlayItem(point2, "Bangalore!",
            "India, Somewhere!");
    itemizedoverlay.addOverlay(overlayitem);
    itemizedoverlay.addOverlay(overlayitem2);
    mapOverlays.add(itemizedoverlay);

To read images from SDcard -

Resources res = getResources();
Bitmap bitmapICON = BitmapFactory.decodeFile("PATH OF THE IMAGE");
BitmapDrawable bdICON = new BitmapDrawable(res, bitmapICON);

you are passing only one drawable from in the helloitemizedoverlay constructor while i need to get all the images from the sdcard.. — user2027862, Jan 31 '13 at 08:59
http://stackoverflow.com/questions/6173388/googlemaps-custom-itemizedoverlay-and-overlayitem-the-correct-way-to-show-diff — Anukool, Jan 31 '13 at 09:04
I am stuck on that..My images are from sdcard they are not in drawable..But here you are getting image from Drawable...how to over come that... — user2027862, Jan 31 '13 at 09:21
i have executed your code with simple drawable..But still it didn't show any over lay image on the map... — user2027862, Jan 31 '13 at 09:57

How to over lay images on the googlemaps

1 Answers1