Cannot understand difference between Google Map and Google Places API.
Just implemented simple google map code
<html>
<head>
<script src=""></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.
- 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.
- How to get restaurant names in a list, finds within the selected city.
- Search by food names.
Ultimately what the correct codes needed to implement the above required features?Please provide the codes.
Cannot understand difference between Google Map and Google Places API.
Just implemented simple google map code
<html>
<head>
<script src="http://maps.googleapis./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.
- 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.
- How to get restaurant names in a list, finds within the selected city.
- Search by food names.
Ultimately what the correct codes needed to implement the above required features?Please provide the codes.
Share Improve this question asked Mar 26, 2015 at 11:41 sphakrrokr Subhrojitsphakrrokr Subhrojit 372 gold badges3 silver badges15 bronze badges2 Answers
Reset to default 3You 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./maps/documentation/geocoding/
The docs have a wealth of information there, but the tl;dr is: Call the API like this:
https://maps.googleapis./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./maps/documentation/javascript/places#TextSearchRequests
You should use Google's places api : https://developers.google./places/
Try out playing with the code in documentation to start: https://developers.google./places/webservice/search#PlaceSearchRequests
发布者：admin，转转请注明出处：http://www.yc00.com/questions/1744299358a4567421.html
评论列表（0条）