<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
html { height: 100% }
body { height: 100%; margin: 0; padding: 0 }
#map-canvas { height: 100% }
</style>
//加载google的类库
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?libraries=places&sensor=true"></script>
</head>
<body>
<div id="map">
</div>
</body>
</html>
<script type="text/javascript">
var map;
var service;
var infowindow;
//初始化方法
function initialize() {
//香港的经度纬度
var hongkong = new google.maps.LatLng(22.18,114.10);
map = new google.maps.Map(document.getElementById('map'), {
mapTypeId: google.maps.MapTypeId.ROADMAP,
center: hongkong,
zoom: 15
});
var request = {
location: hongkong,
radius: '500000', //以经纬度为中心点的圆的范围
query: '香港旺角丽悦酒店' //查询的字符串
};
service = new google.maps.places.PlacesService(map);
service.textSearch(request, callback);
}
//回调函数
function callback(results, status) {
if (status == google.maps.places.PlacesServiceStatus.OK) {
for (var i = 0; i < results.length; i++) {
//这里遍历结果
var place = results[i];
console.log(place);
//createMarker(results[i]);
}
}
}
google.maps.event.addDomListener(window, 'load', initialize);
//return;
</script>