Google Map未正确填充div

Question

我有一张谷歌地图，它应该获取用户的位置，以他们的位置为中心，然后提供到地图上固定点的路线。

问题是地图没有填充整个div，也没有居中或缩放到正确的位置，但是加载用户位置并指示方向正常。如果我在jsFiddle中重新创建它，虽然它工作正常，但当包含在我的网站中时，会出现问题。

jsFiddle：http://jsfiddle.net/wXnjt/1/

包含在我的网站中时的外观。

是什么导致了这个问题？ （如果你想让我的代码发布在这里，而不是去小提琴，请告诉我）

编辑：开发控制台中也没有出现错误。我也尝试使用preserveViewport: true，但它没有效果。

Answer 1

您的Google地图初始化应该在一个函数中，如果它不确定它。然后你只能在切换之后初始化地图，如果用户不希望看到它，也会确保它不会被加载。

function init_maps(){

    // google maps api goes here

}

var init = false;

$('.contact_us').click(){

    if(!init){

        init_maps();
        init = true;
    }

    $('.contact_us').slideToggle();

}