Javascript 在信息窗口中显示街景
我正在尝试在信息窗口中显示街景。我在v2api中使用了这个方法,但是这个方法(setTimeout)在v3中对我不起作用,所以我尝试使用addListener方法来显示全景。当我试图传递我希望在其中显示街景的div时,我得到的错误是空引用。我在这里发现了几个问题,似乎很中肯,但我看不出它们做了什么不同——这两个例子都使用了infowindow domready事件,我也在使用它。这是我的密码Javascript 在信息窗口中显示街景,javascript,google-maps-api-3,infowindow,google-street-view,Javascript,Google Maps Api 3,Infowindow,Google Street View,我正在尝试在信息窗口中显示街景。我在v2api中使用了这个方法,但是这个方法(setTimeout)在v3中对我不起作用,所以我尝试使用addListener方法来显示全景。当我试图传递我希望在其中显示街景的div时,我得到的错误是空引用。我在这里发现了几个问题,似乎很中肯,但我看不出它们做了什么不同——这两个例子都使用了infowindow domready事件,我也在使用它。这是我的密码 var map; function initialize() { var lat = doc
var map;
function initialize()
{
var lat = document.getElementById("Lat").value;
var lon = document.getElementById("Lon").value;
var latlon = new google.maps.LatLng(parseFloat(lat), parseFloat(lon));
var mapOptions = {
center: latlon,
zoom: 15,
streetViewControl: false,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions);
var sv = new google.maps.StreetViewService();
sv.getPanoramaByLocation(latlon, 50, showShopInfo);
}
function showShopInfo(panoData, status)
{
var streetview;
var dirName = document.getElementById("Directory").value;
var zipSearch = document.getElementById("ZipCodeSearch").value;
var valID = document.getElementById("ShopValID").value;
var shopInfo;
if(status == google.maps.StreetViewStatus.OK)
{
// Got street view!
streetview = true;
shopInfo = "<div id='shopInfo'><table border='0'><tr><td height='200'>";
shopInfo = shopInfo + "<div id='svMini' style='height: 200px; width: 200px;'></div></td></tr>";
shopInfo = shopInfo + "<tr><td><br /><b><a href='ShopProfileBU.asp?ValidationID=" + valID + "&DirectoryName=" + dirName + "&ZipCodeSearch=" + zipSearch + "' title='Shop Profile'>";
shopInfo = shopInfo + document.getElementById("ShopName").value + "</b><br /></a>";
shopInfo = shopInfo + document.getElementById("Address").value + "<br />";
shopInfo = shopInfo + document.getElementById("City").value + ", ";
shopInfo = shopInfo + document.getElementById("State").value + " ";
shopInfo = shopInfo + document.getElementById("ZipCode").value + "<br /><br />";
shopInfo = shopInfo + "<b>" + document.getElementById("Phone").value + "</b></td></tr></table></div>";
}
else
{
// No street view available
streetview = false;
shopInfo = "<br /><b><a href='ShopProfileBU.asp?ValidationID=" + valID + "&DirectoryName=" + dirName + "&ZipCodeSearch=" + zipSearch + "' title='Shop Profile'>";
shopInfo = shopInfo + document.getElementById("ShopName").value + "</b><br /></a>";
shopInfo = shopInfo + document.getElementById("Address").value + "<br />";
shopInfo = shopInfo + document.getElementById("City").value + ", ";
shopInfo = shopInfo + document.getElementById("State").value + " ";
shopInfo = shopInfo + document.getElementById("ZipCode").value + "<br /><br />";
shopInfo = shopInfo + "<b>" + document.getElementById("Phone").value + "</b>";
}
var infowindow = new google.maps.InfoWindow({
content: shopInfo,
position: map.getCenter()
});
infowindow.open(map);
if(streetview)
google.maps.event.addListener(infowindow, 'domready', showPanoMini(panoData.location.latLng.lat(), panoData.location.latLng.lng()));
}
function showPanoMini(pLat, pLon)
{
var panoLat = parseFloat(document.getElementById("PanoLat").value);
var panoLon = parseFloat(document.getElementById("PanoLon").value);
var panoYaw = parseFloat(document.getElementById("PanoYaw").value);
var panoPitch = parseFloat(document.getElementById("PanoPitch").value);
var panoZoom = parseFloat(document.getElementById("PanoZoom").value);
var panoLatLon;
if(panoLat==0 && panoLon==0)
panoLatLon = new google.maps.LatLng(pLat, pLon);
else
panoLatLon = new google.maps.LatLng(parseFloat(panoLat), parseFloat(panoLon));
var panoPOV = {
heading: parseFloat(panoYaw),
pitch: parseFloat(panoPitch)
};
var panoOptions = {
position: panoLatLon,
pov: panoPOV,
addressControl: false,
linksControl: false,
zoomControlOptions: {
style: google.maps.ZoomControlStyle.SMALL
},
visible: true
};
var panorama = new google.maps.StreetViewPanorama(document.getElementById("svMini"), panoOptions);
}
google.maps.event.addDomListener(window, 'load', initialize);
埃塔:谢谢大家花时间来看,但我自己解决了这个问题。出于某种原因,将infowindow的侦听器回调参数设置为匿名函数可以工作,而将其设置为常规函数则不行。以下是现在起作用的固定部分:
google.maps.event.addListener(infowindow, 'domready', function() {
var panoLat = parseFloat(document.getElementById("PanoLat").value);
var panoLon = parseFloat(document.getElementById("PanoLon").value);
var panoYaw = parseFloat(document.getElementById("PanoYaw").value);
var panoPitch = parseFloat(document.getElementById("PanoPitch").value);
var panoZoom = parseFloat(document.getElementById("PanoZoom").value);
var panoLatLon;
if(panoLat==0 && panoLon==0)
panoLatLon = panoData.location.latLng;
else
panoLatLon = new google.maps.LatLng(parseFloat(panoLat), parseFloat(panoLon));
var panoPOV = {
heading: parseFloat(panoYaw),
pitch: parseFloat(panoPitch)
};
var panoOptions = {
position: panoLatLon,
pov: panoPOV,
addressControl: false,
linksControl: false,
zoomControlOptions: {
style: google.maps.ZoomControlStyle.SMALL
},
visible: true
};
var panorama = new google.maps.StreetViewPanorama(document.getElementById("svMini"), panoOptions);
});
我看不出这与我的代码或者我在这个网站上已经找到的其他两个例子有什么不同。我正在我的信息窗口中为domready事件添加一个监听器,并在监听器中构建我的全景图,就像在该示例代码中一样。
google.maps.event.addListener(infowindow, 'domready', function() {
var panoLat = parseFloat(document.getElementById("PanoLat").value);
var panoLon = parseFloat(document.getElementById("PanoLon").value);
var panoYaw = parseFloat(document.getElementById("PanoYaw").value);
var panoPitch = parseFloat(document.getElementById("PanoPitch").value);
var panoZoom = parseFloat(document.getElementById("PanoZoom").value);
var panoLatLon;
if(panoLat==0 && panoLon==0)
panoLatLon = panoData.location.latLng;
else
panoLatLon = new google.maps.LatLng(parseFloat(panoLat), parseFloat(panoLon));
var panoPOV = {
heading: parseFloat(panoYaw),
pitch: parseFloat(panoPitch)
};
var panoOptions = {
position: panoLatLon,
pov: panoPOV,
addressControl: false,
linksControl: false,
zoomControlOptions: {
style: google.maps.ZoomControlStyle.SMALL
},
visible: true
};
var panorama = new google.maps.StreetViewPanorama(document.getElementById("svMini"), panoOptions);
});