html5 百度 google地图定位关键字搜索附近

百度

<html>

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    <style type="text/css">
        body, html, #allmap {
            width: 100%;
            height: 100%;
            overflow: hidden;
            margin: 0;
            font-family: "微软雅黑";
        }
    </style>
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=3dc63ef9e201999b7acf03d4828e45f0"></script>
    <title>附近医院、药店</title>
</head>
<body>
    <div id="allmap"></div>
</body>
</html>
<script type="text/javascript">
    // 百度地图API功能




    var geolocation = new BMap.Geolocation();
    geolocation.getCurrentPosition(function (r) {
        if (this.getStatus() == BMAP_STATUS_SUCCESS) {
            var mk = new BMap.Marker(r.point);


            var map = new BMap.Map("allmap");
            var point = new BMap.Point(r.point.lng, r.point.lat);
            map.centerAndZoom(point, 14);




            map.addOverlay(mk);
            map.panTo(r.point);
 
           
            map.enableScrollWheelZoom();
            map.centerAndZoom(point, 15);


            var circle = new BMap.Circle(point, 1000, { fillColor: "blue", strokeWeight: 1, fillOpacity: 0.3, strokeOpacity: 0.3 });
            map.addOverlay(circle);
            var local = new BMap.LocalSearch(map, { renderOptions: { map: map, autoViewport: false } });
            local.searchNearby(['医院','药店'], point, 2000);
          
        }
        else {
            alert('failed' + this.getStatus());
        }
    }, { enableHighAccuracy: true })
    //关于状态码
    //BMAP_STATUS_SUCCESS 检索成功。对应数值“0”。
    //BMAP_STATUS_CITY_LIST 城市列表。对应数值“1”。
    //BMAP_STATUS_UNKNOWN_LOCATION 位置结果未知。对应数值“2”。
    //BMAP_STATUS_UNKNOWN_ROUTE 导航结果未知。对应数值“3”。
    //BMAP_STATUS_INVALID_KEY 非法密钥。对应数值“4”。
    //BMAP_STATUS_INVALID_REQUEST 非法请求。对应数值“5”。
    //BMAP_STATUS_PERMISSION_DENIED 没有权限。对应数值“6”。(自 1.1 新增)
    //BMAP_STATUS_SERVICE_UNAVAILABLE 服务不可用。对应数值“7”。(自 1.1 新增)
    //BMAP_STATUS_TIMEOUT 超时。对应数值“8”。(自 1.1 新增)
</script>
<!--<script type="text/javascript">
    // 百度地图API功能
    var map = new BMap.Map("allmap");            // 创建Map实例
    var mPoint = new BMap.Point(116.404, 39.915);
    map.enableScrollWheelZoom();
    map.centerAndZoom(mPoint, 15);


    var circle = new BMap.Circle(mPoint, 1000, { fillColor: "blue", strokeWeight: 1, fillOpacity: 0.3, strokeOpacity: 0.3 });
    map.addOverlay(circle);
    var local = new BMap.LocalSearch(map, { renderOptions: { map: map, autoViewport: false } });
    local.searchNearby('餐馆', mPoint, 1000);

</script>-->

google

<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title></title> 
 <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAoeA9wWpE6hOgXNdyGlIaz4iQiehoetaE&libraries=places"></script>
<script type="text/javascript"> 
function callback(results, status) {
        if (status === google.maps.places.PlacesServiceStatus.OK) {
          for (var i = 0; i < results.length; i++) {
            createMarker(results[i]);
          }
        }
 }
  function createMarker(place) {
        var placeLoc = place.geometry.location;
        var marker = new google.maps.Marker({
          map: map,
          position: place.geometry.location
        });


        google.maps.event.addListener(marker, 'click', function() {
          infowindow.setContent(place.name);
          infowindow.open(map, this);
        });
      }
  var map;
      var infowindow;




 
function init() { 
if (navigator.geolocation) { 
//获取当前地理位置 
navigator.geolocation.getCurrentPosition(function (position) { 
var coords = position.coords; 
//console.log(position); 
//指定一个google地图上的坐标点，同时指定该坐标点的横坐标和纵坐标 
var latlng = new google.maps.LatLng(coords.latitude, coords.longitude); 
var myOptions = { 
zoom: 14, //设定放大倍数 
center: latlng, //将地图中心点设定为指定的坐标点 
mapTypeId: google.maps.MapTypeId.ROADMAP //指定地图类型 
,showOnLoad : true
}; 
//创建地图，并在页面map中显示 
 map = new google.maps.Map(document.getElementById("map"), myOptions); 
infowindow = new google.maps.InfoWindow();




var service = new google.maps.places.PlacesService(map);
service.nearbySearch({
  location: latlng,
  radius: 2000,
  type: ['store']
},callback);


 
 
//打开提示窗口  
}, 
function (error) { 
//处理错误 
switch (error.code) { 
case 1: 
alert("位置服务被拒绝。"); 
break; 
case 2: 
alert("暂时获取不到位置信息。"); 
break; 
case 3: 
alert("获取信息超时。"); 
break; 
default: 
alert("未知错误。"); 
break; 
} 
}); 
} else { 
alert("你的浏览器不支持HTML5来获取地理位置信息。"); 
} 
} 
</script> 
</head> 
<body onload="init()"> 
<div id="map" style="width: 100%; height: 600px"></div> 
</body> 
</html>