谷歌地图 api findplace 请求无法正常工作

Posted 2023-02-15

【中文标题】谷歌地图 api findplace 请求无法正常工作

【英文标题】：google maps api findplace request not working properly

【发布时间】：2021-10-27 16:04:32

【问题描述】：

我想在我的网页上显示来自已显示药房名称的 JSON 中的位置。关键是谷歌地图 API 有点超出我的知识能力。我向 google maps API 发出了查找位置请求，但显示的位置是我当前位置的位置。

这是您感兴趣的代码部分

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

  <script src="./keys.js"></script>
  <script>
    let map;
    document.addEventListener("DOMContentLoaded", () => 
      let s = document.createElement("script");
      document.head.appendChild(s);
      s.addEventListener("load", () => 
      
        console.log("script has loaded");

        x = navigator.geolocation;

        x.getCurrentPosition(success, failure)

        function success(position)

          var myLat = position.coords.latitude;
          var myLong = position.coords.longitude;

          var coords = new google.maps.LatLng(myLat,myLong);
      
          map = new google.maps.Map(document.getElementById("map"), 
              center: coords,
              zoom: 16,
              mapTypeId: google.maps.MapTypeId.ROADMAP
          );

          var marker = new google.maps.Marker(
              map: map,
              position: coords,
          )
        
        
        function failure()          
        
      );
      s.src = `https://maps.googleapis.com/maps/api/place/findplacefromtext/json?input=<%= "#@medicament['farmacies'].first['name']"%>&inputtype=textquery&fields=formatted_address,name,rating,opening_hours,geometry&key=**************`;
  
    );
  </script>
</div>

其中<%= "#@medicament['farmacies'].first['name']"%> 表示 html erb 文件中的药房名称。

我发现奇怪的是，如果我检查位置为 s.src 的页面，我会转到一个 JSON，其中包含所有正确的药房地址信息。

在这里您可以看到来自 API 的响应的图像：

我想要的是在谷歌地图上指出那家药店的地址。非常欢迎任何提示和技巧！

【参考方案1】：

请改用google.maps.places.PlacesService.findPlaceFromQuery。

另见tutorial。

  var service = new google.maps.places.PlacesService();
  var request = 
    query: 'Museum of Contemporary Art Australia',
    fields: ['name', 'geometry'],
  ;
  const results = service.findPlaceFromQuery(request);

【讨论】：

i.imgur.com/BQdAZQB.png 我在这里做错了什么吗？地图上没有显示任何内容

其实我真正想在应用中显示的是距离用户当前位置最近的名为“x”的药房