Upgrade mapbox-gl or maybe will be better to develop a http server cordova plugin?

[lasterra]

Hi, i'm testing the project and it is running ok. I will try to upgrade to a newest version but looking at code i asking myself if it is not better to resolve the problem throught a cordova plugin that create an internal http server that respond with the data of mbtile.

I think it will be simplier and much easier to integrate with mapbox-gl and inside other cordova aplications.

I don't know if the performance will be worst or not.

[stefanmdt]

I managed to update mapbox to version 1.2.1. With higher versions it is not working out of the box.

There also seem to be some bugs in the current version, e.g. missing street name labels: #49

Did you find any relevant native cordova plugins? Those I found look quite outdated, e.g.:
https://github.com/rgamez/cordova-plugin-http-mbtiles
https://github.com/ffournier/cordova-plugin-mbtiles

[lasterra]

Great links, i will study them.

what i was thinking is to use https://github.com/bykof/cordova-plugin-webserver and mix it with the code https://github.com/oscarfonts/mapbox-gl-cordova-offline/blob/master/src/mbtiles_source.js
to return the tile

Develop a plugin in android will not be dificult for me but i don't know iOS so this is why i select cordova-plugin-webserver

[lasterra]

Mbtiles plugins are prepared to process raster tiles and i want to proces mvt/pbf vector tiles.

My idea works, the only problem is that cordova-plugin-webserver only return text or files and vector tiles are binary pbf data, so it is necesary to write a file on disk to put it in http server response.

I think i could improve the performance if i modify the webserver to translate from base64 to binary, but it is working quite good without it.

[shafiramaki]

@lasterra can you please share the code?

[lasterra]

Yeah, code it is tricky

First decode mvt to write it on disk

var base64Data = res.rows.item(0).base64_tile_data;
var tileByteArray = base64js.toByteArray(base64Data);
var rawData = pako.inflate(tileByteArray);
var unzipedbase64 = base64js.fromByteArray(rawData);
var blobData = localThis.b64toBlob(unzipedbase64, "application/octet-stream") ;

Then write blob using cordova-file-plugin

Then serve using cordova-plugin-webserver

[shafiramaki]

@lasterra
thanks,
but I used another repository and its working fine

[lasterra]

which one?

[stefanmdt]

@shafiramaki which one? :)

[shafiramaki]

@stefanmdt
https://github.com/AirSuite/mapbox-gl-js-cordova-offline-example

[stefanmdt]

@shafiramaki Thanks for sharing. I tried to start the project for ios based on the readme, but it doesn't work ("Database Error: no such table: tiles"). Also it doesn't look like this project is very active / maintained.

@lasterra How good is the performance? Do you have a working example that you could upload to a repository?

[shafiramaki]

@stefanmdt am aslo in trouble , want to integrate with quasar framework but getting the same error
("Database Error: no such table: tiles") , actually it was fine with a normal cordova project I test it in android platform through real device, but i dont know why its not working in quasar.
if you find any solution let me know please.
@lasterra it will be my pleasure to upload it in repository.

[shafiramaki]

@stefanmdt recently worked for me, there are some points to be notice
if you wish this is my skype id "live:shafimm40" then we will be in touch.

[itbeyond]

Guys I am looking at this and wondering where you all ended up. I am working on a project that has millions of offline tiles stored in Base64 within SQL on Cordova - it has worked great using Leaflet and rewiting the getTile calls to inject the Base64 as img. Now looking at MapBox GLJS engine for better rotation and Vector support however must be able to serve local tile data.

Playing around with cordova-plugin-webserver does look promising but the text output is a real pain, I wonder if you have done anything better with this?

[stefanmdt]

In my opinion, the general approach of this plugin could be the cleanest way of implementing a vector based offline map. Unfortunately, I neither managed to fix the bugs in the current version nor to update mapbox to the current version (the corresponding project was frozen, so I stopped my work at some point).

[itbeyond]

@stefanmdt thanks for your update. I have made my project work currently using a local device webserver approach - it is a bit clumsy as I had to create a local file like @lasterra but added a file delete after 500ms after serve. Also adding expire, max-age and caching headers in the web server helps a lot.

I do agree that the approach used in this repo is the best way to make this work and I may get back to this and attempt to move it forward. Thanks for your work on this and for the other input received.

[itbeyond]

Just submitted pull #54 to bring this mapbox-gl-js to the latest version 1.11.0. Good luck, I may submit additional pulls on updates to DB drivers and to add Windows UWP support.