Suite

OpenLayers ajoute EventListener pour le plein écran fermer

OpenLayers ajoute EventListener pour le plein écran fermer


Je construis actuellement une application Web avec Angular et OpenLayers. En raison de la nature de mon site, je dois appeler map.updateSize() lorsque l'écran change de taille, ce qui fonctionne comme prévu.

Cependant, lorsque j'entre en plein écran en utilisant le contrôle FullScreen d'OpenLayers, mes cartes s'étirent bien, mais lors de la fermeture du plein écran, elles conservent l'aspect plein écran et doivent être mises à jour, d'où un appel à map.updateSize().

Depuis OL3 ol.control.FullScreen, il y a un écouteur d'événement, mais je ne sais pas à quoi le lier et comment l'écrire. Est-ce que n'importe qui peut me fournir un exemple, si tout va bien avec l'événement de fermeture du plein écran ?


METTRE À JOUR: En creusant un peu, voici ce que j'ai trouvé. Si vous souhaitez écouter en plein écran, vous pouvez enregistrer l'auditeur sur document. Maintenant, l'événement a un nom différent pour chaque navigateur, donc pour la famille webkit :

document.addEventListener("webkitfullscreenchange", function(evt) { console.log('fullscreen… '); console.log(evt); });

Et les autres:mozfullscreenchange,MSFullscreenChangeretchangement plein écran. Extrait de ol-debug.js :

goog.dom.fullscreen.EventType = { /** Distribué par le document lorsque l'état du plein écran change. */ CHANGE : (function() { if (goog.userAgent.WEBKIT) { return 'webkitfullscreenchange'; } if (goog.userAgent.GECKO) { return 'mozfullscreenchange'; } if (goog.userAgent.IE) { return ' MSFullscreenChange'; } // Opera 12-14 et norme W3C (Brouillon): // https://dvcs.w3.org/hg/fullscreen/raw-file/tip/Overview.html renvoie 'fullscreenchange'; }) () };

Un auditeur s'écrirait comme :

var fullscreen = new ol.control.FullScreen(); map.addControl(plein écran); fullscreen.on('propertychange', function(evt){ console.log(evt); }); fullscreen.on('change', function(evt){ console.log(evt); });

Mais ni l'un ni l'autre ne tire quoi que ce soit. Avez-vous remarqué qu'Openlayers le fait déjà pour vous ? https://github.com/openlayers/ol3/blob/v3.8.2/src/ol/control/fullscreencontrol.js#L149

Utilisez-vous la dernière version ?