Comment redessiner / rafraîchir la carte sur le redimensionnement du canevas?

9

J'ai créé une page Web qui contient un bouton pour définir la carte en plein écran et revenir à sa forme normale, la carte du problème ne se met pas en plein écran jusqu'à ce que je redimensionne la fenêtre de sortie, comment surmonter cela,

Tout conseil et aide sont appréciés.

Voici l'exemple de travail: Démo

bios
la source
voir aussi ici gis.stackexchange.com/questions/31409/…
Matthew Lock

Réponses:

13

Ajouter map.updateSize();à la fin de$("#btn-full-screen").click...

DEMO

documentation updateSize

Cette fonction doit être appelée par tout code externe qui modifie dynamiquement la taille de la carte div (car mozilla ne nous permet pas d'attraper le «onresize» pour un élément)

CaptDragon
la source
5

Vous pouvez utiliser une OpenLayers.Map.updateSizeméthode pour redessiner votre couche de base lorsque vous agrandissez la carte.

Donc, ajouter une fonction comme:

var fullScreen = function () {
    map.baseLayer().redraw();
}

il vous suffirait d'ajouter une option supplémentaire à votre carte:

var map = new OpenLayers.Map({
    div: "map",
    center: new OpenLayers.LonLat(0, 0),
    updateSize: fullScreen,
    minResolution: "auto",
    minExtent: new OpenLayers.Bounds(-1, -1, 1, 1),
    maxResolution: "auto",
    maxExtent: new OpenLayers.Bounds(-180, -90, 180, 90),
    projection: Mercator,
    displayProjection: Geographic
});

Bonne chance!

DaniBaeyens
la source
Il ne définit pas la carte en plein écran, pouvez-vous mettre à jour le violon.
bios
Merci. J'avais des carreaux devenant blancs lors du zoom à l'aide transitionEffect: 'resize'. map.baseLayer().redraw();l'a corrigé.
Nicolas Boisteault
0

Écrivez le code suivant chaque fois que vous devez redessiner la carte comme sur le redimensionnement de la fenêtre ou sur le changement des onglets ou en plein écran ou sur tout autre événement selon vos besoins.

$(window).trigger('resize');

cela déclenchera automatiquement la updateSize()fonction en interne.

Shivek Parmar
la source