Question

有没有办法阻止Google地图（JS，v3）地图从一开始就显示出来？我正在进行一些预处理，并希望显示我的“加载”微调器，直到一切都好（去更有说服力，隐藏地图 - 例如容器div - 直到所有预处理完成 - 在这一点上，显示地图）。

连接地图的idle事件并没有多大帮助，因为当此事件发生时，地图已经显示。

我知道容器div在加载后由GMaps进行内联样式化，我的第一个想法是清除style属性（同时收听idle事件），但是看看是否有创建地图的方法并且在完成所有预处理之前不显示它将会很有趣。

可能通过使用new google.maps.Map构造函数或MapOption的参数？

对此有何想法？

提前谢谢！

Answer 1

还记得打电话：

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

如果您更改了<div>的大小。 display:none <div>没有尺寸。

Answer 2

或者你可以隐藏它，就像css不透明度的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

这对我来说很好，我使用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 5

这将有效

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

Answer 6

更好的方法：

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

Answer 7

取决于你正在做什么，另一个可能性就是在每个过程完成时将多个bool设置为true。

例如：

如果您正在运行要等待的地理编码服务，则可以调用一个var GeoState

并在地理编码器的结果部分将GeoState设置为true，然后有一个定时功能检查所有服务是否都返回true，如果有，则使地图可见。

Answer 8

在地图首次渲染<div>时显示隐藏地图的另一种方法是设置样式：可见性。

首次隐藏时，请使用visibility = hidden；显示使用visibility = visible

原因是：visibility:hidden means that the contents of the element will be invisible, but the element stays in its original position and size.

隐藏Google地图v3地图，并在需要时显示

8 个答案: