2

So I have this WMTS-Layer (the GetCapabilities Request):

https://wmts.marine.copernicus.eu/teroWmts/GLOBAL_MULTIYEAR_WAV_001_032/cmems_mod_glo_wav_my_0.2_PT3H-i_202112?request=GetCapabilities&

Which comes from here: https://data.marine.copernicus.eu/product/GLOBAL_MULTIYEAR_WAV_001_032/services

The layer itself has time-information. When I put the GetCapabilities-request in QGIS as new WMTS-Layer I get all the layers and a direct hint that it has time-information. Now I am really unsure how to use that WMTS-Layer with Leaflet. I'd like to be able to specify the time and request the appropriate tiles. A sample request in QGIS looks like this:

http://wmts.marine.copernicus.eu/teroWmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=&LAYER=GLOBAL_MULTIYEAR_WAV_001_032%2Fcmems_mod_glo_wav_my_0.2_PT3H-i_202112%2FVHM0&STYLE=&FORMAT=image%2Fpng&TILEMATRIXSET=EPSG%3A4326&TILEMATRIX=1&time=2021-12-31T21%3A00%3A00Z&TILEROW=1&TILECOL=2

What I tried so far is the following:

    L.tileLayer
      .wms(
        "http://wmts.marine.copernicus.eu/teroWmts/?service=WMTS&version=1.0.0",
        {
          layers:
            "GLOBAL_MULTIYEAR_WAV_001_032/cmems_mod_glo_wav_my_0.2_PT3H-i_202112/VHM0",
            time: "2021-12-31"
        }
      )
      .addTo(map);

and 

    L.tileLayer
      .wms(
        "http://wmts.marine.copernicus.eu/teroWmts/?service=WMTS&version=1.0.0&request=GetTile",
        {
          layers: "GLOBAL_MULTIYEAR_WAV_001_032/cmems_mod_glo_wav_my_0.2_PT3H-i_202112/VHM0",
          time: "2021-12-31"
        }
      )
      .addTo(map);

Yet, none of the above worked as its not pointing to the resource:/

4
  • oh yes sorry, of course. I added what I tried so far!
    – Lenn
    Commented Feb 4 at 9:54
  • 1
    What response do you get from the server?
    – Ian Turton
    Commented Feb 4 at 11:20
  • WMTS stands for web map tiled service. Not time. Revisit your assumptions about the service. Commented Feb 4 at 12:26
  • Which assumptions exactly? Sorry I got a little confused with the naming... But there are wms services which are time aware as far as I know
    – Lenn
    Commented Feb 4 at 12:57

1 Answer 1

4

The layer you are trying to display is not WMS layer, so you can't display it as L.tileLayer.wms layer. It's WMTS layer, which means it's raster tile layer, so you have to use plain L.tileLayer layer.

Simple code to display it can look something like this:

var map = L.map('map', {
  center: [0, 0],
  zoom: 0,
  crs: L.CRS.EPSG4326
});

var template =
  'https://wmts.marine.copernicus.eu/teroWmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=&LAYER={layer}&STYLE=&FORMAT=image/png&TILEMATRIXSET={tileMatrixSet}&TILEMATRIX={z}&time={time}&TILEROW={y}&TILECOL={x}'

var layer = L.tileLayer(template, {
  layer: 'GLOBAL_MULTIYEAR_WAV_001_032/cmems_mod_glo_wav_my_0.2_PT3H-i_202112/VHM0',
  tileMatrixSet: 'EPSG:4326',
  time: '2021-12-31',
  noWrap: true
}).addTo(map);

That's how it looks like then at zoom 0:

enter image description here

1
  • that is brilliant!! Thank you so much:) I'll try it myself later. It really does help a lot:)
    – Lenn
    Commented Feb 4 at 16:03

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.