javascript - Google Map API 显示不正确

Question

我正在进行我的考试项目，试图让 Google Map API 显示我当前的位置。但它不起作用，只显示空白/灰色页面而不是地图。

我尝试在这里搜索，并找到了一些关于宽度和高度的回复，但似乎没有什么对我有用。

这是错误：

我只能在这个项目中使用 HTML、CSS 和 JavaScript 编写代码。

这是我的代码

<script src="https://maps.google.com/maps/api/js?key=MY KEY IS HERE AND WORKING"></script>

我的 HTML：

<div id="kort">
      <button type="button" onclick="visPosition();">Vis min bils position</button>
  </div>

我的 CSS：

    #kort {
  width: 100%;
  height: 755px;
}

我的 JS：

    function visPosition() {
    if(navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(visKort, visFejl);
    } else {
        alert("Din browser understøtter ikke dette element");
    }
}

// Definerer funktionen når den bliver kaldt succesfuldt.
function visKort(position) {
    // Får lokations dataen
    lat = position.coords.latitude;
    long = position.coords.longitude;
    let latlong = new google.maps.LatLng(lat, long);

    let mineIndstillinger = {
        center: latlong,
        zoom: 10,
        mapTypeControl: true,
        navigationControlOptions: {
            style:google.maps.NavigationControlStyle.SMALL
        }
    }

    let map = new google.maps.Map(document.getElementById("kort"), mineIndstillinger);
    let marker = new google.maps.Marker({ position:latlong, map:map, title:"Du er her" });
}

// Definerer fejlene der kan opstå når funktionen bliver kaldt.
function visFejl(error) {
    if(error.code == 1) {
        result.innerHTML = "Du vil ikke dele din position.";
    } else if(error.code == 2) {
        result.innerHTML = "Netværket er nede.";
    } else if(error.code == 3) {
        result.innerHTML = "Timed out.";
    } else {
        result.innerHTML = "Ukendt Fejl.";
    }
}

我对编码相当陌生。

标签： javascripthtmlcss