相关疑难解决方法(0)

灰色框出现在模式框中的嵌入式Google Map的部分中

我在使用模式框中的v3 API嵌入Google Map时遇到问题.

显示模态时,灰色框出现在地图画布中.调整浏览器窗口大小,调出Web Inspector等会使所有地图图块都可见,即它"强制重新渲染"地图.

map元素的父元素(section#map-modal参见下面的代码)display: none在页面加载时设置了CSS.display: block单击show按钮时,JS模态代码会自动设置.如果我暂时display: none从模态元素中删除,则地图在页面刷新时正确呈现.谷歌地图喜欢隐藏的父元素吗?

我正在使用Twitter的Bootstrap模态jQuery插件,并使用CSS控制模态本身.它是固定的,有像素宽度等.没什么不寻常的.

我当然用谷歌搜索解决方案,许多人指出触发resize事件的Google API方法:

google.maps.event.trigger(map, 'resize');
Run Code Online (Sandbox Code Playgroud)

我确实这样做了,但无济于事.

相关代码:https://gist.github.com/1591488

如你所见,我在第39行触发事件.

(按侧边栏底部的查看大图按钮).

文件:

  • fagerhult.js
  • fagerhult.map.js
  • bootstrap-modal.js
  • master.css

我会非常感激任何帮助或额外的一双眼睛,因为我很快就会生气.

javascript google-maps modal-dialog google-maps-api-3

18
推荐指数
3
解决办法
2万
查看次数