Javascript 如何使用站点访问者'；s当前位置坐标作为在我的网站上显示谷歌方向图的起点？

我试图在我的网站上显示谷歌方向图。假设我在管理端保存了一些地址/坐标作为目标地址/坐标。让我们假设用户试图从前端访问网站。我已经通过JavaScript选择了用户的当前位置坐标，现在我必须使用这个坐标（我通过JavaScript访问的）作为路线图的起点，坐标（我保存在管理端）作为路线图的终点

如何将用户的当前位置坐标（通过JavaScript访问）作为地图的起点坐标

如果无法通过JavaScript实现，请告诉我其他方法

下面是我用来显示GoogleMap的JavaScript代码

    <script>
function initMap() {
    var directionsDisplay = new google.maps.DirectionsRenderer;
    var directionsService = new google.maps.DirectionsService;
    var map = new google.maps.Map(document.getElementById('map'), {
      zoom: 14,
      center: {lat: 26.8653676, lng: 80.9440718}
    });
    directionsDisplay.setMap(map);
calculateAndDisplayRoute(directionsService, directionsDisplay);
document.getElementById('mode').addEventListener('change', function() {
  calculateAndDisplayRoute(directionsService, directionsDisplay);
});
 } 
var final_latitude=0;var final_longitude=0;

 if (navigator.geolocation) {
                navigator.geolocation.getCurrentPosition(showPosition, showError,{maximumAge:0});
            } else { 
                alert("Geolocation is not supported by this browser.";);
            }
            function showPosition(position) {
                var lati=position.coords.latitude;
                final_latitude=lati;
                var longi=position.coords.longitude;
                final_longitude=longi;
                calculateAndDisplayRoute();
            }
            function showError(error) {
                switch(error.code) {
                    case error.PERMISSION_DENIED:
                        alert("User denied the request for Geolocation.");
                        break;
                    case error.POSITION_UNAVAILABLE:
                        alert("Location information is unavailable.");
                        break;
                    case error.TIMEOUT:
                        alert("The request to get user location timed out.");
                        break;
                    case error.UNKNOWN_ERROR:
                        alert("An unknown error occurred.");
                        break;
                }
            }   
  function calculateAndDisplayRoute(directionsService, directionsDisplay) {
    var selectedMode = document.getElementById('mode').value;
    var start = {lat: final_latitude, lng: final_longitude};  //This is not working
    var end = new google.maps.LatLng(26.8466937, 80.946166);
    directionsService.route({
      //origin: {lat: 37.77, lng: -122.447},  // Haight.
      //destination: {lat: 37.768, lng: -122.511},  // Ocean Beach.
      origin: start,
      destination: end,
      travelMode: google.maps.TravelMode[selectedMode]
    }, function(response, status) {
      if (status == 'OK') {
        directionsDisplay.setDirections(response);
      } else {
        window.alert('Directions request failed due to ' + status);
      }
    });
  }
</script>
<script async defer
    src="https://maps.googleapis.com/maps/api/js?key=my_API_Key&callback=initMap">
    </script>

函数initMap（）{
var directionsDisplay=新建google.maps.DirectionsRenderer；
var directionsService=新的google.maps.directionsService；
var map=new google.maps.map（document.getElementById（'map'）{
缩放：14，
中心：{lat:26.8653676，lng:80.9440718}
});
方向显示.setMap（地图）；
计算显示路线（方向服务、方向显示）；
document.getElementById（'mode'）。addEventListener（'change'，function（）{
计算显示路线（方向服务、方向显示）；
});
} 
var最终纬度=0；var final_经度=0；
if（导航器.地理位置）{
navigator.geolocation.getCurrentPosition（showPosition，showError，{maximumAge:0}）；
}否则{
警报（“此浏览器不支持地理位置。”；）；
}
功能显示位置（位置）{
var lati=位置坐标纬度；
最终纬度=纬度；
var longi=位置坐标经度；
最终经度=经度；
calculateAndDisplayRoute（）；
}
功能错误（错误）{
开关（错误代码）{
案例错误。权限被拒绝：
警报（“用户拒绝了地理定位请求”）；
打破
案例错误。位置不可用：
警报（“位置信息不可用”）；
打破
大小写错误。超时：
警报（“获取用户位置的请求超时”）；
打破
案例错误。未知错误：
警报（“发生未知错误”）；
打破
}
}   
函数calculateAndDisplayRoute（方向服务、方向显示）{
var selectedMode=document.getElementById（'mode'）。值；
var start={lat:final_纬度，lng:final_经度}；//这不起作用
var end=new google.maps.LatLng（26.8466937,80.946166）；
方向服务.路线({
//产地：{lat:37.77，lng:-122.447}，//Haight。
//目的地：{纬度：37.768，液化天然气：-122.511}，//海洋海滩。
来源：start，
目的地:完，
travelMode:google.maps.travelMode[selectedMode]
}，功能（响应、状态）{
如果（状态=‘正常’）{
方向显示。设置方向（响应）；
}否则{
window.alert（'由于'+状态，指示请求失败）；
}
});
}

