javascript - 使用 navigator.geolocation 使用用户的位置名称填充 Google 搜索框

Question

现在，我有一个事件监听器，因此用户可以输入他们的位置并获取他们的坐标。对于选择器，我的函数如下所示：

searchBox.addListener('places_changed', () => {
  const place = searchBox.getPlaces()[0]
  if (place == null) return
  const latitude = place.geometry.location.lat()
  const longitude = place.geometry.location.lng()
  /* MY WEATHER FETCH FUNCTION HERE */
 }).then(res => res.json()).then(data => {     
  setWeatherData(data, place.formatted_address)
 })
})

然后将天气数据以及来自谷歌地图的格式化地址传递下来。但是 div 设置了用户输入的当前位置。

function setWeatherData(data,place){
  locationElement.textContent = place
  statusElement.textContent = titleCase(data.weather[0].description)
}
  

这段代码中真正重要的是locationElement.textContent = place part. 它将 locationElement 设置为他们使用 formatted_address 键入的地址的“地点”。

navigator.geolocation.getCurrentPosition()但是，如果他们授予位置权限，我希望能够使用 获取他们当前的位置。如果他们确实授予它，它将使用从地理定位 javascript API 接收到的经度和经度将 locationElement 设置为它抓取的任何位置。

理想情况下，我想运行一个函数：

如果用户授予位置权限，则使用他们的坐标自动完成搜索框，然后这将触发事件侦听器。

现在我正在使用

navigator.geolocation.getCurrentPosition(grabLocation, onError, options);

GrabLocation 函数目前看起来像

 function grabLocation(pos) {
    var crd = pos.coords;
    /* My WEATHER FETCH FUNCTION HERE */
    
      }).then(res => res.json()).then(data => {     
        setWeatherData(data,place)
      })
  }
  

但是，不幸的是，我不确定如何使用 searchBox.getPlaces()[0] 传递“位置”，就像我在事件侦听器中所做的那样，因为地理定位 javascript API 只能获取绳索。

我怎样才能做到这一点？

标签： javascriptgoogle-mapsnavigatorgoogle-geolocation