1

I've created a webmap viewer with Leaflet and used the plugin leaflet.wms to call the WMS GetFeatureInfo service to query a map layer and return information about the underlying features. My code is as follows

var source = L.WMS.source("http://xxxx/geoserver/wms",
                    {
                        "format": "image/png",
                        "transparent": "true",
                        "attribution": "© Instituto Geográfico Nacional de España",
                        "info_format": "text/html",         
                    }        
                );
var lyrAtlas = source.getLayer("atlas:lista_reprod_iii");

It works fine, but the information to be returned is quite long and the displayed popup is too narrow, so the result is unmanageable. I want to set the width of the popup to something wider, but I haven't found any hint to obtain it. Is it possible to do so?

Edit

This is the only chunk of code of the plugin js file where the popup appears:

'showFeatureInfo': function(latlng, info) {
    // Hook to handle displaying parsed AJAX response to the user
    if (!this._map) {
        return;
    }
    this._map.openPopup(info, latlng);
},

2 Answers 2

3

What you have to do is to define your own showFeatureInfo option/method where you can set width of the popup like @Ziggy suggested. To do this you can use include method to modify L.WMS.Source class (see https://leafletjs.com/examples/extending/extending-1-classes.html).

Code for modifying L.WMS.Source class could look something like this:

L.WMS.Source = L.WMS.Source.include({
  'showFeatureInfo': function(latlng, info) {
    L.popup({maxWidth: 600})
      .setLatLng(latlng)
      .setContent(info)
      .openOn(map);
  }
});
2
  • Yes, that's the answer. However, the option to use is minWidth instead of maxWitdth
    – jpinilla
    Oct 18 at 12:06
  • It depends on what you want.
    – TomazicM
    Oct 18 at 13:21
1

Its in the leaflet popup properties

var popup =  L.popup({
  maxWidth: 375
})
1
  • I'm unable to make this code to work. I'm editing the question adding code from the plugin.
    – jpinilla
    Oct 18 at 7:38

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.