2014-01-08 132 views
0

我想在我的网站上显示地图api。我已经有了地理定位功能,因此它位于我的位置。但我也想添加标记。我正在制作一个网站来定位您所在位置附近的咖啡店,所以我只想要在谷歌地图中搜索“咖啡店”时显示的所有标记,以便在onload时显示。我在Google Maps API网站上进行了搜索,但找不到要查找的内容。带标记的地理位置地图

在此先感谢!

这是我的代码:

<!DOCTYPE html> 
<html> 
    <head> 
    <title>Geolocation</title> 
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no"> 
    <meta charset="utf-8"> 
    <style> 
     html, body, { 
     height: 100%; 
     } 

     #map-canvas { 
     height: 400px; 
     width: 80%; 
     margin: 0px; 
     padding: 0px 
     } 
    </style> 
    <!-- 
    Include the maps javascript with sensor=true because this code is using a 
    sensor (a GPS locator) to determine the user's location. 
    See: https://developers.google.com/maps/documentation/javascript/tutorial#Loading_the_Maps_API 
    --> 
    <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAcITWIS3AIRREEJG7oC_BU7f8jVV9MbfE&sensor=false"></script> 


    <script> 
// Note: This example requires that you consent to location sharing when 
// prompted by your browser. If you see a blank space instead of the map, this 
// is probably because you have denied permission for location sharing. 

var map; 

function initialize() { 
    var mapOptions = { 
    zoom: 9 
    }; 
    map = new google.maps.Map(document.getElementById('map-canvas'), 
     mapOptions); 


    // Try HTML5 geolocation 
    if(navigator.geolocation) { 
    navigator.geolocation.getCurrentPosition(function(position) { 
     var pos = new google.maps.LatLng(position.coords.latitude, 
             position.coords.longitude); 

     var infowindow = new google.maps.InfoWindow({ 
     map: map, 
     position: pos, 
     content: 'Location found using HTML5.' 
     }); 

     map.setCenter(pos); 
    }, function() { 
     handleNoGeolocation(true); 
    }); 
    } else { 
    // Browser doesn't support Geolocation 
    handleNoGeolocation(false); 
    } 
} 


function handleNoGeolocation(errorFlag) { 
    if (errorFlag) { 
    var content = 'Error: The Geolocation service failed.'; 
    } else { 
    var content = 'Error: Your browser doesn\'t support geolocation.'; 
    } 

    var options = { 
    map: map, 
    position: new google.maps.LatLng(60, 105), 
    content: content 
    }; 

    var infowindow = new google.maps.InfoWindow(options); 
    map.setCenter(options.position); 
} 

google.maps.event.addDomListener(window, 'load', initialize); 

    </script> 
    </head> 
    <body> 
    <div id="map-canvas"></div> 
    </body> 
</html> 

回答

0

您将要使用JS的谷歌Places API的搜索附近的地方被调用返回到navigator.geolocation.getCurrentPosition纬度/经度位置()。

https://developers.google.com/maps/documentation/javascript/places#place_search_requests

的地方API支持通过预定义的场所类型搜索。他们没有专门有“咖啡厅”,但他们确实有“咖啡厅”:

https://developers.google.com/places/documentation/supported_types

+0

感谢您的答复。难以预先定义搜索查询吗?谢谢。 – Joep