カスタム マーカーと Google プレイス クエリからのマーカーを同期して作業する必要がありました。しかし、番号、写真などをクリックしてマーカーの詳細を取得する方法を理解するのに苦労しています.
基本的に、 getDetails() メソッドからすべてまたは大量の詳細にアクセスして、マーカーでクリックがトリガーされたときにそれらにアクセスし、さらに使用するためにマーカーのボックスに表示したい
//map options
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 13,
center: new google.maps.LatLng(46.055625, 14.504408),
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var infowindow = new google.maps.InfoWindow();
var service = new google.maps.places.PlacesService(map);
//adding collection of stored markers
function addMyMarkers() {
for (var i = 0; i < locations.length; i++) {
placeMarker(new google.maps.LatLng(locations[i][1], locations[i][2]), locations[i][0]);
}
}
//query for getting place markers
function addFromSearch(request) {
service.nearbySearch(request, function(results, status) {
if (status == google.maps.places.PlacesServiceStatus.OK) {
for (var i = 0; i < results.length; i++) {
$('#json').append($.toJSON(results[i]) + '<br><br>');
//$("#debug").append("<img src='" + results[i].icon + "' />")
//results[i].reference
placeMarker(results[i].geometry.location, results[i].name,results[i].icon,results[i].photos);
//google.maps.event.addListener(markers[i], 'click', getDetails(results[i], i));
}
}
});
}
//function for placing icon with content, custom icon, etc...
function placeMarker(location, content,icon) {
var image;
if (icon) {
image = {
url: icon,
size: new google.maps.Size(71, 71),
origin: new google.maps.Point(0, 0),
anchor: new google.maps.Point(17, 34),
scaledSize: new google.maps.Size(25, 25)
};
}
//marker properties
var marker = new google.maps.Marker({
position: location,
map: map,
icon: image
});
//click listener
//service.getDetails(request, function(details, status) {
google.maps.event.addListener(marker, 'click', function() {
infowindow.setContent(content);
// infowindow.setContent(details.name + "<br />" + details.formatted_address +"<br />" + details.website + "<br />" + details.rating + "<br />" + details.formatted_phone_number);
infowindow.open(map, this);
});
}
私は、スタックオーバーフローに関する最初の投稿がうまくいったことを願っています。答えを見つけるためにできる限り徹底的に検索しようとしましたが、成功しませんでした。Google API 参照から: https://developers.google.com/maps/documentation/javascript/examples/place-details