Как обнаружить прогресс, загруженный для GroundOverlay

Question

Я загружаю 10 GroundOverlays на GoogleMap и хотел бы показать прогресс, связанный с загрузкой изображений.

var imageBounds = new google.maps.LatLngBounds(
new google.maps.LatLng(42.80059,-115.253806), 
new google.maps.LatLng(47.481725,-110.227471)); 

var layer1 = new google.maps.GroundOverlay("overlays/layer1.png",imageBounds); 
layer1.setOpacity(.5); 
layer1.setMap(map); 

Как определить, когда загружено фактическое изображение каждого наложения или загружено%? Я хотел бы добавить индикатор выполнения или что-то, чтобы показать пользователю, что наложения загружаются, так как это может занять около 5 секунд.

Answer 1

Сомневаюсь, что вы можете это сделать. Вы можете запросить новые функции, добавленные в класс GroundOverlay, чтобы пользователи имели больше доступа и контролировали загруженное изображение. Я хотел бы иметь такие функции для своих проектов.

Answer 2

Если у вас есть одно единственное изображение как GroundOverlay, я бы сделал следующее:

1. Создание IMG тег через Javascript
2. Установите его SRC в накладками/layer1.png
3. отобразить окно ожидания
4. Добавьте в него событие onload, на котором загрузите его как наложение gmaps и закройте окно ожидания.

Прогресс ... это немного больше для браузера. Но загрузка легко, так:

function loadOverlay(){ 
    var img = new Image(); 
    var img_url = "overlays/layer1.png" 
    img.src= img_url; 
    $('#wait_for_overlay').show(); 
    img.onLoad = function(){ 
     $('#wait_for_overlay').hide(); 
     var layer1 = new google.maps.GroundOverlay(img_url,imageBounds); 
     layer1.setOpacity(.5); 
     layer1.setMap(map); 
    } 
}; 

Причина, почему это будет работать:

Создание объекта IMG и установив его атрибут «ЦСИ» заставит браузер начать скачать требуемый файл, как только функция javascript делает это.

Браузер помещает это изображение в свой локальный кеш, а затем вызывает функцию onLoad, чтобы увидеть, что должно произойти с ним.

Обратный вызов фактически ничего не делает для переменной img (возможно, он должен убедиться, что он не будет уничтожен в соответствии с правилами закрытия, сделать с ним NOP, если это багги), но вместо этого вызывает карты google функция.

Функция google-maps запросит изображение на том же URL-адресе, в котором браузер будет искать свою таблицу кеша, и немедленно вернет изображение из кеша.

Этот трюк противный, но на самом деле, движок Google Maps будет делать то же самое onLoad thingy в фоновом режиме (так как это работает с двигателями карт).

Я надеюсь, что это удовлетворит ваш вопрос ... нет индикатора выполнения, только индикатор загрузки ... Возможно, вы можете сделать индикатор выполнения, запросив его с XHR и проверить прогресс, я не уверен, но трюк будет то же: сделайте запрос faux, чтобы он попал в кеш.