Tôi đã tạo một trang web có chứa nút để đặt toàn màn hình bản đồ và trở về dạng bình thường, bản đồ sự cố không được đặt thành toàn màn hình cho đến khi tôi thay đổi kích thước cửa sổ đầu ra, cách khắc phục điều này,

Bất kỳ hướng dẫn và giúp đỡ được đánh giá cao.

Dưới đây là ví dụ hoạt động: Demo

Thêm map.updateSize();vào cuối$("#btn-full-screen").click...

BẢN GIỚI THIỆU

Cập nhật kích thước tài liệu

Hàm này phải được gọi bởi bất kỳ mã bên ngoài nào tự động thay đổi kích thước của div bản đồ (vì mozilla sẽ không cho phép chúng tôi bắt gặp

Bạn có thể sử dụng OpenLayers.Map.updateSizephương pháp để vẽ lại Lớp cơ sở của mình khi bạn tối đa hóa bản đồ.

Vì vậy, thêm một chức năng như:

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

bạn chỉ cần thêm một tùy chọn bổ sung vào bản đồ của mình:

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

Chúc may mắn!

Viết mã sau đây bất cứ khi nào bạn được yêu cầu vẽ lại bản đồ như thay đổi kích thước cửa sổ hoặc thay đổi tab hoặc toàn màn hình hoặc trên bất kỳ sự kiện nào khác theo nhu cầu của bạn.

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

điều này sẽ tự động kích hoạt updateSize()chức năng trong nội bộ.