Question about localFileSource platform suport

[briancalvium]

I thought I would try asking about this here before taking the time to fork react-native-mapbox-gl to include the change...

Is it possible on both iOS and android to load files (style.json and the tiles themselves) from the App documents directory using the recently added localFileSource? We have apps with custom raster map tiles that we currently have to include with the app and access using the assets:// protocol. It would be great to be able to download them on first launch and use file://.

Thanks, any pointers in the right direction would be appreciated!

[kkaefer]

This should work if you use file:// as the URL. Note that you'll need to use absolute paths, which means you'll typically end up with URLs that start with file:///var/mobile/... (note the 3 slashes).

[1ec5]

As @kkaefer notes, you can use an absolute file: URL to access a file in the documents directory. However, it sounds like you may find it more convenient to use the offline maps API (OfflineRegion on Android, MGLOfflineStorage on iOS) to download the styles and tiles directly into the SDK. RNMBGL has rudimentary support for the Android and iOS SDKs’ offline maps APIs.

[briancalvium]

Thanks for the help @1ec5 and @kkaefer! Just as reference for anyone else: currently react-native-mapbox-gl would need to be forked to build against mapbox-gl-native >= 3.4. There is a pre-build script specified in package.json that downloads the compiled native library for iOS (currently set to 3.3.1). Not sure yet whether RNMBGL would build against that without further changes.

[SeanChristopherConway]

@kkaefer This is working for me on Android but not on iOS. On iOS, for example, this does not work in my JSON style file(have confirmed the folders exist):

  "tiles": [
              "file:///Users/Sean/Library/Developer/CoreSimulator/Devices/FBBFDD4B-82EB-46FF-ADF2-A0D0747C66BB/data/Containers/Data/Application/C7B169EB-DC3A-47C8-85FB-1347E13A517D/Documents/221_7/{z}/{x}/{y}.pbf"
          ]

[1ec5]

Your application is sandboxed, so it has no access to your home directory on your Mac. Within the sandbox, the root directory / is mapped to a physical directory somewhere within that device folder. You need to figure out the path as your application, running in the simulator, sees it. See “Locating Items in the Standard Directories” for more information. Hopefully either React Native or a third-party component exposes these file system APIs for your application’s use.

[1ec5]

Without knowing exactly what you’re trying to do, I think the offline map API would probably be a better way to do it. 😄 (Unfortunately, RNMBGL doesn’t do a great job of exposing this API to React Native on iOS.) If you really do need to manage tile downloads yourself, rather than relying on the offline map API to download the tiles as part of the style, then eventually #7471 (comment) in conjunction with the runtime styling API (nitaliano/react-native-mapbox-gl#416) would make it possible for you to specify these on-disk tiles without having to modify a JSON file.

[AntonERG]

@SeanChristopherConway
Have you managed finally, how to use tiles from documents directory?