街景控件在 Chrome 中不可见答案

【问题标题】：StreetView controls not visible in Chrome街景控件在 Chrome 中不可见
【发布时间】：2012-09-25 08:09:01
【问题描述】：

我正在尝试弄清楚为什么以编程方式打开 StreetView 时，StreetView 控件不会出现在 Chrome 浏览器中，但在使用街景小人显示 StreetView 时它们会出现...

这是地图： http://beta.findtoilet.dk/?term=2&lat=55.678937&lng=12.575738&zoom=15&maptype=roadmap

拖动街景小人以显示街景，它可以完美运行。您可以看到右上角的关闭按钮、缩放和指南针控件以及左下角和右下角的 Google 链接。

现在通过单击标记或侧边栏项目打开信息窗口。信息窗口包含一个用于打开该标记的 StreetView 的链接 - 单击该链接。 StreetView 显示，但没有任何控件可见，底部的两个 Google 链接也不可见。然而，如果您将鼠标悬停在将显示控件的位置，则鼠标单击就像控件可见一样起作用。如果您将鼠标悬停在右上角直到它变成指向手并单击缩放控件所在的位置，则街景将放大或缩小，并且在缩放时您可以看到所有不可见的控件。

在 Firefox 和 IE9 上一切正常。我在 64 位 Windows 7 电脑上使用所有浏览器的最新版本，另一个人在 32 位 Windows XP 上报告了同样的问题。

我尝试使用 Chrome 开发者工具，但没有发现任何会导致控件不可见的情况。

这在 Chrome 中运行良好，所以我不确定问题是否与 Chrome 更新或 Google Maps API 的更改有关 - 最近没有对地图 JavaScript 进行任何更改。

谁能提出什么问题？

谢谢。

马丁。

【问题讨论】：

这对我有用（chrome 22.0.1229.79 在 win XP pro 上运行）- 不错的应用 ;-)

标签： google-maps google-maps-api-3 google-street-view

【解决方案1】：

问题似乎出在您应用于#toiletMap div[style] 的-webkit-transform:scale(1) 上。

删除它，它解决了问题..

或者，您可以添加translateZ(0) 来解决问题。

-webkit-transform:scale(1) translateZ(0);

更新

一定和

有关

【讨论】：

这绝对是个问题。不幸的是，这是一种由 Google Maps API 应用的样式，因此不容易修复。我添加到网页样式中以尝试修复它的任何内容都会被 Google Maps API 样式覆盖...
通常像html body #toiletMap div[style]{-webkit-transform:scale(1) translateZ(0);}这样的规则应该覆盖谷歌地图中的规则..（因为它具有更高的特异性）
很好，它已修复：html body #toiletMap div[style]{ -webkit-transform:scale(1) translateZ(0) !important;需要 !important 添加，因为 Google 的 stye 也使用了 !important - 没有这个我的固定样式没有应用。非常感谢。
我的回复太快了，很快检查显示地图现在无法拖动或缩放。我认为我必须在 Google Maps API 问题页面上提出一个问题。