Ho creato una pagina web che contiene un pulsante per impostare la mappa a schermo intero e tornare alla sua forma normale, la mappa del problema non si imposta a schermo intero fino a quando non ridimensiono la finestra di output, come superare questo,

Qualsiasi consiglio e aiuto è apprezzato.

Ecco l'esempio funzionante: Demo

Aggiungi map.updateSize();alla fine di$("#btn-full-screen").click...

DEMO

documentazione di updateSize

Questa funzione dovrebbe essere chiamata da qualsiasi codice esterno che cambi dinamicamente la dimensione del div della mappa (perché mozilla non ci permetterà di catturare il "onresize" per un elemento)

È possibile utilizzare il OpenLayers.Map.updateSizemetodo per ridisegnare il livello base quando si ingrandisce la mappa.

Quindi, aggiungendo una funzione come:

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

dovresti solo aggiungere un'opzione aggiuntiva alla tua mappa:

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

In bocca al lupo!

Scrivi il seguente codice ogni volta che ti viene richiesto di ridisegnare la mappa come sul ridimensionamento della finestra o sulla modifica delle schede o a schermo intero o su qualsiasi altro evento in base alle tue necessità.

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

questo attiverà automaticamente la updateSize()funzione internamente.