Monday, March 19, 2012

Offline TPK viewer in a Flex Mobile Application

In this post I will demonstrate how to write a Flex mobile application that displays a map with a tiled layer, where the tile source is the unpacked content of a tpk file. A tile package or tpk is generated using ArcMap and is a zip file that contains a couple of configuration files holding tile metadata and a set of ISAM files where the variable length files contain the tile images. The mobile application enables a user to download one or more tpk files from a web server to the local storage and disconnect from the “network” for offline viewing. When the user selects a local tpk, it will be unpacked and a map will render a tiled layer whose tile source is the local file unpacked images, enabling the user to zoom in and out and pan over the available levels as defined in the metadata file. This is possible due to the availability of the ByteArray class in AS3 and the capability to read and write binary files. The application is based on the Holistic Framework and is linked with the fast airzip library and the ArcGIS API for Flex. The TPKLayer in the map view is a subclass of the Esri TiledMapServiceLayer class where the getTileURL function is overridden to return a URLRequest instance with a custom ‘data’ scheme. This ‘data’ scheme informs the super class that the tile data is in a byte array referenced by the URLRequest instance ‘data’ property. In the TPKLayer, the getTileURL is invoked with a level, a row and a column value that are used to seek using the File API to a specific location to read the binary image at that location into a byte array. Using an iOS deployment, a user can drag and drop a tpk file onto the application's iTunes document folder for a later sync. This is possible due to the UIFileSharingEnabled declaration in the xml application manifest (CaheApp-app.xml). Like usual, all the source code is available, and you can download it from here. BTW, I was able to build the app using FlashBuilder 4.6 and the ArcGIS API 2.5 and upcoming 3.0 for Flex without issues. Have fun and keep me posted on your implementations.
at

