1

I created a small webgis with the plugin qgis2web. I also added a wms layer but when I go to view the webgis, this layer is not displayed, why? I would like to insert this WMS layer: http://rsdi.regione.basilicata.it/maps/ctr_raster

<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="initial-scale=1,user-scalable=no,maximum-scale=1,width=device-width">
    <meta name="mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <link rel="stylesheet" href="css/leaflet.css">
    <link rel="stylesheet" href="css/qgis2web.css">
    <style>
    html, body, #map {
        width: 100%;
        height: 100%;
        padding: 0;
        margin: 0;
    }
    </style>
    <title></title>
</head>
<body>
    <div id="map">
    </div>
    <script src="js/qgis2web_expressions.js"></script>
    <script src="js/leaflet.js"></script>
    <script src="js/leaflet.rotatedMarker.js"></script>
    <script src="js/leaflet.pattern.js"></script>
    <script src="js/leaflet-hash.js"></script>
    <script src="js/Autolinker.min.js"></script>
    <script src="js/rbush.min.js"></script>
    <script src="js/labelgun.min.js"></script>
    <script src="js/labels.js"></script>
    <script src="js/leaflet.wms.js"></script>
    <script src="data/cross_tabulation_1800_1955_1.js"></script>
    <script>
    var map = L.map('map', {
        zoomControl:true, maxZoom:28, minZoom:1
    }).fitBounds([[40.8706174062,15.4763824142],[40.9724805093,15.7125025513]]);
    var hash = new L.Hash(map);
    map.attributionControl.addAttribution('<a href="https://github.com/tomchadwin/qgis2web" target="_blank">qgis2web</a>');
    var bounds_group = new L.featureGroup([]);
    function setBounds() {
    }
    var overlay_CTRRaster_0 = L.WMS.layer("http://rsdi.regione.basilicata.it/maps/ctr_raster", "CTR Raster", {
        format: 'image/png',
        uppercase: true,
        transparent: true,
        continuousWorld : true,
        tiled: true,
        info_format: 'text/html',
        opacity: 1,
        identify: false,
    });
    map.addLayer(overlay_CTRRaster_0);
    function pop_cross_tabulation_1800_1955_1(feature, layer) {
        var popupContent = '<table>\
                <tr>\
                    <td colspan="2">' + (feature.properties['code800'] !== null ? Autolinker.link(String(feature.properties['code800'])) : '') + '</td>\
                </tr>\
                <tr>\
                    <td colspan="2">' + (feature.properties['code55'] !== null ? Autolinker.link(String(feature.properties['code55'])) : '') + '</td>\
                </tr>\
            </table>';
        layer.bindPopup(popupContent, {maxHeight: 400});
    }

    function style_cross_tabulation_1800_1955_1_0() {
        return {
            pane: 'pane_cross_tabulation_1800_1955_1',
            opacity: 1,
            color: 'rgba(0,0,0,1.0)',
            dashArray: '',
            lineCap: 'butt',
            lineJoin: 'miter',
            weight: 1.0, 
            fill: true,
            fillOpacity: 1,
            fillColor: 'rgba(96,165,82,1.0)',
        }
    }
    map.createPane('pane_cross_tabulation_1800_1955_1');
    map.getPane('pane_cross_tabulation_1800_1955_1').style.zIndex = 401;
    map.getPane('pane_cross_tabulation_1800_1955_1').style['mix-blend-mode'] = 'normal';
    var layer_cross_tabulation_1800_1955_1 = new L.geoJson(json_cross_tabulation_1800_1955_1, {
        attribution: '<a href=""></a>',
        pane: 'pane_cross_tabulation_1800_1955_1',
        onEachFeature: pop_cross_tabulation_1800_1955_1,
        style: style_cross_tabulation_1800_1955_1_0,
    });
    bounds_group.addLayer(layer_cross_tabulation_1800_1955_1);
    map.addLayer(layer_cross_tabulation_1800_1955_1);
    var baseMaps = {};
    L.control.layers(baseMaps,{'<img src="legend/cross_tabulation_1800_1955_1.png" /> cross_tabulation_1800_1955': layer_cross_tabulation_1800_1955_1,"CTR Raster": overlay_CTRRaster_0,}).addTo(map);
    setBounds();
    </script>
</body>

0

I don't know the reason why, but if I include layer id 0, instead of layer id 1 from that WMS, it works, but layer id 0 does not.

Other things to check: match your project CRS to your layer CRS, and in qgis2web, check "Match project CRS".

0

If you only use a small extent it might be an easier solution to download the map (e.g. as geotiffs) and add these as layers.

I found another option (link): Create a new XYZ layer using an URL. Example URL for OpenTopMap: https://tile.opentopomap.org/{z}/{x}/{y}.png. It should be possible to export this with qgis2web.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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