Adding WMS v 1.3.0 in Mapbox GL JS

Question

So, I want to add WMS v 1.3.0 layer in Mapbox GL JS.

The WMS source is : https://portal.ina-sdi.or.id/gis/rest/services/PPBW/BATASWILAYAH_10K_ADMINISTRASI_AR_KELDESA/MapServer

And Here is my code :

map.addSource('wms-test-source', {
            'type': 'raster',
            'tiles': [
                'https://portal.ina-sdi.or.id/gis/services/PPBW/BATASWILAYAH_10K_ADMINISTRASI_AR_KELDESA/MapServer/WmsServer?bbox={bbox-epsg-4326}&format=image/png&service=WMS&version=1.3.0&request=GetMap&CRS=EPSG:4326&transparent=true&width=256&height=256&layer=0'
            ],
            'tileSize': 256
        });
        map.addLayer(
            {
                'id': 'wms-test-layer',
                'type': 'raster',
                'source': 'wms-test-source',
                'paint': {}
            }
        );

I have tried using this tutorial : https://docs.mapbox.com/mapbox-gl-js/example/wms/, But I still can't figure why i can't add this WMS layer, is this because the WMS version is 1.3.0? I've change the link many times and get some error Http 400 and sometimes CORS. I've tried this WMS in QGIS and leaflet, and this WMS works well, please help!????????

and here my jsfiddle snippet : https://jsfiddle.net/yekjzhvq/

Mikail Yetkin Mikail Yetkin · Accepted Answer · 2021-01-28T09:49:22

It seems the WMS layer is only available in EPSG:4326, mapboxgl only supports EPSG:3857 layers, you are importing it as EPSG:4326 and the server doesnt respond. You should make sure the layer is available in EPSG:3857 and then try to import it as

'tiles': [
            'https://portal.ina-sdi.or.id/gis/services/PPBW/BATASWILAYAH_10K_ADMINISTRASI_AR_KELDESA/MapServer/WmsServer?bbox={bbox-epsg-3857}&format=image/png&service=WMS&version=1.3.0&request=GetMap&CRS=EPSG:3857&transparent=true&width=256&height=256&layer=0'
        ],

Adding WMS v 1.3.0 in Mapbox GL JS

1 Answers