リーフレットWMTSのタイル順序が間違っている

Aug 21 2020

リーフレットマップにWMTSレイヤーを追加しました。タイルは読み込まれていますが、正しい順序ではありません。誰かがこの問題に遭遇したことがありますか?もしそうなら、どのようにそれを克服しましたか?

    var map = new L.Map('viewerDiv', {
         crs: L.CRS.EPSG3857
    });
    var url =
        'http://services.arcgisonline.com/arcgis/rest/services/World_Topo_Map/MapServer/WMTS/tile/1.0.0/World_Topo_Map/default/default028mm/{z}/{x}/{y}.png';
    var tilelayer = new L.tileLayer(url, {
        tileSize: 256,
        tms: true,
        attribution: 'World Map'
    });
    map.addLayer(tilelayer);
    map.setView(L.latLng(50, 8), 4);

http://services.arcgisonline.com/arcgis/rest/services/World_Topo_Map/MapServer/WMTS/1.0.0/WMTSCapabilities.xml

回答

TomazicM Aug 21 2020 at 21:45

タイルセットの機能を見ると、線が表示されます。<TileMatrixSet>GoogleMapsCompatible</TileMatrixSet>これは、これが標準のGoogleマップタイルセットであることを意味します。@nmtokenが指摘したように、これはxy順序を逆にする必要があり、これはTMSレイヤーではないため、レイヤーオプションtmsを省略する必要があることを意味します。

var tilelayer = new L.tileLayer(
  'http://services.arcgisonline.com/arcgis/rest/services/World_Topo_Map/MapServer/WMTS/tile/1.0.0/World_Topo_Map/default/default028mm/{z}/{y}/{x}.png',
  {
    tileSize: 256,
    attribution: 'World Map'
  }
);