2

我有一个关于 JavaScript 的 Google API Direction 的问题,我是第一次使用它。

我正在开发一个拼车网站。我想在使用 Google Autocomplete 从输入中获得的两个地方之间创建一个方向。我设法获得了我作为字符串传递的两个 LatLng 坐标,以放入原点和目标字段。但是,它会显示“由于 NOT_FOUND 导致路线请求失败”。

有人可以帮我吗?谢谢 :)

HTML 字段

<input type="text" name="departure" id="autocomplete_address" />
<input type="button" id="departure_check" value="Add this departure" />

<input type="text" name="arrival" id="autocomplete_address2" />
<input type="button" id="arrival_check" value="Add this destination" />

JavaScript:

let latorigine
let latdestination

function initMap () {
  const geocoder = new google.maps.Geocoder()
  const directionsService = new google.maps.DirectionsService()
  const directionsDisplay = new google.maps.DirectionsRenderer()

  const map = new google.maps.Map(document.getElementById('searchmap'), {
    center: { lat: 50.437616, lng: 2.809546 },
    zoom: 15,
  })

  directionsDisplay.setMap(map)

  // AUTOCOMPLETE
  const departure_input = (document.getElementById('autocomplete_address'))
  const arrival_input = (document.getElementById('autocomplete_address2'))
  const options = {
    types: [ 'address' ],
    componentRestrictions: { country: 'fr' },
  }
  const departure_autocomplete = new google.maps.places.Autocomplete(departure_input, options)
  const arrival_autocomplete = new google.maps.places.Autocomplete(arrival_input, options)

  document.getElementById('departure_check').addEventListener('click', function (latorigine) {
    const departure_place = departure_autocomplete.getPlace()
    latorigine = ` " ${departure_place.geometry.location.lat()}, ${departure_place.geometry.location.lng()} " `
    console.log(latorigine)
  })

  document.getElementById('arrival_check').addEventListener('click', function (latdestination) {
    const arrival_place = arrival_autocomplete.getPlace()
    latdestination = ` " ${arrival_place.geometry.location.lat()}, ${arrival_place.geometry.location.lng()} " `
    console.log(latdestination)
  })
}

// END INITMAP
function trajectdirection (directionsService, directionsDisplay, latorigine, latdestination) {
  directionsService.route(
    {
      origin: latorigine.toString(),
      destination: latdestination.toString(),
      travelMode: 'DRIVING',
    },
    function (response, status) {
      if (status === 'OK') {
        directionsDisplay.setDirections(response)
      }
      else {
        window.alert(`Directions request failed due to ${status}`)
      }
    }
  )
}
4

0 回答 0