He creado una página web que contiene un botón para configurar el mapa en pantalla completa y volver a su forma normal, el mapa del problema no se configura en pantalla completa hasta que cambie el tamaño de la ventana de salida, cómo superar esto,

Cualquier orientación y ayuda es apreciada.

Aquí está el ejemplo de trabajo: Demo

Agregar map.updateSize();al final de$("#btn-full-screen").click...

MANIFESTACIÓN

documentación de updateSize

Esta función debe ser invocada por cualquier código externo que cambie dinámicamente el tamaño del mapa div (porque mozilla no nos permitirá captar el "onresize" de un elemento)

Puede usar el OpenLayers.Map.updateSizemétodo para volver a dibujar su capa base cuando maximiza el mapa.

Entonces, agregando una función como:

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

solo necesitaría agregar una opción adicional a su mapa:

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

¡Buena suerte!

Escriba el siguiente código cada vez que deba volver a dibujar el mapa, como en el cambio de tamaño de la ventana o en el cambio de pestañas o en la pantalla completa o en cualquier otro evento según su necesidad.

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

esto activará automáticamente la updateSize()función internamente.