0
私はlatlng経由でユーザーの場所を取得するためにgoogle maps api geolocationを使用しています。この場所を使用して、その地域の「ゴルフ」の場所をテキスト検索します。ここでは、ユーザーが特定の地図マーカーをクリックしたときの場所の詳細を提供するために、この基本的な地図/マーカービューから進んでいきたいと思います。問題は、マーカをクリックすると応答がないことです。私は1つの変数をオフにしているように感じるが、なぜ実際にクリックして表示されない詳細&が表示されないのかを特定するためのヘルプを使用することができますか？Google Maps APIジオロケーションテキスト検索場所の詳細
私はまた、Googleが詳細を返すためにplaceIDを使用していることを確認しましたか？ Map APIの詳細リクエストに適用されているかどうかは不明でした。
ご協力いただきありがとうございます。
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>