CODEWITHSUNDEEP
javascripthtmlgoogle-maps
sphakrrokr Subhrojit
sphakrrokr Subhrojit

Reputation: 37

How to get restaurant list from google map by just entering city/town name?

Cannot understand difference between Google Map and Google Places API.

Just implemented simple google map code

 <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() );
    });
});

Here I have to give latitude longitude manually.But this not the correct method.And no one knows latitude and longitude of every cities.

  1. But how to write the javascript so that while selecting city name such as "Mumbai" from drop down the map changes and shows restaurant symbols on the map.
  2. How to get restaurant names in a list, finds within the selected city.
  3. Search by food names.

Ultimately what the correct codes needed to implement the above required features?Please provide the codes.

Upvotes: 0

Views: 12008

Answers (2)

wholevinski
wholevinski

Reputation: 3828

You can't do all of this with just the maps api. You'll need the geocoding API to pull the lat long of your city:

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

The docs have a wealth of information there, but the tl;dr is: Call the API like this: https://maps.googleapis.com/maps/api/geocode/json?address=Toledo&key=API_KEY and you'll get some JSON back that has a "bounds" key. Take your boundbox, and pass it to the places API:

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

Upvotes: 3

Mahendra Singh Meena
Mahendra Singh Meena

Reputation: 608

You should use Google's places api : https://developers.google.com/places/

Try out playing with the code in documentation to start: https://developers.google.com/places/webservice/search#PlaceSearchRequests

Upvotes: 1

Related Questions