OpenStreetMap MapView for Android

Tutorials that use the MapActivity. Many using GPS functionality.

Postby plusminus » Tue Oct 07, 2008 4:57 pm

Nice, to see it worked :)

I guess that was the wrong screenshot.
Image
Image | Android Development Community / Tutorials
User avatar
plusminus
Site Admin
Site Admin
 
Posts: 2688
Joined: Wed Nov 14, 2007 8:37 pm
Location: Schriesheim, Germany

Top

Postby ligi » Wed Oct 08, 2008 11:05 am

First of all - OSM on Android sounds great - and the screenshots are very promising - good work plusminus!
I can install the signed apk with SDK 1.0 , but i have problems running the sample app - i can only see the one screen in the screenshot i attached
Attachments
android_osm.jpg
android_osm.jpg (78.97 KiB) Viewed 6845 times
ligi
Freshman
Freshman
 
Posts: 5
Joined: Wed Apr 16, 2008 1:47 pm

Postby ninor » Wed Oct 08, 2008 11:57 am

plusminus wrote:Nice, to see it worked :)

I guess that was the wrong screenshot.


Yes, it was from an example.

This is the screenshot from your APK (the same as the g1 guy and ligi)
Attachments
AndOpenStreetMap.jpg
AndOpenStreetMap.jpg (8.4 KiB) Viewed 6832 times
Image AndDev: Your Android Development Community / Tutorials | Here's my Basic ToolKit
User avatar
ninor
Moderator
Moderator
 
Posts: 180
Joined: Thu Aug 14, 2008 6:30 pm
Location: Barcelona, Spain

Postby Bulldog » Wed Oct 08, 2008 1:29 pm

Hi plusminus,

is it possible, that u build a small tutorial how to build an own View which displays other maps than googles (example OSM).

Im trying the same u already did, but i dont have the same android-knowledge u have. So that would be realy helpful for me and maybe other developers too.
Bulldog
Freshman
Freshman
 
Posts: 9
Joined: Wed Sep 24, 2008 1:54 pm

Postby plusminus » Wed Oct 08, 2008 2:19 pm

OMG I uploaded the wrong apk ...

I had the right one before signing, signed the wrong one and uploaded the correctly signed wrong apk.

Start laughing.... :oops:
[align=center]:darrow: :darrow: :darrow: :darrow: :darrow: :darrow: :darrow: :darrow: :darrow: :darrow:[/align]
Attachments
OpenStreetMapViewer_signed.apk
The right version xD
(64.57 KiB) Downloaded 519 times
Image
Image | Android Development Community / Tutorials
User avatar
plusminus
Site Admin
Site Admin
 
Posts: 2688
Joined: Wed Nov 14, 2007 8:37 pm
Location: Schriesheim, Germany

Postby ligi » Wed Oct 08, 2008 11:34 pm

thanx PlusMinus - now it's working fine!-)
i'll give it an closer look tomorow.
Attachments
android_osm_working.jpg
android_osm_working.jpg (56.27 KiB) Viewed 6769 times
ligi
Freshman
Freshman
 
Posts: 5
Joined: Wed Apr 16, 2008 1:47 pm

Top

Postby Bulldog » Thu Oct 09, 2008 8:18 am

Hi Plusminus,

i have one more question to u or the other developers.
U said your MapView class extends from View. What i want to know is, in which elements u show the Slippy OSM Maps?
In your application, if i dont have an internet connection, i see these loading images. In these "images fields" u put, from the center beginning, the Slippy Maps.
What are these image fields? Please post a small code example - that would be realy helpful :)

Thx again,
Bull
Bulldog
Freshman
Freshman
 
Posts: 9
Joined: Wed Sep 24, 2008 1:54 pm

Postby plusminus » Thu Oct 09, 2008 1:25 pm

If it helps you, this is the complete onDraw()-Code:

