160
rated 0 times
[
162]
[
2]
/ answers: 1 / hits: 75233
/ 9 Years ago, sat, april 25, 2015, 12:00:00
I am trying to search places using search box in google map api .I am using Google Map Javascript api v3 .When I try to search some place it is not happning .Can anyone help me what could be the issue.Here is the html and javascript code snippet.
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta
name="viewport"
content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"
/>
<meta name="description" content="" />
<meta name="author" content="" />
<link href="css/bootstrap.min.css" rel="stylesheet" />
<link href="css/bootstrap.css" rel="stylesheet" />
<script src="js/jquery.min.js"></script>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&libraries=places"></script>
</head>
<body>
<div class="col-md-8">
<input
id="pac-input"
class="controls"
type="text"
placeholder="Search Box"
/>
<div class="container" id="map-canvas"></div>
</div>
<script>
var map = new google.maps.Map(document.getElementById("map-canvas"), {
center: {
lat: 12.9715987,
lng: 77.59456269999998,
},
zoom: 12,
});
var marker = new google.maps.Marker({
position: {
lat: 12.9715987,
lng: 77.59456269999998,
},
map: map,
draggable: true,
});
var searchBox = new google.maps.places.SearchBox(
document.getElementById("pac-input")
);
google.maps.event.addListener(searchBox, "place_changed", function () {
var places = searchBox.getPlaces();
var bounds = new google.maps.LatLngBounds();
var i, place;
for (i = 0; (palce = places[i]); i++) {
bounds.extend(place.geometry.location);
marker.setPosition(place.geometry.location);
}
map.fitBounds(bounds);
map.setZoom(12);
});
</script>
<script src="js/jquery.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="js/bootstrap.min.js"></script>
<script src="js/Test.js"></script>
</body>
</html>
More From » google-maps