Question

我在使用ajax（smartAjax插件）提取内容的网站上使用谷歌地图。但是，地图放在“联系我们”页面上，如果我第一次调用此页面，地图会全部显示，如果我点击返回“我们的概念”，然后再点击“联系我们”，地图只显示部分。我现在打了几个星期，我真的无法得到任何帮助。

是否有人可以在这看看，可能会告诉我在使用ajax调用地图后我可以做些什么才能使地图完整显示？

这是： Please view Website here.

我将不胜感激。

干杯

更新解决方案由jayarjo发布

google.maps.event.addListenerOnce(map, 'idle', function() {
    google.maps.event.trigger(map, 'resize');
    map.setCenter(point); // be sure to reset the map center as well
});

这是您在使用ajax时必须包含的内容，它可以很好地工作。

Answer 1

正如我在评论中所写，您的javascript代码有几个错误。如果你解决这些问题，很可能也会解决这个问题。

但是，快速破解就是写下以下一行：

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

代码中的某处，就在用户更改为“与我们联系”标签后。

Answer 2

您可以尝试修改地图initialize()功能。每次点击链接时都不要初始化map。

var map;
function initialize() {
    var myOptions = {
        center: new google.maps.LatLng(-34.397, 150.644),
        zoom: 8,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    map = new google.maps.Map(document.getElementById("map"), myOptions);
}

使用ajax调用时谷歌地图显示的大小不正确

2 个答案: