Cor*_*win 0 javascript jquery-ui google-maps-api-3
我有一个Google地图页面,其中填充了数据库中的标记。在标记InfoWindow中,是一个可单击的链接,该链接打开一个带有该位置的StreetView的jquery对话框。问题是,街景视图仅在我第一次单击InfoWindow链接时显示。如果我关闭对话框并尝试再次打开它(单击其他信息窗口,甚至再次单击相同的窗口),则会得到带有StreetView控件的对话框,新地址也将显示(带有“地址为近似值”),其余的对话框的颜色是均匀的浅灰色。
我试过计算器上发布(如一些warkarounds 这样一个在我的情况),但灰色的对话框仍然出现。
编辑:JSFiddle示例
使用onclick侦听器创建标记:
function addMarker(feature) {
var marker = new google.maps.Marker({
position: feature.position,
icon: icons[feature.type].icon,
map: map
});
//Create Infowindow
var infowindow = new google.maps.InfoWindow();
var content = '<h1 id="Heading" class="Heading">' + feature.shopName + '</h1>' +
'<div id="iwcontent" class="iwcontent">'+
'<p><b>Naslov : </b>' + feature.shopAddress + '</br>' +
'<p><b>Telefon : </b>' + feature.shopTel + '</br>' +
'</div>'+
'<div id="iwsw" class="iwsw">StreetView</div>'
;
//Call StreetView
google.maps.event.addDomListener(infowindow, 'domready', function () {
$('.iwsw').click(function () {
showStreetView(feature.position);
});
});
.
.
.
Run Code Online (Sandbox Code Playgroud)
showStreetView函数:
//Display dialog with streetview
function showStreetView(position){
var panoramaOptions = {position: position, pov: {heading: 34,pitch: 10}};
var panorama = new google.maps.StreetViewPanorama(document.getElementById("dialog-sw-canvas"), panoramaOptions);
map.setStreetView(panorama);
$( "#dialog-sw-canvas" ).dialog("open");
}
Run Code Online (Sandbox Code Playgroud)
对话框定义:
$(function(){
$('#dialog-sw-canvas').dialog({
title: 'Street View',
width: 1024,
height: 768,
closed: true,
cache: false,
modal: true,
onClose: function(){
$('#dialog-sw-canvas').empty();
}
});
});
Run Code Online (Sandbox Code Playgroud)
一切都像魅力一样,但只有一次。
打开对话框后触发全景图的调整大小事件,然后API将能够重新计算全景图的大小:
//Display dialog with streetview
function showStreetView(position){
var panoramaOptions = {position: position, pov: {heading: 34,pitch: 10}};
var panorama = new google.maps
.StreetViewPanorama(document.getElementById("dialog-sw-canvas"), panoramaOptions);
map.setStreetView(panorama);
$( "#dialog-sw-canvas" ).dialog("open");
google.maps.event.trigger(panorama,'resize');
}
Run Code Online (Sandbox Code Playgroud)