Question

无法理解Google Map和Google Places API之间的区别。

刚刚实施了简单的谷歌地图代码

 <html>
    <head>
    <script src="http://maps.googleapis.com/maps/api/js"></script>
    <script>
    function initialize() {
      var mapProp = {
        center:new google.maps.LatLng(25.0000, 66.0000),
        zoom:4,
        mapTypeId:google.maps.MapTypeId.ROADMAP
      };
      var map=new google.maps.Map(document.getElementById("googleMap"),mapProp);
    }
    google.maps.event.addDomListener(window, 'load', initialize);
    </script>
    </head>

    <body>
    <select name="home_city_select" id="home_city_select" data-icon="carat-d" style="width:auto;" onchange="getCity()">
<option>
    ....
</option>
</select>

    <div data-role="content" style="padding: 0px" dir="ltr">

        <div id="googleMap" style="width:100%;height:215px;"></div>

    </div>

    </body>

JS

//City--tested by multiple code ways
function getCity() {
    var x = document.getElementById("home_city_select").value;
    var xx=$("#home_city_select").val();
    //alert(xx);
}

$(function() {
    $("#home_city_select").change(function() {
        alert( $('option:selected', this).text() );
    });
});

这里我必须手动给出纬度经度。但这不是正确的方法。没有人知道每个城市的纬度和经度。

但是如何编写javascript以便在选择城市名称时如 “孟买”从地图下拉变化并在地图上显示餐馆符号。
如何在列表中找到餐馆名称，在...中找到选定的城市。
按食物名称搜索。

最终实现上述所需功能所需的正确代码是什么？请提供代码。

Answer 1

您应该使用Google的地方api：https://developers.google.com/places/

尝试使用文档中的代码开始： https://developers.google.com/places/webservice/search#PlaceSearchRequests

Answer 2

你不能只使用maps api完成所有这些操作。您需要使用地理编码API来拉动您所在城市的长途：

https://developers.google.com/maps/documentation/geocoding/

文档中有大量信息，但是tl; dr是：像这样调用API： https://maps.googleapis.com/maps/api/geocode/json?address=Toledo&key=API_KEY 然后你会得到一些带有“边界”键的JSON。获取您的boundbox，并将其传递给places API：

https://developers.google.com/maps/documentation/javascript/places#TextSearchRequests

如何通过输入城市/城镇名称从谷歌地图获取餐厅列表？

2 个答案: