谷歌地图 JS API 显示蓝色焦点边框答案

【问题标题】：Google maps JS API shows blue focus border谷歌地图 JS API 显示蓝色焦点边框
【发布时间】：2021-06-14 13:26:30
【问题描述】：

Google Maps JS API 在切换到另一个浏览器选项卡后开始在地图周围显示蓝色焦点边框，然后返回。一旦点击地图，边界就会消失。
带有边框的元素是由 Gmaps 和它们的 DOM 生成的。边框似乎只在整页地图显示中显示。

跟踪 Gmap DOM 在 gm-style 的子级显示边框：(div.gm-style > div)

<div style="pointer-events: none; width: 100%; height: 100%;
           box-sizing: border-box; position: absolute; z-index: 1000002;
           opacity: 0; border: 2px solid rgb(26, 115, 232);"></div>

opacity: 0 是动态的，点击到另一个浏览器选项卡后变为 opacity: 1。
为什么像这样的 Gmaps JS API 有效？知道如何从视点中清楚地移除这个正方形吗？

编辑：

蓝色方块在 Chrome 89 && Mozilla 86 中显示
步骤：打开 js fiddle 链接 -> 聚焦地图（轻松左右滚动地图）-> 更改浏览器选项卡 -> 返回带有 jsfiddle 示例的选项卡 -> 蓝色方块 JSFiddle example

作为错误打开的问题： Google Issuetracker

【问题讨论】：

似乎从 Maps JavaScript API 3.43 版显示这个正方形
您需要提供一个minimal reproducible example 以允许重现该问题。你使用的是什么浏览器？如果我在 Chrome 中查看 simple map example，则不会发生这种情况。
jsfiddle.net/gjL1wrxd
您应该在他们的issue tracker 中打开一个新错误。这似乎只发生在v=3.44 和v=3.43 上。版本 3.42 不会这样。请在您的错误报告中交叉链接您的问题和您问题中的错误报告打开后。

标签： javascript css google-maps google-maps-api-3

【解决方案1】：

我遇到了同样的问题，CSS 工作正常：

.gm-style iframe + div { border:none!important; }

【讨论】：

【解决方案2】：

问题已作为谷歌地图错误关闭。错误将在下一个 GMApi 版本中修复。 Issuetracker Google

【讨论】：