---

在上面的代码中，我需要在

var start={lat:final_lation，lng:final_lation}中传递访问者的当前位置坐标但它不起作用。
您可能在设置开始纬度/很久之前就试图利用它

showPosition中的函数定义与下面的函数不匹配，您应该这样做。这不一定是个问题，但它会使代码更成问题

第18行的代码有一个有问题的分号

试试这个：

function initMap() {
var directionsDisplay = new google.maps.DirectionsRenderer;
var directionsService = new google.maps.DirectionsService;
var map = new google.maps.Map(document.getElementById('map'), {
    zoom: 14,
    center: {
        lat: 26.8653676,
        lng: 80.9440718
    }
});
directionsDisplay.setMap(map);
calculateAndDisplayRoute(directionsService, directionsDisplay);
document.getElementById('mode').addEventListener('change', function() 

{
        calculateAndDisplayRoute(directionsService, directionsDisplay);
    });
}
var final_latitude = 0;
var final_longitude = 0;
if (navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(showPosition, showError, {
        maximumAge: 0
    });
} else {
    alert("Geolocation is not supported by this browser.");
}
function showPosition(position) {
    var lati = position.coords.latitude;
    final_latitude = lati;
    var longi = position.coords.longitude;
    final_longitude = longi;
    calculateAndDisplayRoute();
}
function showError(error) {
    switch (error.code) {
        case error.PERMISSION_DENIED:
            alert("User denied the request for Geolocation.");
            break;
        case error.POSITION_UNAVAILABLE:
            alert("Location information is unavailable.");
            break;
        case error.TIMEOUT:
            alert("The request to get user location timed out.");
            break;
        case error.UNKNOWN_ERROR:
            alert("An unknown error occurred.");
            break;
    }
}
function calculateAndDisplayRoute(directionsService, directionsDisplay) {
    var selectedMode = document.getElementById('mode').value;
    var start = new google.maps.LatLng(final_latitude, final_longitude);
    var end = new google.maps.LatLng(26.8466937, 80.946166);
    directionsService.route({
        //origin: {lat: 37.77, lng: -122.447},  // Haight.
        //destination: {lat: 37.768, lng: -122.511},  // Ocean Beach.
        origin: start,
        destination: end,
        travelMode: google.maps.TravelMode[selectedMode]
    }, function(response, status) {
        if (status == 'OK') {
            directionsDisplay.setDirections(response);
        } else {
            window.alert('Directions request failed due to ' + status);
        }
    });
}

此外，根据我的经验，浏览器位置可能需要一段时间（8秒以上）。您等待回调运行的时间是否足够长？尝试在chrome中添加断点，并查看它何时执行。
您是否已向start lat、lng发出警报？它是否提供了一些价值？你传递变量的方法是什么？请阅读-总结是，这不是一种解决志愿者问题的理想方法，可能会对获得答案产生反作用。请不要将此添加到您的问题中。嗨，JonLuca，非常感谢您提供的解决方案，我尝试了您的代码，但它不起作用，因此我对您的代码进行了一些更改，并获得了解决方案。在第33行中，而不是
calculateAndDisplayRoute（）我已经使用了所有的
initMap（）
代码，它工作正常。