2014-01-08 2 views
0

Я хочу, чтобы карты api на моем сайте. У меня уже работала геолокация, поэтому она сосредоточена на моем местоположении. Но я также хочу добавить маркеры. Я делаю сайт, чтобы найти кофешопы рядом с вашим местоположением, поэтому я просто хочу, чтобы все маркеры отображались, когда я просматриваю «Coffeeshop» на картах 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

Вы хотите использовать API Google Адресов для JS для поиска мест рядом с позиции широта/долгота, возвращаемый вызовом 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

Смежные вопросы