Mapsui: OpenSeaMap - Map base + overlay layer(s)

Created on 11 Dec 2018  路  5Comments  路  Source: Mapsui/Mapsui

Hi,

how to create in Mapsui 1.4.8.* map like this:
https://mc.bbbike.org/mc/?lon=14.299757&lat=53.909673&zoom=12&num=1&mt0=mapnik&mt-1=ol_openseamap-seamark&mt-1p=100&marker=

https://wiki.openstreetmap.org/wiki/File:OpenSeaMap-Warnem%C3%BCnde.png

https://wiki.openstreetmap.org/wiki/File:OpenSeaMap_auf_OpenCPN-Kap-1.jpg

Generally, would like to have a base map like OpenStreetMap and an overlay like OpenSeaMap.

I try based on details from https://wiki.openstreetmap.org/wiki/Tile_servers to have:
in Map.Layers[0] is TileLayer -> OpenStreetMap
in Map.Layers[1] is TileLayer -> OpenSeaMap

and I don't see anything from OpenSeaMap :(

Help!

question

All 5 comments

[Serializable]
    public class OSM_OpenSeaMap : MapSettings
    {
        public TileLayer CreateTileLayer()
        {
            TileLayer tileLayer = new TileLayer((ITileSource)CreateTileSource(), 200, 300, 2, (IFetchStrategy)null, (IRenderGetStrategy)null, -1, -1);
            string str = nameof(OSM_OpenSeaMap);
            tileLayer.Name = str;
            return tileLayer;
        }

        private HttpTileSource CreateTileSource()
        {
            return new HttpTileSource((ITileSchema)new GlobalSphericalMercator(), "http://tiles.openseamap.org/seamark/${z}/${x}/${y}.png", (IEnumerable<string>)new string[]{}, (string)null, nameof(OSM_OpenSeaMap), (IPersistentCache<byte[]>)null, (Func<Uri, byte[]>)null, new Attribution());
//return new HttpTileSource((ITileSchema)new GlobalSphericalMercator(), "https://tiles.openseamap.org/seamark/${z}/${x}/${y}.png", (IEnumerable<string>)null, (string)null, nameof(OSM_OpenSeaMap), (IPersistentCache<byte[]>)null, (Func<Uri, byte[]>)null, (Attribution)null);
        }
    }

I will give you some pointers so you can figure this out yourself.

My approach would be in two ways.

1) See how it works on the web

Go the a web hosted openseamap site and use developer tools to see which requests are transmitted and what kind of images are returned from those.

2) Try to get it to work in Mapsui

Try to create a tile layer in Mapsui. Run it. And use fiddler (or a similar tool) to see what kind of requests are created. Then adopt your definition to match the web request.

Below is something I created that way. I don't fully understand openseamap though. It seems to use openstreetmap itself as a baselayer. Then there are openseamap overlay tiles that are always empty (the files I inspected) and then there are the aspx pages that I use in the sample below.

c# private static HttpTileSource CreateTileSource() { return new HttpTileSource(new GlobalSphericalMercator(), "https://tiles.marinetraffic.com/ais_helpers/shiptilesingle.aspx?output=png&sat=1&grouping=shiptype&tile_size=256&legends=1&zoom={z}&X={x}&Y={y}", name: "OpenStreetMap", attribution: OpenStreetMapAttribution); }

image

I was looking on the html code (F12, Firefox) in the web, but maybe I should look again and closer.

With MarineTraffic overlay it works perfectly. (OSM as base map)
obraz

Thanks!

Was this page helpful?
0 / 5 - 0 ratings

Related issues

pauldendulk picture pauldendulk  路  7Comments

willy40 picture willy40  路  6Comments

YordanYanakiev picture YordanYanakiev  路  6Comments

EduardsBrown picture EduardsBrown  路  5Comments

lukaszpitulski picture lukaszpitulski  路  3Comments