为什么这个纬度/经度坐标在 Google Maps API 中找不到最近的道路 [关闭]答案

【问题标题】：Why doesn't this lat/lon coordinate find nearest road in Google Maps API [closed]为什么这个纬度/经度坐标在 Google Maps API 中找不到最近的道路 [关闭]
【发布时间】：2021-02-18 20:25:35
【问题描述】：

问题

我正在使用 Google Maps API Nearest Road 来查找给定纬度/经度坐标的最近道路。我遇到了一个不返回任何东西的纬度/经度坐标，我不知道为什么。这个纬度/经度坐标的位置就在北卡罗来纳州的一条道路旁边。

https://roads.googleapis.com/v1/nearestRoads?points=35.77747,-82.4603&key=`{GOOGLE_API_KEY}`

为什么会返回{}？

谷歌地图位置

【问题讨论】：

谁知道呢。 SO 社区无法处理数据问题。
@MrUpsidown 这个问题也可以由 Google 支持部门提出。 developers.google.com/maps/documentation/directions/…

标签： google-maps google-api

【解决方案1】：

我的猜测是你的观点离道路太远了。

您可能想要使用DirectionsService（Web 服务），将origin 和destination 设置为您的输入点。

这似乎对寻找最近的道路有更大的容忍度（尽管仍然有限）。

https://maps.googleapis.com/maps/api/directions/json?origin=35.77747,-82.4603&destination=35.77747,-82.4603&key=`{GOOGLE_API_KEY}`

// snip
   "end_location" : {
      "lat" : 35.777998,
      "lng" : -82.4598565
   },
// snip
   "start_location" : {
      "lat" : 35.777998,
      "lng" : -82.4598565
   },
// snip

相关问题：

proof of concept fiddle

代码 sn-p：

const point = {
  lat: 35.77747,
  lng: -82.4603
}

function initMap() {
  const directionsService = new google.maps.DirectionsService();
  const directionsRenderer = new google.maps.DirectionsRenderer({
    preserveViewport: true
  });
  const map = new google.maps.Map(document.getElementById("map"), {
    zoom: 18,
    center: point,
  });
  const marker = new google.maps.Marker({
    map: map,
    position: point,
    title: "input point"
  })
  directionsRenderer.setMap(map);

  calculateAndDisplayRoute(directionsService, directionsRenderer);
}

function calculateAndDisplayRoute(directionsService, directionsRenderer) {
  directionsService.route({
      origin: point,
      destination: point,
      travelMode: google.maps.TravelMode.DRIVING,
    },
    (response, status) => {
      if (status === "OK") {
        directionsRenderer.setDirections(response);
      } else {
        window.alert("Directions request failed due to " + status);
      }
    }
  );
}

/* Always set the map height explicitly to define the size of the div
       * element that contains the map. */

#map {
  height: 100%;
}


/* Optional: Makes the sample page fill the window. */

html,
body {
  height: 100%;
  margin: 0;
  padding: 0;
}

<!DOCTYPE html>
<html>

<head>
  <title>Directions Service</title>
  <script src="https://polyfill.io/v3/polyfill.min.js?features=default"></script>
  <!-- jsFiddle will insert css and js -->
</head>

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

  <!-- Async script executes immediately and must be after any DOM elements used in callback. -->
  <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCkUOdZ5y7hMm0yrcCQoCvLwzdM6M8s5qk&callback=initMap&libraries=&v=weekly" async></script>
</body>

</html>

【讨论】：