Skip to content

Instantly share code, notes, and snippets.

@hhkaos
Created February 26, 2021 05:58
Show Gist options
  • Save hhkaos/73f8f13782fc24b34225b969451a3e98 to your computer and use it in GitHub Desktop.
Save hhkaos/73f8f13782fc24b34225b969451a3e98 to your computer and use it in GitHub Desktop.
<html>
<head>
<style>#mapDiv,body,html{width:100%; height:400px;margin:0;padding:0}</style>
</head>
<body>
<h1>Search places in Google Maps</h1>
<div id="mapDiv"></div>
<script>
function initMap() {
const searchCenter = {lat: 40.0150, lng: -105.2705};
const map = new google.maps.Map(document.getElementById("mapDiv"), {
zoom: 15,
center: searchCenter
});
const service = new google.maps.places.PlacesService(map);
service.nearbySearch({
location: searchCenter,
radius: 500,
type: ["restaurant"]
}, function callback(results, status) {
if (status == google.maps.places.PlacesServiceStatus.OK) {
for (var i = 0; i < results.length; i++) {
const {geometry, name } = results[i];
new google.maps.Marker({
position: geometry.location,
title: name,
map: map
});
}
}
});
}
</script>
<script async defer src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&libraries=places&callback=initMap"></script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment