OpenSeaMap Forum

For new registrations: Please create and activate an account. Afterwards send an email to forum.openseamap@gmail.com including a short message and your username to get write access to this forum. Thanks!
Für neue Registrierungen: Bitte erstelle einen neuen Account und schalte ihn frei. Anschließend sende eine kurze Mail mit deinem Nutzernamen an forum.openseamap@gmail.com um Schreibzugriff für dieses Forum zu bekommen. Danke!

You are not logged in.

#1 2014-05-15 12:53:18

jamesc
Member
Registered: 2014-05-15
Posts: 1

Adding Custom Overlay for Webmap

Hi all,

I'm interested in using the OpenSeaMap as a base and adding a layer on top of it to outline a specific area (the JWC excluded areas for War Risk marine insurance) and then embed it as a slippy map in a web page.

I've managed to start creating the polygon kml file for my highlight layer, but as to how I can publish it using OSM as the basemap, I'm drawing a blank.

Furthermore, I'd like to have my polygon match up with parts of the OSM basemap - particularly the territorial waters marks - in some places. At the moment I've managed to draw my kml polygon by editing the MapBox shapefile resources so my polygon matches the land/water boundaries - would anyone be able to point me in the direction of how to access the same for OSM?

Any help much appreciated!

James

Offline

#2 2014-05-15 13:48:43

kannix
Member
From: Ruhrgebiet
Registered: 2013-10-27
Posts: 148
Website

Re: Adding Custom Overlay for Webmap

Hi James,

you should set up seamarks as an overlay: Tiles are transparent!

To avoid pink tiles:

  <style type="text/css">
      .olImageLoadError {
          /* when OL encounters a 404, don't display the pink image */
          display: none !important;
  </style>

To add an seamark overlay:

map.addLayer (new OpenLayers.Layer.OSM("Seamarks (OseaM)",
                         [ 'http://t1.openseamap.org/seamark/${z}/${x}/${y}.png' ],
                         {  tileOptions        : {crossOriginKeyword: null},
                            isBaseLayer        : false,
                            alpha              : true,
                            attribution        : "&copy; <a href='http://openseamap.org/' target='_blank'>openseamap.org</a>",
                            visibility         : true
                         }));

Have a nice day, Dirk

Offline

Board footer

Powered by FluxBB