Syntax: [ Download ] [ Hide ]
Using java Syntax Highlighting
  1.                 /* Do some calculations and drag attributes to local variables to save some performance. */
  2.  
  3.                 final int zoomLevel = this.mZoomLevel;
  4.  
  5.                 final int viewWidth = this.getWidth();
  6.  
  7.                 final int viewHeight = this.getHeight();
  8.  
  9.                 final int tileSizePx = this.mRendererInfo.MAPTILE_SIZEPX;
  10.  
  11.                
  12.  
  13.                 /* Get the center MapTile which is above this.mLatitudeE6 and this.mLongitudeE6 .*/
  14.  
  15.                 final int[] centerMapTileCoords = Util.getMapTileFromCoordinates(this.mLatitudeE6, this.mLongitudeE6, zoomLevel, null);
  16.  
  17.                
  18.  
  19.                 /* Calculate the Latitude/Longitude on the left-upper ScreenCoords of the center MapTile.
  20.  
  21.                  * So in the end we can determine which MapTiles we additionally need next to the centerMapTile. */
  22.  
  23.                 final Point upperLeftCornerOfCenterMapTile = getUpperLeftCornerOfCenterMapTileInScreen(centerMapTileCoords, tileSizePx, null);
  24.  
  25.  
  26.  
  27.                 final int centerMapTileScreenLeft = upperLeftCornerOfCenterMapTile.x;
  28.  
  29.                 final int centerMapTileScreenTop = upperLeftCornerOfCenterMapTile.y;
  30.  
  31.                
  32.  
  33.                 final int centerMapTileScreenRight = centerMapTileScreenLeft + tileSizePx;
  34.  
  35.                 final int centerMapTileScreenBottom = centerMapTileScreenTop + tileSizePx;
  36.  
  37.                
  38.  
  39.                 /* Calculate the amount of tiles needed for each side around the center one. */
  40.  
  41.                 final int additionalTilesNeededToLeftOfCenter = (int)Math.ceil((float)centerMapTileScreenLeft / tileSizePx); // i.e. "30 / 256" = 1;
  42.  
  43.                 final int additionalTilesNeededToRightOfCenter = (int)Math.ceil((float)(viewWidth - centerMapTileScreenRight) / tileSizePx);
  44.  
  45.                 final int additionalTilesNeededToTopOfCenter = (int)Math.ceil((float)centerMapTileScreenTop / tileSizePx); // i.e. "30 / 256" = 1;
  46.  
  47.                 final int additionalTilesNeededToBottomOfCenter = (int)Math.ceil((float)(viewHeight - centerMapTileScreenBottom) / tileSizePx);
  48.  
  49.                
  50.  
  51.                
  52.  
  53.                 final int mapTileUpperBound = (int)Math.pow(2, zoomLevel);
  54.  
  55.                 final int[] mapTileCoords = new int[]{centerMapTileCoords[MAPTILE_LATITUDE_INDEX], centerMapTileCoords[MAPTILE_LONGITUDE_INDEX]};
  56.  
  57.                
  58.  
  59.                 /* Draw all the MapTiles (from the upper left to the lower right). */
  60.  
  61.                 for(int y = -additionalTilesNeededToTopOfCenter; y <= additionalTilesNeededToBottomOfCenter; y++){
  62.  
  63.                         for(int x = -additionalTilesNeededToLeftOfCenter; x <= additionalTilesNeededToRightOfCenter; x++){
  64.  
  65.                                 /* Add/substract the difference of the tile-position to the one of the center. */
  66.  
  67.                                 mapTileCoords[MAPTILE_LATITUDE_INDEX] = MyMath.mod(centerMapTileCoords[MAPTILE_LATITUDE_INDEX] + y, mapTileUpperBound);
  68.  
  69.                                 mapTileCoords[MAPTILE_LONGITUDE_INDEX] = MyMath.mod(centerMapTileCoords[MAPTILE_LONGITUDE_INDEX] + x, mapTileUpperBound);
  70.  
  71.                                 /* Construct a URLString, which represents the MapTile. */
  72.  
  73.                                 final String tileURLString = this.mRendererInfo.getTileURLString(mapTileCoords, zoomLevel);
  74.  
  75.                                
  76.  
  77.                                 /* Draw the MapTile 'i * tileSizePx' above of the centerMapTile */
  78.  
  79.                                 final Bitmap currentMapTile = this.mTileProvider.getMapTile(tileURLString);
  80.  
  81.                                 final int tileLeft = this.mTouchMapOffsetX + centerMapTileScreenLeft + (x * tileSizePx);
  82.  
  83.                                 final int tileTop = this.mTouchMapOffsetY + centerMapTileScreenTop + (y * tileSizePx);
  84.  
  85.                                 c.drawBitmap(currentMapTile, tileLeft, tileTop, this.mPaint);
  86.  
  87.                                
  88.  
  89.                                 if(DEBUGMODE){
  90.  
  91.                                         // Draw frame around the tiles...
  92.  
  93.                                         c.drawLine(tileLeft, tileTop, tileLeft + tileSizePx, tileTop, this.mPaint);
  94.  
  95.                                         c.drawLine(tileLeft, tileTop, tileLeft, tileTop + tileSizePx, this.mPaint);
  96.  
  97.                                 }
  98.  
  99.                         }
  100.  
  101.                 }
  102.  
  103.                
  104.  
  105.                 /* Draw all Overlays. */
  106.  
  107.                 for(OpenStreetMapViewOverlay osmvo : this.mOverlays)
  108.  
  109.                         osmvo.onManagedDraw(c, this);
  110.  
  111.                
  112.  
  113.                 this.mPaint.setStyle(Style.STROKE);
  114.  
  115.                 if (this.mMaxiMap != null) // If this is a MiniMap
  116.  
  117.                         c.drawRect(0, 0, viewWidth - 1, viewHeight - 1, this.mPaint);
