Leaflet: set Zoom level on search

Question

I'm using the plugin Leaflet.Control.Search to search markers in a layer group, which works fine. Once the marker has been found, the map already automatically pans to the center of the respective location, and the marker popup is being opened.

Now, on search, I would like to set the map's zoom level to a fixed value. My map's initial zoom level is 12 – but once someone uses the search i'd like to set it to 16. How could this be achieved? I tried to implement setZoom, but I'm not sure how the correct syntax should be..

The code looks like this at the moment:

var searchControl = new L.Control.Search({layer: markers2, propertyName: 'Name', circleLocation:true});
    searchControl.on('search_locationfound', function(e) {  
            e.layer.openPopup().openOn(map);    
            map.setZoom(16);
    });     
map.addControl( searchControl ); 

Thanks a lot for any hints!

ps: when i put map.setZoom(16); BEFORE e.layer.openPopup().openOn(map); then the zoom works fine, but the popup doesn't open like it should – it only opens when I hit search again…

Solution

Have you tried map.setZoom(16);instead of this in your "on location found" listener?
Alternatively, you might want to try the map.setView(). It takes a lat/lng and zoom level. You can either take in the marker's lat/lng or the popup's lat/lng

Comments

[julia]

Hi Chris, thanks a lot for the answer. I had a stupid typo in my text before, I had 'map.setZoom' all along, not 'this.setZoom'... it works ok, but sometimes the popups open, and sometimes they don't. Maybe it's a small bug in the search plugin? I can't quite figure it out…