24 comments:

  1. mikecizMarch 20, 2012 at 5:19 AM

    This works great! Thanks so much Mansour!

    ReplyDelete
  2. krntomMarch 20, 2012 at 12:37 PM

    great creation, since a number of person asking for offline content in mobile gis application. thanks

    ReplyDelete
  3. Casey BentzMarch 20, 2012 at 2:25 PM

    Do you have any idea when map package might be possible? We would really like to be able to be completely offline due to some very remote work sites, but still use Flex as compared to using wpf.

    ReplyDelete
  4. thunderheadMarch 20, 2012 at 8:41 PM

    Using 10.1, u will be able to create tpk files.

    ReplyDelete
  5. BrendanMarch 22, 2012 at 4:40 PM

    Awesome! Really impressive...but whats the deal with the URLRequest.url = 'data://LRC...'? Blew my mind that that is possible.
    Is that an ESRI Flex API 2.5 specific thing? In the 2.4 API I got some sort of security error about trying to script the browser.

    Really great work here. Thanks so much for sharing.

    ReplyDelete
  6. thunderheadMarch 22, 2012 at 4:50 PM

    Yeap - 2.5 plus

    ReplyDelete
  7. Casey BentzMarch 22, 2012 at 5:04 PM

    Mansour, great news on tpk files, what about mpk files? The ability to take the dynamic map data with us to the field and edit it or select it to make related records is going to be the deciding factor in where we go with our mobile gis platform.

    And thanks for getting back into the blogging spirit, 3 posts this week is awesome!

    ReplyDelete
  8. Casey BentzMarch 22, 2012 at 5:04 PM

    Mansour, great news on tpk files, what about mpk files? The ability to take the dynamic map data with us to the field and edit it or select it to make related records is going to be the deciding factor in where we go with our mobile gis platform.

    And thanks for getting back into the blogging spirit, 3 posts this week is awesome!

    ReplyDelete
  9. Casey BentzMarch 22, 2012 at 5:07 PM

    This comment has been removed by the author.

    ReplyDelete
  10. thunderheadMarch 22, 2012 at 8:25 PM

    "Official" Replica API is coming soon that will enable Feature packaging with offline editing

    ReplyDelete
  11. Casey BentzMarch 23, 2012 at 12:43 AM

    That sounds perfect. Any idea on a time frame?

    ReplyDelete
  12. JeremyMay 25, 2012 at 12:01 PM

    Mansour,

    Is there a size limit on the tpk. Hav e you run into any memory issues unpacking the tpk files?

    Thanks,

    Jeremy

    ReplyDelete
  13. JeremyMay 25, 2012 at 12:01 PM

    Mansour,

    Is there a size limit on the tpk. Hav e you run into any memory issues unpacking the tpk files?

    Thanks,

    Jeremy

    ReplyDelete
  14. thunderheadMay 25, 2012 at 12:05 PM

    There is another way to do this - where u do not have to place a TPK - but u can do the unpacking urself - on an android device with SDCard, used the external storage for that.

    ReplyDelete
  15. ZachJuly 9, 2012 at 3:24 PM

    Is it possible to read TPK from a local storage, like SD Card in android...can you post some sample...

    ReplyDelete
  16. thunderheadJuly 9, 2012 at 3:34 PM

    Yes it is possible, use the /mnt/sdcard as your mount point - did that for project with a huge TPK - and BTW, in upcoming 3.1 API, there will be native TPKLayer that u can point to the above - cool ?

    ReplyDelete
  17. Conry LavisJuly 16, 2012 at 1:28 AM

    so in short, yes you CAN make a business mobile app in flex or air but you probably shouldn't. For a standard app you can simply tell customers that only this or that platform is supported but for business purposes you want it to run on the most platforms possible and unfortunately right now adobe technology only runs on very limited mobile platforms.

    Thanks:
    Mobile Application Development

    ReplyDelete
  18. Casey BentzAugust 14, 2012 at 10:53 AM

    Mansour,

    There appears to be a problem with how the code builds the path to the bundles. When I get to detail level 18, it stops working. When I trace it out, I see that the path it is building for the row and column is incorrect. The functions in question are buildCacheFilePath and toHexString. It appears to trim off a necessary character. The path it builds for me is, Inspection/v101/Layers/_alllayers/L18/R1758CB500. But the actual path is, Inspection/v101/Layers/_alllayers/L18/R17580Cb500. It is trimming the last 0 off the row.

    Casey

    ReplyDelete
  19. Casey BentzAugust 16, 2012 at 9:14 AM

    FYI, my solution was to comment out the line

    return text.substr(0, 4);

    and used

    return text;

    I have not had any problems so far, but I assume you were trimming it down to 4 characters for a reason. I just haven't found that reason yet.

    ReplyDelete
  20. UnknownAugust 17, 2012 at 4:13 PM

    Mansour is the best. We've extended this work and included both offline FeatureLayers and editing:

    http://www.webmapsolutions.com/offline-editing-mobile-arcgis

    --Rory

    ReplyDelete
  21. UnknownOctober 11, 2012 at 9:36 AM

    @Casey Bentz the following code fixed the Level 18, Level 19 cache levels viewing issue.
    1. Open up the TPKLayer.as file.
    2. Find the function toHexString(value:int):Object
    3. Change the bottom return line to:
    return text.substr(0, text.length);

    That will solve your woes. Let me know if that works for you.

    Thanks,

    Steve

    ReplyDelete
  22. Abdelhameed HamdyOctober 15, 2012 at 7:27 AM

    This comment has been removed by the author.

    ReplyDelete
  23. Abdelhameed HamdyOctober 15, 2012 at 7:29 AM

    This comment has been removed by the author.

    ReplyDelete
  24. Abdelhameed HamdyOctober 15, 2012 at 7:31 AM

    Awesome Mansour,

    but I got two errors while trying to build the project in Flash Builder 4.6:

    - Could not resolve to a component implementation. in Registry.mxml

    - Multiple markers at this line:
    -1023: Incompatible override.
    -public
    overridescom.esri.ags.Map.staticLayer
    in SnapMap.as : Line 26

    Regards

    ReplyDelete