1

不重复，因为：因为我专门使用“google-map-react”npm 包来处理 Google Maps API，所以我不认为这是一个重复的问题。这更多是关于“google-map-react”包的问题，​​而不是 Google Maps API。

问题：

GoogleMapReact 组件（来自“google-map-react”npm 包）由于某种原因错误地检测到点击事件的位置。具体来说，它的“onClick”事件对象具有不正确的 lat/lng 值。坐标总是移动到东南部（或右下角），误差幅度似乎与缩放级别有关......即。当缩小到远处时，纬度/经度的误差是数百公里，并随着地图的放大而减小。另一种看待它的方式是，坐标总是在屏幕上移动相同的 x 和 y 像素量。

关于潜在解决方案的注意事项：

我对这个包在后台访问的谷歌地图 API 了解不多，我更喜欢使用“google-map-react”包的解决方案，这样我就可以在基础谷歌地图上维护该抽象层API。

语境：

我正在使用“google-map-react”版本 2.1.3。

4

1 回答 1

0

我发现了问题：

我有一个全局样式表，它对所有“div”元素应用边距和填充。“google-map-react”包将谷歌地图包装在一堆 div 元素中，这些元素上的填充和边距以某种方式扰乱了位置/坐标检测。

我的解决方案： 在“GoogleMapReact”组件的最近父级上，我添加了一个特殊的类名（'remove-global-div-styling'...但名称显然不重要），然后使用以下 css 来整体保留我的应用程序样式，同时从“google-map-react”生成的 div 中删除样式：

.remove-global-div-styling div {
     margin: 0;
     padding: 0;
     ...etc (based on whatever unwanted styling is being applied to those divs)
}

一般解决方案： 如果使用“google-map-react”包并遇到类似我的问题，请使用 devtools 检查“google-map-react”生成的 div，看看是否有任何意外的样式应用于它们在您的应用程序的其他地方。

于 2021-10-03T00:06:43.940 回答