Google Maps API标记会按滚动和布局样式移动

Question

我是谷歌地图API的新手，我试图在谷歌地图上嵌入一个带有地址的标记，但我有错误。

https://developers.google.com/maps/documentation/javascript/adding-a-google-map#map

我正在使用此文档并且我已经复制了此代码，但它无法正常工作，因为当您滚动标记时，它不是固定在地图中，而是移动并且不会保留在正确的位置。

此外，左下角的按钮 MAP 和 SATELLITE 显示不正确，它们在整个地图中显示为背景线，而不是一起显示较小

最后，+和 - 按钮不会出现。

有人可以告诉我为什么会遇到这个问题？

这是我的代码：

<script>
function initMap() {
 var blitz8 = {lat: 45.806510, lng: 10.109520};
 var map = new google.maps.Map(document.getElementById("map"), {
  zoom: 18,
  center: blitz8
});
var marker = new google.maps.Marker({
 position: blitz8,
 map: map
 }); 

};
</script>

这里是Live Page：

https://sebalaini.github.io/Blitz8/

Answer 1

您好我通过在 base.scss 中禁用了一些css选项解决了这个问题，请检查并修复该问题，查看我上面的图片