Leaflet: no todos los mosaicos cargados hasta la ventana de cambio de tamaño

El cambio de tamaño en Windows funciona correctamente, vea este ejemplo: http://leaflet.cloudmade.com/debug/map/map-mobile.html

Si cambia el tamaño del contenedor del mapa manualmente, debe llamar a map.invalidateSize() .

Estoy viendo el mismo problema. Inicialmente, solo se muestran algunos mosaicos, pero si cambio el tamaño de la ventana de mi navegador, se muestran todos los mosaicos.

NO solucionado para este error en Chrome27. Tengo el mismo problema
La url es fallida

Marque este: http://leafletjs.com/examples/mobile-example.html

@mourner Tengo que cambiar el mapa dinámicamente. Y uso map._onResize() para arreglarlo. La URL de arriba es un ejemplo de pantalla completa, no para cambiar el tamaño del mapa. Gracias por tu truco @ludinov-stuzo

@mourner He encontrado el problema. Uso setTimeout() para ejecutar invalidateSize() después de la animación.

    var is_fullScreen=0;
    $("#close_left").click(function(){
        if(is_fullScreen){
            $("#left_panel").animate({left:0,opacity:1},800);
            $("#right_panel").animate({marginLeft:280},800);
            this.className="icon-left";
            is_fullScreen=0;
            setTimeout(function(){ map.setView([5,40],2);},1000);
        }else{
            $("#left_panel").animate({left:-280,opacity:0},800);
            $("#right_panel").animate({marginLeft:0},800);
            this.className="icon-right";
            setTimeout(function(){map.invalidateSize();            map.setView([5,-20],3);},1000)
            is_fullScreen=1;
        }
    });

El cambio de tamaño en Windows funciona correctamente, vea este ejemplo: http://leaflet.cloudmade.com/debug/map/map-mobile.html

Si cambia el tamaño del contenedor del mapa manualmente, debe llamar a map.invalidateSize() .

Me has alegrado el día. Mi mapa simplemente no funcionaba bien. Ninguna de las funciones, incluidas setView , flyTo , panTo , fitbounds , funcionaría correctamente. Funcionaría a veces, ya veces no. Simplemente no podía entender cuándo lo hizo . Luego vi que funciona cuando cambio el tamaño de la ventana, y después de horas de I + D inútil llegué a este hilo.

Muchas gracias.

Escuche Map obj me ayudó. agregue una función que se active cuando el mapa se cargue o cambie de tamaño y dentro ejecute - map.invalidateSize().

La forma de reacción de los ganchos:

import { Map as LeafletMap } from "react-leaflet";

export default const MyMap = () => {

   useEffect(()=>{
        mapElement.current.leafletElement.invalidateSize();
    },[mapElement])


  /*render and other function*/
}