当地图全屏时，如何强制 Sweet Alert 2 在 Google 地图上触发？

Question

我有一个使用 Google 地图的应用程序。我正在使用 Sweet Alert 2 进行 js 确认。只要 Google 地图不处于全屏模式，我就不会遇到触发 Sweet Alert 对话框的问题。但是，当 Google 地图处于全屏模式时，该对话框会触发，但在我退出全屏模式之前不可见。

我在引导模式中遇到了类似的问题，我通过在模式容器上设置 z-index 解决了这个问题。我以为我可以用 Sweet Alert 2 做同样的事情，但它不起作用。

下面是用于触发 swal 的 js：

Swal.fire({
    title: 'Are you sure you want to delete this point?',
    text: "You won't be able to revert this!",
    type: 'warning',
    showCancelButton: true,
    confirmButtonColor: '#3085d6',
    cancelButtonColor: '#d33',
    confirmButtonText: 'Yes, delete it!',
    customClass: {
        container: 'my-swal'
    }
}).then((result) => {
    ...
});

这是CSS：

.my-swal {
    z-index: 2147483600;
}

除了上面的代码之外，我还尝试仅将 z-index 应用到默认的 Sweet Alert 2 容器类“swal2-container”，而不指定着火的 customClass。这也不起作用。

有趣的是，对于这两个示例，当我检查页面时，它显示容器的 z-index 设置为我指定的值，但警报仍然不可见。同样，同样的解决方案应用于页面上的 Bootstrap Modal 容器并且工作正常。

如有任何建议，我们将不胜感激:)

Answer 1

我也遇到过这个T^T。 我已经使用map.controls[google.maps.ControlPosition.TOP_CENTER].push(centerControlDiv); 在谷歌地图中添加DIV 但警报、弹出窗口、甜蜜警报无法添加到谷歌地图 我有技巧让 div 模态 boostrap 做类似警报并添加到 googlemap 中 （https://developers.google.com/maps/documentation/javascript/controls） （https://developers.google.com/maps/documentation/javascript/examples/control-positioning） ( https://developers.google.com/maps/documentation/javascript/controls )

今天我发现这似乎是构建 DIV 并让 Sweetalert 定位到 DIV 如果我们可以构建 DIV 并将 DIV 添加到地图 并将 Sweet 目标定位为 DIV
也许这是工作，但现在我仍然没有尝试这个。 ( div 内的 SweetAlert2 )