0

I noticed that the "popups on hover" function is disabled if I set the "layer groups" in the layer.js file. Can you recommend a solution?

I modified:

layer.js organizing the layers into groups

var layersList = [

new ol.layer.Group({
            title: 'Basemap',
            fold: 'open',
            layers: [lyr_GoogleTerrain_0,lyr_GoogleSatellite_1,lyr_OpenStreetMap_2,lyr_SfondoBianco_3]
            }),

new ol.layer.Group({
            title: 'Cartografia generale',
            fold: 'open',
            layers: [lyr_ConfiniComunali_30,lyr_LimiteRiserva_31]
            }),
            
new ol.layer.Group({
            title: 'Itinerari Monte Paganuccio',
            fold: 'open',
            layers: [lyr_n534_104km_h320m_4,lyr_n533_187km_h550m_5,lyr_n532_72km_h140m_200_6,lyr_n531b_850km_h160m_230_7,lyr_n531a_800km_h180m_200_8]
                }), 
            
new ol.layer.Group({
            title: 'Itinerari Monte Pietralata',
            fold: 'open',
            layers: [lyr_n523_189km_h650m_9,lyr_n522b_105km_h280m_345_10,lyr_n522a_800km_h200m_215_11,lyr_n521_120km_h446m_345_12]
                }),         

new ol.layer.Group({
            title: 'Itinerari Fondovalle',
            fold: 'open',
            layers: [lyr_n511_600km_h0m_130_13]
                }),
            
new ol.layer.Group({
            title: 'Sentieri Monte Paganuccio',
            fold: 'open',
            layers: [lyr_n452a_480km_h205m_315_14,lyr_n452_900km_h375m_530_15,lyr_n451_510km_h811m_335_16,lyr_n450a_380km_h375m_230_17]
                }),

new ol.layer.Group({
            title: 'Sentieri Monte Pietralata',
            fold: 'open',
            layers: [lyr_n450_530km_h422m_300_18,lyr_n449b_096km_h49m_050_19,lyr_n449a_077km_h20m_040_20,lyr_n449_277km_h495m_240_21,lyr_n446a_080km_h82m_035_22,lyr_n446_370km_h539m_240_23,lyr_n441b_020km_h47m_025_24,lyr_n441a_120km_h124m_110_25,lyr_n441_385km_h346m_220_26,lyr_n440b_191km_h50m_055_27,lyr_n440a_123km_h222m_050_28,lyr_n440_68km_h423m_500_29]
                }),     

new ol.layer.Group({
            title: 'Difficoltà percorso:',
            layers: [
            
                new ol.layer.Group({
                title: '&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<img src="sidebar-v2/ordisabeba/impegnativo.png"></img> <i class="fas fa-bicycle"></i> Impegnativo (MTB)<p></p>',
                layers: []
                }),
                
                new ol.layer.Group({
                title: '&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<img src="sidebar-v2/ordisabeba/escursionistico.png"></img> <i class="fas fa-hiking"></i> Escursionistico',
                layers: []
                }),
                
                new ol.layer.Group({
                title: '&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<img src="sidebar-v2/ordisabeba/turistico.png"></img> <i class="fas fa-walking"></i> Turistico',
                layers: []
                }),
            
            ]
            }),
            
new ol.layer.Group({
            title: '<p style="text-align:justify">Descrizioni complete nella sidebar a sinistra dello schermo</p><p></p>',
            layers: []
            })

];

and gis2web.js by adding groupSelectStyle: 'none' in this line so as not to see the groups switch-on tick

var layerSwitcher = new ol.control.LayerSwitcher({tipLabel: "Layers", groupSelectStyle: 'none'});

This is the result of the legend which, however, does not allow you to use the "popup on hover" function enter image description here

the popups on hover does not work: enter image description here

1 Answer 1

0

I found a solution by myself, only this step needs to be changed in qgis2web.js file

map.forEachFeatureAtPixel(pixel, function(feature, layer) {
        if (layer) {  ecc.....

modify both var onPointerMove = function (evt) { and var onSingleClick = function (evt) {

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.