Làm cách nào để tải trước một số phần của bản đồ google?

Question

Tôi đang xây dựng một ứng dụng web với API Google Maps, tôi cần phải phóng to một khu vực một cách trơn tru, vì vậy tôi sử dụng setTimeout để tăng mức thu phóng mỗi giây, nhưng ở một số nơi có mạng kém, hình ảnh bản đồ được tải quá chậm rằng trang này một cách nhanh chóng chuyển sang một trang trắng ....

vì vậy câu hỏi của tôi là là nó có thể tải trước một số phần của Google Maps (zoom 3-16 của một điểm)

Answer 1

có lẽ bạn có thể trước tải nó trong div hoặc iframe ẩn.

nhưng bạn nên chắc chắn rằng nó không phải là chống lại Google Maps/Google Earth APIs Terms of Service

10.1.3 Hạn chế đối với dữ liệu xuất khẩu hoặc sao chép.

(b) Không tìm nạp trước, lưu vào bộ nhớ cache hoặc lưu trữ nội dung. Bạn không được tìm nạp trước, bộ nhớ cache hoặc lưu trữ bất kỳ Nội dung nào, ngoại trừ việc bạn có thể lưu trữ: (i) giới hạn lượng nội dung nhằm cải thiện hiệu suất của Triển khai API Maps của bạn nếu bạn tạm thời, an toàn, và theo cách không cho phép sử dụng Nội dung bên ngoài Dịch vụ ; và (ii) bất kỳ mã nhận diện hoặc khóa nội dung nào mà API Maps Tài liệu đặc biệt cho phép bạn lưu trữ. Ví dụ, bạn phải không sử dụng các nội dung để tạo ra một cơ sở dữ liệu độc lập với “nơi”.

Answer 2

Hãy một số mã

Tôi vừa mới tạo ra một kịch bản dựa trên 5 tuổi ý tưởng của RASG. Hãy tạo một bản đồ ẩn và khi nó được nạp đầy đủ, hãy phóng to nó. Chúng tôi lặp lại nó cho đến khi nó lưu trữ tất cả các zoom. Làm việc fiddle is here. Tôi đã đặt thông tin div ở góc trên cùng bên phải để xem cách tiến trình thu phóng.

// init the hidden map 
var mapOptions = { 
    center: new google.maps.LatLng(center.lat, center.lng), 
    zoom: minZoom + 1 
}; 
var preMap = new google.maps.Map(document.getElementById('map-canvas-hidden'), mapOptions); 

// when the current hidden map is fully loaded, zoom it in 
preMap.addListener('tilesloaded', function() { 
    $('#out').html('Zoom ' + preMap.getZoom() + ' preloaded'); 

    // if there is zoom to zoom-in, do it after some rest 
    if(preMap.getZoom() < maxZoom) { 
    setTimeout(function(){ 
     preMap.setZoom(preMap.getZoom() + 1); 
    }, 50); 
    } 
}); 

Thực sự có lưu vào bản đồ không?

Vâng, hãy xóa bộ nhớ cache của trình duyệt và mở fiddle.

Trong hoạt động mạng trình duyệt, chúng ta có thể thấy nhiều hình ảnh tải xuống. Sau đó, phóng to bản đồ và xem lại hoạt động. Có vẻ như tất cả các hình ảnh được tải từ bộ nhớ cache.

Hy vọng điều đó sẽ hữu ích.