How do you rate this blog

Monday, October 10, 2011

Creation of Overlays in Google Maps

An overlay is nothing but an object which can be drawn over a map. On this overlay we place various overlay items.
                So now that we got to know what an overlay means, lets get on with the app in which we will display the overlay. The logic to add the overlay is given below.
1) Create a class which will extend the ItemizedOverlay class which extends Overlay.
a) So create a new class which extends ItemizedOverlay.  In this class initialize mapOverlays which will hold all the overlay items as shown below.

b) Private ArrayList<OverlayItem> markerOverlay=new ArrayList<OverlayItem>();
Then create a constructor which will initialize the class as shown below.
                public Marker_Class(Drawable defaultMarker) {
                                super(boundCenterBottom(defaultMarker));
                                // TODO Auto-generated constructor stub
                }

c) Next create another constructor which accepts one more parameter called as Context.c) Next create another constructor which accepts one more parameter called as Context.
public Marker_Class(Drawable defaultMarker,Context context) {
                                this(defaultMarker);
                                this.context=context;
                }

d) Override the function CreateItem and include the following code to get the particular item.
return markerOverlay.get(i);

e) To add a functionality, where in on tap of an item you get a screen which shows all the details is given below

                                       OverlayItem item=markerOverlay.get(i);
                                       AlertDialog.Builder dialog=new AlertDialog.Builder(context);
                                       dialog.setTitle(item.getTitle());
                                       dialog.setMessage(item.getSnippet());
                                       dialog.show();
                                        return true;

f) Finally override the function addOverlay,  which will populate your gmap with the items
                                                             markerOverlay.add(overlay);
                                                                this.populate();

The marker class will look as shown in the image below.



2) Now that will have an overlay class, we need to make changes to our MainActivity.

 a) Make variables which will store latitude and longitude information
public static final int longitude=12971600;
public static final int lattitude=77594560;

b) Create a list of overlays and Drawable variable as show in the code below and instantiate the overlay class which have created above.
        List<Overlay> mapOverlay=mapV.getOverlays();
        Drawable drawable=this.getResources().getDrawable(R.drawable.icon);
        Marker_Class MC=new Marker_Class(drawable,this);

c) Then create a geo point on which the marker will be shown with the title name and text as shown below.
       GeoPoint point=new GeoPoint(longitude, lattitude);
        OverlayItem overlayItem=new OverlayItem(point,"hello I am in Bangalore","Its an awesome place");
        MC.addOverlay(overlayItem);
        mapOverlay.add(MC);


The main mapactivity class will look as shown in the image below.


Then run the project and the final result is as shown below.

Tadaaaaaaaa it workeddddddddd :) ! Hope you all got it and please let me know if the post was helpful.

No comments:

Post a Comment