Ich benutze Google Maps API Geolocation, um den Benutzer Standort über latlng, dann mit diesem Ort, um Text Suche nach "Golf" Standorten in diesem Bereich. Jetzt möchte ich von dieser grundlegenden Karten-/Markierungsansicht aus fortfahren, um Ortsdetails anzugeben, wenn der Benutzer auf die spezifische Kartenmarkierung klickt. Das Problem ist, wenn ich auf Marker klicke, gibt es keine Antwort. Ich habe das Gefühl, dass ich eine Variable abwende, aber ich könnte wirklich Hilfe gebrauchen, um herauszufinden, warum die Details & infowindo nicht auf Klick erscheinen?Google Maps API Geolocation Text Suche Ort Details
Ich sah auch, dass Google PlaceIDs verwendet, um Details zurückzugeben? war jedoch unsicher, ob dies auf die Karten-API-Detailanforderung zutraf.
Vielen Dank im Voraus für jede Hilfe.
function success(position) {
var s = document.querySelector('#status');
if (s.className == 'success') {
// not sure why we're hitting this twice in FF, I think it's to do with a cached result coming back
return;
}
s.innerHTML = "found you!";
s.className = 'success';
var mapcanvas = document.createElement('div');
mapcanvas.id = 'mapcanvas';
mapcanvas.style.height = '400px';
mapcanvas.style.width = '560px';
document.querySelector('article').appendChild(mapcanvas);
var latlng = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
var myOptions = {
zoom: 10,
center: latlng,
mapTypeControl: false,
navigationControlOptions: {
style: google.maps.NavigationControlStyle.SMALL
},
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById("mapcanvas"), myOptions);
var service;
var infowindow;
var request = {
location: latlng,
radius: '3200',
query: 'golf'
};
\t \t
infowindow = new google.maps.InfoWindow();
service = new google.maps.places.PlacesService(map);
service.textSearch(request, callback);
function callback(results, status) {
if (status == google.maps.places.PlacesServiceStatus.OK) {
for (var i = 0; i < results.length; i++) {
//var place = results[i];
createMarker(results[i].geometry.location);
}
}
}
function createMarker(position) {
new google.maps.Marker({
position: position,
map: map
});
}
var request = { reference: position.reference };
service.getDetails(request, function(details, status) {
marker.addListener(marker, 'click', function() {
infowindow.setContent(details.name);
infowindow.open(map, this);
});
});
}
function error(msg) {
var s = document.querySelector('#status');
s.innerHTML = typeof msg == 'string' ? msg : "failed";
s.className = 'fail';
}
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(success, error);
} else {
error('not supported');
}html, body, #mapcanvas {
height: 400px;
width: 400px;
margin: 0px;
padding: 0px
}<article>
<p>Finding your location: <span id="status">checking...</span>
</p>
</article>