javascript - 谷歌地图api v3空白页,添加api没有解决

标签 javascript wordpress google-maps google-maps-api-3 api-key

我有一个 WordPress 主题。它有一张标有位置的 map 。它工作得很好,但今天 map 突然显示了太多请求的错误。经过一番研究后,我添加了一个 api 浏览器 key ,以避免超出请求限制。但在我添加浏览器 key 后,我的 map 仍然是空白的。我之前收到的错误消息已解决,但 map 仍然没有显示。

这是显示空白 map 的页面链接:http://goodgoal.org/review-category/eating-and-drinking/

这些是我的开发者控制台上启用的 API: enter image description here

编辑:一个大问题是性能,我正在努力解决这个问题。但问题仍然存在。在 safari 和 firefox 中, map 显示正确,在 chrome 中, map 仍然是空白。我尝试了 css 解决方案,但这对我不起作用。

最佳答案

我刚刚发现你的 map 上存在 CSS 问题。所有图像上的 max-width: 100% 属性会破坏构成 map 的图像的宽度(然后是高度)计算。

如果您尝试添加以下规则:

.job_listings-map-wrapper #job_listings-map-canvas img {
  max-width: none;
}

map 将正确显示。这是 map 仅显示标记但后面没有 map 的情况。

对于其他不一致的负载问题,问题更多地与服务器相关。正如我所说,页面大小太大,我猜服务器(可能是共享主机?)的大小不适合这个。也许您可以尝试增加 max_execution_timememory_limit 设置,看看是否有帮助。

关于javascript - 谷歌地图api v3空白页,添加api没有解决,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34017352/

相关文章:

javascript - float 元素和使用 jQuery

javascript - 在 addClass 中使用时 addEventListener 不起作用

javascript - 如何设置数据源的宽度和高度?

javascript - ref.once() 没有被调用

html - CSS 仅适用于网站的第一列

android - 数据可用后将标记添加到 Google map ?

android - 如何在 android 中打开 kml 文件

javascript - 未捕获的类型错误 : Cannot call method 'getElementsByTagName' of null

php - 如何在 WooCommerce 中编辑结账字段

javascript - 通过 HTML 表单查询和更新融合表?