Ich versuche, eine Restaurant-Locator-App zu machen und kann die Marker nicht erscheinen

Ich versuche Marker für Restaurants auf meiner Karte zu bekommen und es funktioniert nicht. Jede Hilfe wäre willkommen. Muss ich eine Abfragemethode hinzufügen? Ich versuche es auch nicht, denn ich werde den Standort nach dem Beenden statisch machen lassen. Hier ist mein entsprechender Code,Ich versuche, eine Restaurant-Locator-App zu machen und kann die Marker nicht erscheinen

<script> 
    var map; 
    function initialize() { 
    var center = new google.maps.LatLng(37.422, -122.084058); 
    map = new google.maps.Map(document.getElementById('map'), { 
    center: center, 
    zoom: 13 
     }); 

    var request = { 
     location: center, 
     radius: 8047, 
     types: ['restaurant'] 
    }; 

    var service = new google.places.PlaceService(map); 

    service.nearbySearch(request, callback); 
    } 

    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.addDomListener(window, 'load', initialize); 
    </script>

Quelle

2016-06-12 orangutat

Welche Fehler Sie bekommen? – Muhsin

Haben Sie API_KEY hinzugefügt? – Muhsin

'var service = new google.maps.places.PlaceService (Karte);' –

Places ein API_KEY benötigt.

var map; 
 
var infowindow; 
 

 
function initMap() { 
 
    var center = new google.maps.LatLng(37.422, -122.084058); 
 

 
    map = new google.maps.Map(document.getElementById('map'), { 
 
    center: center, 
 
    zoom: 13 
 
    }); 
 

 
    infowindow = new google.maps.InfoWindow(); 
 
    var service = new google.maps.places.PlacesService(map); 
 
    service.nearbySearch({ 
 
    location: center, 
 
    radius: 8047, 
 
    type: ['restaurant'] 
 
    }, callback); 
 
} 
 

 
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); 
 
    }); 
 
}

html, 
 
body { 
 
    height: 100%; 
 
    margin: 0; 
 
    padding: 0; 
 
} 
 
#map { 
 
    height: 100%; 
 
}

<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <title>Place searches</title> 
 
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no"> 
 
    <meta charset="utf-8"> 
 
    <script> 
 
    </script> 
 
</head> 
 

 
<body> 
 
    <div id="map"></div> 
 
    <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyB1tbIAqN0XqcgTR1-FxYoVTVq6Is6lD98&libraries=places&callback=initMap" async defer></script> 
 
</body> 
 

 
</html>

Quelle

2016-06-12 06:01:20 Muhsin

Ich versuche, eine Restaurant-Locator-App zu machen und kann die Marker nicht erscheinen

Antwort

Verwandte Themen