Parsed in 0.043 seconds, using GeSHi 1.0.8.4
Image
Image | Android Development Community / Tutorials
User avatar
plusminus
Site Admin
Site Admin
 
Posts: 2688
Joined: Wed Nov 14, 2007 8:37 pm
Location: Schriesheim, Germany

Postby Bulldog » Thu Oct 09, 2008 2:46 pm

OK, thanks Plusminus.
I think now i understand how to dosplay the pictures.
Bulldog
Freshman
Freshman
 
Posts: 9
Joined: Wed Sep 24, 2008 1:54 pm

Postby Bulldog » Fri Oct 10, 2008 12:54 pm

Hi Plusmiuns,
i have another question :)
I made it to draw the center bitmap and the aight bitmaps around them. That was not the problem.
Then i wrote an OnTouchListener, that i can navigate in the view (scroll up/down etc).
But now the drawed images are static. If i scroll up, i can see the background after a while.

My question is, how can i fill the background again with bitmaps?
Look, i cant read out where i am on the map after scrolling.
If i could that, i would easy draw again the 9 pictures beginning from the center.

Can u give me a hint please.

Thx again.

PS: I hope u anderstand what i mean :?
Bulldog
Freshman
Freshman
 
Posts: 9
Joined: Wed Sep 24, 2008 1:54 pm

Postby plusminus » Fri Oct 10, 2008 2:20 pm

The easiest is to linear interpolate within the boundingbox of the maptile. See info here: http://wiki.openstreetmap.org/index.php ... ile_number

Also Projections comes into play.
Image
Image | Android Development Community / Tutorials
User avatar
plusminus
Site Admin
Site Admin
 
Posts: 2688
Joined: Wed Nov 14, 2007 8:37 pm
Location: Schriesheim, Germany

Postby gzhhong » Tue Oct 14, 2008 3:33 am

Hi plusminus,

how to do that? :o
just implement a class of OpenStreetView? what about the protocol to fetch a map image from the openstreet server. is it done by Util.getMapTileFromCoordinates ?
Last edited by gzhhong on Thu Oct 23, 2008 1:49 am, edited 1 time in total.
gzhhong
Freshman
Freshman
 
Posts: 7
Joined: Mon May 19, 2008 1:56 pm

Postby plusminus » Mon Oct 20, 2008 3:56 pm

gzhhong wrote:Hi plusminus,

how to do that? :o
just implement a class of OpenStreetView? what about the protocol to fetch a map image from the openstreet server. is it done by Util.getMapTileFromCoordinates ?

I am reading the SDK source code(decompiled). it seems that you have to rewrite the com.google.googlenav.map package, at least the file BaseTileRequest and MapTile, which render the maps from google server, do you ?


Yes, I kindof rewrote the classes from the maps-package. But i did that without decompiling the sources, so I have freely usable and 100% legal code :)

This snippet does not download the maptile itself but it generates the info for the url the maptile is stored at (Note: OSM-Maptiles are stored like this: http://tile.openstreetmap.org/12/2047/1362.png )
Syntax: [ Download ] [ Hide ]
Using java Syntax Highlighting
  1. final int[] centerMapTileCoords = Util.getMapTileFromCoordinates(...);
Parsed in 0.031 seconds, using GeSHi 1.0.8.4


Later in the code the MapTile is actually cache/filesystem/web-loaded:
Syntax: [ Download ] [ Hide ]
Using java Syntax Highlighting
  1. final Bitmap currentMapTile = this.mTileProvider.getMapTile(tileURLString);
Parsed in 0.034 seconds, using GeSHi 1.0.8.4


Btw: I improved loading maptiles from the file-system to the memory-cache, which makes the MapView more responsive, when a lot of tiles had to be loaded (i.e. directly after a zoomin/out).

Regards,
plusminus
Image
Image | Android Development Community / Tutorials
User avatar
plusminus
Site Admin
Site Admin
 
Posts: 2688
Joined: Wed Nov 14, 2007 8:37 pm
Location: Schriesheim, Germany

Postby gzhhong » Tue Oct 21, 2008 2:51 am

Hi plusminus,

Thank you so much!

Have you implement the code on sdk 1.0? It seems that you have to put the implementation package under /system/framework folder and change the use-library configuration in manifest file.

have you done that?
gzhhong
Freshman
Freshman
 
Posts: 7
Joined: Mon May 19, 2008 1:56 pm

Source code

Postby smithms112 » Fri Oct 31, 2008 10:39 am

Hi,
This is really amazing. Is it opensource? Where can I get the source code of the application.
Smith,
smithms112
Freshman
Freshman
 
Posts: 2
Joined: Fri Oct 31, 2008 10:27 am

Top
PreviousNext

Return to Map Tutorials

Who is online

Users browsing this forum: No registered users and 3 guests