帶標記的地理位置地圖

我想在我的網站上顯示地圖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>

來源

2014-01-08 Joep