Displaying maps centred on GPS coordinates

Using Dublin Buzz makes it incredibly easy to view sights and read all about them. If you have been convinced by the sight’s description that you would like to visit, then it is a simple matter to then find out where the sight is, by clicking a button a viewing the Google Maps application, with the sight pin-pointed on the map.

Dublin Buzz stores the GPS coordinates for each and every sight. This makes it possible for the application to calculate where you are in relation to the sight (calculated using your own current GPS coordinates.). I’ll discuss that in another posting, but for now, let’s look at how to display a map centred on the sight.

Maps are displayed using an activity called MapViewer (available in Word document format here:  MapViewer). This is launched from the SightViewer code using an Intent (see the posting describing Intents and how to use them below).

    	Intent launch = new Intent(this, MapViewer.class);
    	launch.putExtra("Sight", theSight);
    	startActivity(launch);

Step 1 is finding out the sight’s location. For Google Maps to work, they expect GeoPoints, not latitude and longitude. A GeoPoint is constructed using latitude and longitude however, quite simply:

  String name = sight.getName();
  double latitude = sight.getLatitude();
  double longitude = sight.getLongitude();

  Double lat = latitude * 1E6;
  Double lng = longitude * 1E6;
  GeoPoint centre = new GeoPoint(lat.intValue(), lng.intValue());

In the code above, I extract latitude and longitude from the Sight bundled into the extra data when the Intent was launched. I multiply both of them by 1 million. These extended values can then be passed to the GeoPoint constructor.

Now, we’re ready to display the map. Let’s look at the code to do this:

mapView = (MapView)findViewById(R.id.MapViewer);
mapView.setStreetView(true);
mapView.setBuiltInZoomControls(true);
mapController = mapView.getController();
mapController.setCenter(centre);
mapController.setZoom(18);
mapController.animateTo(centre);
mapView.setTag(name);

We create a MapViewer object in the first line, which is a XML-defined page for displaying maps. This requires one little bit of magic, that I will just mention, but without getting into too much detail about. In order to use Google Maps, you need to download a unique Google Maps API key. This has to be inserted into the XML for the map viewing page. Here’s the code (with the key altered…!):

<com.google.android.maps.MapView
  android:layout_width="fill_parent"
  android:layout_height="fill_parent"
  android:enabled="true"
  android:id="@+id/MapViewer"
  android:clickable="true"
  android:apiKey="9JL86OJj87MGiX_S_lYC_Pd50M2HJ4op5wkosF9g"
/>

I won’t go into the details of how to obtain a key as it is outside the purpose of this posting (and this blog). Google have a website devoted to it: http://code.google.com/android/add-ons/google-apis/mapkey.html

Once you’ve obtained a link to the MapView object, you then can set street view and zoom controls, along with other stuff that configures the map display for the user.
I then get a MapController object that allows me to display the map in a specific way. I want it zoomed to a particular size (18 in this case) and to use the GeoPoint of the Sight calculated earlier to be the centre of the map. Finally, I set the map’s title to be the name of the sight. I found out that 18 was the size I wanted by trial-and-error! It is a magic number that, really, should have been defined as a constant!

All of this code looks fairly complicated and, to me at first, arbitrary. But it makes sense when you think of the flexibility it gives you to display maps in whatever way you see fit.

Advertisements
This entry was posted in Android, Android development, Mobile Apps. Bookmark the permalink.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s