JS地理定位功能不佳

Question

我已声明lat和long为变量，我试图将它们传递给另一个函数，但结果是空白的...我无法帮助但怀疑我在某处犯了错误在javascript中。我认为HTML很好，包括标签。他们已正确命名并且正确识别。

<p id="one"></p>

<button onclick="locate()">Push Me!!!</button>
<div id="mapholder"></div>
<script>
var x = document.getElementById("one");
function locate() {
    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(showPosition, showError);
    } else {
        x.innerHTML = "Your browser is stupid";
    }
}
function showPosition(position) {
    x.innerHTML = "Latitude: " + position.coords.latitude +
    "<br>Longitude: " + position.coords.longitude;
    var lat = position.coords.latitude;
    var long = position.coords.longitude;
    var mapOptions = {
        center: new google.maps.LatLng(position.coords.latitude, position.coords.longitude),
        zoom: 10,
        mapTypeId: google.maps.MapTypeId.HYBRID
    }
    var map = new google.maps.Map(document.getElementById("mapholder"), mapOptions);
    alert(map);
}
function myMap() {
    var mapOptions = {
        center: new google.maps.LatLng(lat, long),
        zoom: 10,
        mapTypeId: google.maps.MapTypeId.HYBRID
    }
var map = new google.maps.Map(document.getElementById("mapholder"), mapOptions);
} 

function showError(error){
    switch(error.code) {
        case error.PERMISSION_DENIED:
            x.innerHTML = "User denied the request for Geolocation."
            break;
        case error.POSITION_UNAVAILABLE:
            x.innerHTML = "Location information is unavailable."
            break;
        case error.TIMEOUT:
            x.innerHTML = "The request to get user location timed out."
            break;
        case error.UNKNOWN_ERROR:
            x.innerHTML = "An unknown error occurred."
            break;
    }
}
</script>