I am using the MapBox-GL-JS API to render maps in a Cordova hybrid app that runs on Android and iOS. I have serving vector tiles locally from the phone working.

In my use case, I would like users to be able to download individual states. For example they may download the state of Maryland to start and then at some later date download the state of Virginia.

Obviously, I would like to then be able to use data from both files to render one basemap. The idea is that a user will be able to download and use whatever states they want whenever they want.

I thought initially that I could simply set up the two files as separate sources per this answer on using multiple sources but it seems that this does not work for two basemap sources?


I tried copying tiles from the one sqlite mbtiles file into the other but I then ran into the merging boundary vector tiles problem where the vector data from the tiles on the boundary between the states needs to be merged with the other otherwise you get huge blank sections along the border.

There are a number of tools available to merge mbtiles files (including merging geometries along the borders) on the server, but given the processing involved and the amount of data to transfer this isn't practical.

So the question is, are there any existing solutions for merging mbtiles files in pure javascript/typescript?

(for use in a cordova client application)?

Is there another way to solve this problem that I am missing?

Searching extensively, the only thing I've found remotely close is this library to load vector geometries which looks like it might make for a reasonable starting point if I have to implement some merging solution on my own.

If the answer is that there is no existing solution for this, do you have any suggestions or insights you could offer to start me off down the path of implementing my own?

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.