offline Openstreet map (OSM) integration

[rkarikari]

Hello,

I have ais-catcher and dump1090 (ADS-B) runnning on the same Pi3b+ unit.

The web viewer for dump1090 (tar1090) has an option to display offline maps if available.
++ red arrow ++
The offline map tiles are stored locally and tar1090 locates them and makes them available as a map option.

Is there a way to do same with ais-catcher, (especially since the tiles are already locally stored) ?

The installation script for tar1090/dump1090 has this ....

https://github.com/wiedehopf/adsb-wiki/wiki/offline-map-tiles-tar1090

Thanks

[rkarikari]

I tried creating a plugin with the following ..

// { "version": 2, "description": "offline openstreetmap", "author": "github" }

addTileLayer("Offline OpenStreetMap", new ol.layer.Tile({
 source: new ol.source.XYZ({
 url: 'http://127.0.0.1/tar1090/osm_tiles_offline/{z}/{x}/{y}.png',
attribution: '©',
subdomains: 'abcd',
maxZoom: 10,
minZoom: 0
 })
}));

I get the offline Map option ...

but a black screen when I select it.

any help would be appreciated.
Thanks

[rkarikari]

Finally got it working!!!

Had to replace the loopback (127.0.0.1) with the externally reachable address (192.168.x.x)
as I was testing from a remote computer.

// { "version": 2, "description": "offline openstreetmap", "author": "github" }

addTileLayer("Offline OpenStreetMap", new ol.layer.Tile({
 source: new ol.source.XYZ({
 url: 'http://192.168.8.142/tar1090/osm_tiles_offline/{z}/{x}/{y}.png',
attribution: '©',
subdomains: 'abcd',
maxZoom: 10,
minZoom: 0
 })
}));

[rkarikari]

My config setting are stored in a file.

is there a way to include ...

CDN /opt/ais/webassets PLUGIN /opt/ais/offlinemaps.pjs

in the config file ?

[jvde-github]

Glad that plug-in is resolved. You can find the CDN in the config json here: https://github.com/jvde-github/AIS-catcher#configuration-file

Assume plugin is the same but let me know if it does not work!

[rkarikari]

Thanks ...

Was trying another ...... "Maptiler VectorMaps"

// { "version": 2, "description": "offline Maptiler VectorMap", "author": "github" }

addTileLayer("Offline VectorMap", new ol.layer.Tile({
 source: new ol.source.XYZ({
 url: 'http://192.168.8.142:8080/data/v3/{z}/{x}/{y}.pbf',
attribution: '©',
subdomains: 'abcd',
maxZoom: 14,
minZoom: 0
 })
}));

I see that the files get pulled from the local tileserver ...

but don't get displayed in ais-catcher "usual black screen".

The tile format is .pbf and should appear like this ..

Is this (Maptiler vector maps) supported by ais-catcher ?

[jvde-github]

I haven’t tried it but I think so. AIS-catcher is using the openlayers library.
Perhaps a internet search on those two terms provide some hints?

I haven’t experimented with it though. Let me know how it goes otherwise will try to experiment a bit with it in the next few days.

[rkarikari]

I've noticed the following ...

1. Raster tiles ( png, jpg, webp ) work.
2. Vector tiles (pbf) don't.

OpenLayers v9.2.4 does support vector layers,..... and I verified at their site ( replacing thier map with mine ) as shown below.

Openlayers Vector tiles support

Please take a look whenever you are able.

Thanks so much.

[jvde-github]

Happy to test. Perhaps it is an additional script that is needed. Where can I find PBF tiles to test?

[rkarikari]

Maptiler has these MBtiles for free download ...
Maptiler Downloads

Or you can use their hosted ones ...
https://api.maptiler.com/tiles/v3-lite/{z}/{x}/{y}.pbf?key=8EANolnPbeOlwTl6Qga9

I (or you ) can delete the "key" portion (from this post) when you are done.

[jvde-github]

This works:

// {"author":"YourName","version": 2, "description":"Add MapTiler hosted map"}

addTileLayer("MapTiler", new ol.layer.VectorTile({
    source: new ol.source.VectorTile({
        format: new ol.format.MVT(),
        url: 'https://api.maptiler.com/tiles/v3-lite/{z}/{x}/{y}.pbf?key=8EANolnPbeOlwTl6Qga9',
        attributions: '<a href="https://www.maptiler.com/copyright/" target="_blank">&copy; MapTiler</a> <a href="https://www.openstreetmap.org/copyright" target="_blank">&copy; OpenStreetMap contributors</a>',
        maxZoom: 19
    })
}));

But is visualized a bit particular, is this what you expected:

[jvde-github]

Got it to run with the styling but need to figure out how to implement in the program properly:

[rkarikari]

Maptilers site has this .....

and ais-catcher shows this...

How did you get it running with styling.... was the change made in the plugin ?

Thanks thus far.

[jvde-github]

Changing things all over the place :-) and including a new script but have not figured out how to do in the production version. The styling is impacting also existing maps.

[jvde-github]

Managed to get it running without error messages; I realized I should use the right CDN (unpkg) otherwise it becomes a rabbit hole to sort the modules.
Now, the problem is to get the tiles and the styling file for testing....

[rkarikari]

Wonderful .... great news.