Shift between WMS Tiles in Leaflet

Question

I use Leaflet to show a WMS Layer via a proxy.php (for authentication). That is working on most WMS Layers. But I have some WMS Sources, which are having a small shift in the tiles. See Overlay Map in the example.

<!DOCTYPE html>

TEST MAP

<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">

<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css" />
<script src="https://unpkg.com/[email protected]/dist/leaflet.js"></script>

var map1  = L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
    maxZoom: 30,
    maxNativeZoom: 18
});


var map4 = new L.tileLayer.wms("proxy.php?url=http://geoshop.kommunalportal.ch/SWMS?", {
    layers: 'lk_wms_wasser',
    format: 'image/png',
    transparent: true,
    maxZoom:30
});

var map = L.map('mapid').setView([47.549904, 9.152927], 18);

var baseMaps = {
    "map1": map1
    
};

var overlayMaps = {
    "map4": map4
};

L.control.layers(baseMaps, overlayMaps).addTo(map);

map1.addTo(map);
map4.addTo(map);

leaflet tiles wms

TomazicM · Accepted Answer

Standard projection for Leaflet is EPSG:3857. If you submit GetCapabilites request to you WMS server, you'll see that it supports only the following projections: EPSG:2056 and EPSG:21781.
This means two things:

If you want to use this layer, you'll have to define on of those projections with proj4leaflet plugin and then use it for your layer and your map.
Since Leaflet supports only one projection per map, you will not be able to combine this layer with OpenStreet layer, which has only EPSG:3857 projection.

Shift between WMS Tiles in Leaflet

One Answer

Add your own answers!

Ask a Question