To set an automatic zoom for setView depending on bounds or viewport

[Wolf]

Hi,
first - I started with leafletjs three weeks before, and I am not JS prof.

Basics of my code:
- HTML/CSS,
- width/height 100% - map covers the complete screen/viewport
- bounds and setView are set to centre a certain map section

My problem:
Changing the viewport from big to small - like desktop screen to mobile screen - means to hide parts of the map section outside the minor viewport. The map does not automatically zoom smaller (or bigger) to the next zoom level to display the whole map section.

Question:
How can I zoom the map automatically so that the map section is always displayed?

Wolf

[Peter Kowalewska]

You are probably going to have to code that responsiveness with a conditional taking screen.width. In other words, since you can use javascript to detect the screen size (screen.width), you will have the ability to specify particular zoom levels for particular screen widths:
if (screen.width <= 480){

var map = L.map('map', {
    center: [51.505, -0.09],
    zoom: 13
});

}else { };

I hope this helps.