使用Google Maps JS API在我的网页上使用用户位置来计算路线的按钮？

<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&libraries=places"></script>

<button onclick="calculateRoute()">计算路线</button>

function calculateRoute() {
  // 获取用户位置
  if (navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(function(position) {
      var userLocation = {
        lat: position.coords.latitude,
        lng: position.coords.longitude
      };

      // 创建地图
      var map = new google.maps.Map(document.getElementById('map'), {
        center: userLocation,
        zoom: 14
      });

      // 创建起点标记
      var startMarker = new google.maps.Marker({
        position: userLocation,
        map: map,
        title: '起点'
      });

      // 创建终点标记
      var endLocation = { lat: 37.7749, lng: -122.4194 }; // 替换为你的终点位置
      var endMarker = new google.maps.Marker({
        position: endLocation,
        map: map,
        title: '终点'
      });

      // 创建路线
      var directionsService = new google.maps.DirectionsService();
      var directionsRenderer = new google.maps.DirectionsRenderer();
      directionsRenderer.setMap(map);

      var request = {
        origin: userLocation,
        destination: endLocation,
        travelMode: 'DRIVING'
      };

      directionsService.route(request, function(result, status) {
        if (status == 'OK') {
          directionsRenderer.setDirections(result);
        }
      });
    });
  } else {
    alert('浏览器不支持地理定位');
  }
}

<div id="map"></div>