Leaflet: toutes les tuiles ne sont pas chargées jusqu'à ce que la fenêtre de redimensionnement

Le redimensionnement sur windows resize fonctionne correctement, voir cet exemple : http://leaflet.cloudmade.com/debug/map/map-mobile.html

Si vous redimensionnez le conteneur de carte manuellement, vous devez appeler map.invalidateSize() .

Je vois le même problème. Seules quelques vignettes sont affichées initialement, mais si je redimensionne la fenêtre de mon navigateur, toutes les vignettes sont affichées.

PAS corrigé pour ce bug sur chrome27. J'ai le même problème
L'url a échoué

Vérifiez celui-ci : http://leafletjs.com/examples/mobile-example.html

@mourner, je dois modifier la carte de manière dynamique. Et j'utilise map._onResize() pour la corriger. L'URL ci-dessus est un exemple en plein écran, pas pour changer la taille de la carte. Merci pour votre hack @ludinov-stuzo

@mourner J'ai trouvé le problème.

    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;
        }
    });

Le redimensionnement sur windows resize fonctionne correctement, voir cet exemple : http://leaflet.cloudmade.com/debug/map/map-mobile.html

Si vous redimensionnez le conteneur de carte manuellement, vous devez appeler map.invalidateSize() .

Vous avez fait ma journée. Ma carte ne fonctionnerait tout simplement pas correctement. Aucune des fonctions, y compris setView , flyTo , panTo , fitbounds ne fonctionnerait correctement. Cela fonctionnerait parfois, et parfois non. Je ne pouvais tout simplement pas comprendre quand c'était le cas . Ensuite, j'ai vu que cela fonctionnait lorsque j'ai redimensionné la fenêtre, et après des heures de R&D inutiles, j'ai atteint ce fil.

Merci beaucoup.

Écoutez Map obj m'a aidé. ajouter une fonction qui se déclenche lorsque la carte est chargée ou modifiée de taille et à l'intérieur de l'exécution - map.invalidateSize().

La manière des crochets de réaction :

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

export default const MyMap = () => {

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


  /*render and other function*/
}