我正在尝试在Google地图标记infowindow(弹出窗口)中嵌入街景全景图。问题是,当我点击标记时,它只会更改streetViewPanorama的内容。否则,每个标记的文本内容都是相同的。
请参阅以下代码中的click侦听器或查看JSFiddle中的问题:http://jsfiddle.net/oyge1huj/。
var content = '<div id="content-wrapper">' +
'<div class="title"><h2>' + markers[i][0] + '</h2></div>' +
'<div class="separator"></div>' +
'<p><label><i class="fa fa-home"></i>Address: </label>' + markers[i][1] + '</p>' +
'<p><label><i class="fa fa-phone"></i>Phone: </label>' + markers[i][2] + '</p>' +
'<p><label><i class="fa fa-map-marker"></i>GPS: </label>' + markers[i][4] + ', ' + markers[i][3] + '</p>' +
'</div>';
var infoWindowContent = document.createElement("div");
infoWindowContent.setAttribute("id", "content");
infoWindowContent.innerHTML = content;
var streetview = document.createElement("div");
streetview.setAttribute("id", "street");
streetview.style.width = "100%";
streetview.style.height = "100px";
infoWindowContent.appendChild(streetview);
var infowindow = new google.maps.InfoWindow({
content: infoWindowContent
});
google.maps.event.addListener(marker, 'click', (function (marker, content, infowindow) {
return function () {
// infowindow.setContent(content);
openInfoWindow(marker);
};
})(marker, content, infowindow));
function openInfoWindow(marker) {
pin.set("position", marker.getPosition());
infowindow.open(map, marker);
//map.setCenter(marker.getPosition());
}
var panorama = null;
var pin = new google.maps.MVCObject();
google.maps.event.addListenerOnce(infowindow, "domready", function () {
panorama = new google.maps.StreetViewPanorama(streetview, {
navigationControl: false,
enableCloseButton: false,
addressControl: false,
zoomControl: false,
linksControl: false,
panControl: false,
visible: true
});
panorama.bindTo("position", pin);
});