javascript - Google map 未正确填充 div

Question

我有一个 Google map ，它应该获取用户的位置，以他们的位置为中心，然后提供前往 map 上固定点的路线。

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

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

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

是什么导致了这个问题？ (如果您希望将我的代码发布在这里而不是去拉 fiddle ，请告诉我)

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

Answer 1

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

function init_maps(){

    // google maps api goes here

}

var init = false;

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

    if(!init){

        init_maps();
        init = true;
    }

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

}