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

}