Держите карту Google Maps v3 скрытой, показывайте при необходимости

Question

Есть ли способ предотвратить отображение карты Google Maps (JS, v3) с самого начала?Я делаю некоторую предварительную обработку и хотел бы показать мой счетчик «Загрузка», пока все не будет готово (более красноречиво, скрыть карту - например, контейнер div - до завершения всей предварительной обработки - вв какой точке показать карту).

Подключение события idle карты не очень помогает, так как карта уже отображается, когда оно наступает.

Я знаю, что контейнер div получает встроенный стильПосле загрузки GMaps, моей первой идеей было очистить атрибут style (при прослушивании события idle), но было бы интересно посмотреть, есть ли способ создать карту и не отображать ее, пока всепредварительная обработка завершена.

Возможно, используя аргумент для конструктора new google.maps.Map, или MapOption?

Есть мысли по этому поводу?

Спасибозаранее!

Answer 1

Также не забудьте позвонить:

google.maps.event.trigger(map, 'resize');

если вы изменили размер <div>. A display:none <div> не имеет размера.

Answer 2

Или вы можете просто скрыть это, как с помощью CSS Visablility или CSS непрозрачности.

$("#GoogleMap").css({ opacity: 0, zoom: 0 });
initialize();

google.maps.event.addListener(map,"idle", function(){ 
     $('#Loader').hide();
     $("#GoogleMap").css({ opacity: 1, zoom: 1 });
}); 

Answer 3

Это работает для меня. Я использую библиотеку JQuery.

$(document).ready(function(){
    $('#Checkbox').click(function(){
        $('#googleMapDiv').toggle();
        initialize(); // initialize the map
    });
});

Answer 4

Это будет работать

    google.maps.event.addListener(map, "idle", function ()
    {
        google.maps.event.trigger(map, 'resize');
    });

Answer 5

у меня это нормально работает, я использую вкладки jquery

setTimeout(function() {
        google.maps.event.trigger(map, "resize");
        map.setCenter(new google.maps.LatLng(default_lat, default_lng));
        map.setZoom(default_map_zoom);
    }, 2000);

по этой ссылке https://code.google.com/p/gmaps-api-issues/issues/detail?id=1448

Answer 6

Другой способ показать скрытую карту при первом отображении карты <div> - установить стиль: видимость.

При первом скрытии используйте visibility = hidden; показать использование visibility = visible

причина: visibility: hidden означает, что содержимое элемента будет невидимым, но элемент останется в своем исходном положении и размере.

Answer 7

в зависимости от того, что вы делаете, может быть несколько вариантов bools, которые вы установили в true при выполнении каждого процесса.

Например:

, если у вас запущена служба геокодирования, котораяесли вы хотите подождать, у вас может быть переменная с именем GeoState

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

Answer 8

лучший способ:

gmap.redraw = function() {
    gmOnLoad = true;
    if(gmOnLoad) {
        google.maps.event.trigger(gmap, "resize");
        gmap.setCenter(gmlatlng);
        gmOnLoad = false;
    }
}

и в событии клика:

$("#goo").click(function() {
  if ($("#map_canvas").css("display") == "none") {
    $("#YMapsID").toggle();
    $("#map_canvas").toggle();
    if (gmap != undefined) {
        gmap.redraw();
    }
  }
});