How to create an interactive map on Android

Question

I need part of my application to have an interactive map of a square area that consists of about 10 buildings. You should be able to click on the building and get some information about it. I know that there are several ways to do this, but I hope someone with some experience with this can give me some advice.

Here are some ways I can think of this.

Google maps

I have already implemented the Google Maps API and it works quite well, but actually does not have the effect I was looking for. Google Maps requires an internet connection and gives you access to the entire map. I need it to be locked in one area.

Webviews

This seems like a great alternative. I'm sure I can come up with a simple image map that will give you more information when you click on a specific building. The only problem is that you also need an internet connection.

Opengl

I never looked at it too much, but I heard that it is difficult and painful to implement. It will be able to work locally, but is it worth it?

Is there any other way to develop an interactive map? Something to keep in mind is that I would also like to someday port this to iOS (if anyone has experience with this)

Answer 1

If you need full control and are comfortable using html and javascript, I would highly recommend using the open OpenLayers library. You can create an html page, save it in assets and run it locally on the device. You can create your own set of map fragments or even use a single jpeg file, and then "display" the buildings you want on it, and then use the simple but extensive OpenLayers API so that you can display the selection and display of information. It even has multifunctional features built in for panning and zooming. Works great and disconnects from mobile devices.

Below is a list of examples here . Running a simple view source on any of the examples will give you a very clear idea of ​​what they are doing. You can also take a look at this example , which displays a bunch of thumbnails of images in the map area from flickering with the possibility of clicking for more information. This example uses an online feed, but you can easily use a local ... even one sent from an application to the web -browser .

ps. I have no binding to OpenLayers other than actively using it for my projects.

Answer 2

From the very beginning you can answer your question on 10 pages.

• Check it out here first: https://developers.google.com/maps/documentation/android/hello-mapview

• After you can use MapView, you just need to create the ItemizedOverlay class.

Replace this class with HelloItemizedOverlay in the tutorial.

public class GooglerMapItemizedOverlay extends ItemizedOverlay { private ArrayList<OverlayItem> mOverlayItems = new ArrayList<OverlayItem>(); private Context mContext; private Paint rectPaint, textPaint; public GooglerMapItemizedOverlay(Drawable defaultMarker, Context context) { super(boundCenterBottom(defaultMarker)); mContext = context; populate(); } @Override protected OverlayItem createItem(int i) { return mOverlayItems.get(i); } public void addOverlayItem(OverlayItem overlay) { mOverlayItems.add(overlay); populate(); } @Override public int size() { return mOverlayItems.size(); } public void clear(){ mOverlayItems.clear(); populate(); } @Override protected boolean onTap(int index) { // information goes here OverlayItem item = mOverlayItems.get(index); AlertDialog.Builder dialog = new AlertDialog.Builder(mContext); dialog.setTitle(item.getTitle()); dialog.setMessage(item.getSnippet()); dialog.show(); return true; } } 

---

Hope this helps.

Answer 3

Google maps

• It will have the desired effect (custom location, cannot move, cannot zoom in or out)
• But does not allow offline content

Here's how to do it (I did it and it works):

• You focus on the GPS coordinates you want to limit the area.
• You adjust the zoom level to limit the area
• You turn off multitouch events to prevent zooming in or out.
• You turn off drag and drop to prevent moving.
• You handle the click on the ItimizedOverlays that you created to handle the actions.

There are good answers to StackOverflow for each of these steps.

• 1 & 2: https://developers.google.com/maps/documentation/android/reference/com/google/android/maps/MapView
• 3: Android and GoogleMaps: disable mapView drag and drop
• 4: https://developers.google.com/maps/documentation/android/hello-mapview

Answer 4

If you always need to display the same map, you can simply display the map as a layout background (make a map image) and process touch positions to display pop-ups for a specific building.

Or use the webview as indicated in the comment and process the touch of x, y to display the position of the building.