谷歌地图没有正确填充 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();

}