Google maps api 3 谷歌地图SV3街景问题-如果街景不可用,则不工作
我们有一个标准地图(MapTypeId.ROADMAP),上面有一个标记。地图上方有一个按钮,上面写着“显示街景”。如果用户单击它,它将在标记的位置(在同一div中)加载StreetView。按钮变为“隐藏街景”,如果单击,地图将恢复为标准路线图。用户也可以使用“pegman”来模拟相同的bahviour 当标记位置没有实际的街景时,问题就出现了。我们使用事件侦听器处理此问题,如果没有街景可用,则会显示一条消息通知用户,并返回false以防止“显示”不存在的街景。效果很好,除了用户试图使用“pegman”时,因为我们已经加载(但没有显示)街景(没有)。当用户第一次将pegman放在地图上时,什么也没发生,但我们的“显示/隐藏按钮”发生了变化。在pegman的第二次投放中,它改为街景,但我们的“显示/隐藏按钮”现在不正常了(它在已经存在时显示“显示街景”,在路线图上显示“隐藏街景”) 我们尝试更改代码结构-streetview(var panorama=…)仅通过“onclick”javascript函数初始化(它最初与“loadMap”函数捆绑在一起,现在已分离到另一个函数)在我们的显示/隐藏按钮上-如果街景可用,对其进行重大更改并更改按钮,如果不返回false并向用户显示消息。这非常有效,但现在如果用户使用“pegman”进入街景,按钮不会更改,因为它已被分离到另一个功能中 我已经穷途末路了,三天来我一直在尝试各种选项,但我不知道如何在“loadMap”功能中监听“通过pegman Droping更改街景”(请参阅下面loadMap代码中的“visible\u changed”事件侦听器)-如果我能弄明白,我可以改变按钮显示,但就我的一生而言,我无法弄明白(我需要倾听街景的显示,但不太“跨浏览器友好”,这一点很重要,因为该网站每月点击率超过400万次) 下面是“loadMap”函数Google maps api 3 谷歌地图SV3街景问题-如果街景不可用,则不工作,google-maps-api-3,google-street-view,Google Maps Api 3,Google Street View,我们有一个标准地图(MapTypeId.ROADMAP),上面有一个标记。地图上方有一个按钮,上面写着“显示街景”。如果用户单击它,它将在标记的位置(在同一div中)加载StreetView。按钮变为“隐藏街景”,如果单击,地图将恢复为标准路线图。用户也可以使用“pegman”来模拟相同的bahviour 当标记位置没有实际的街景时,问题就出现了。我们使用事件侦听器处理此问题,如果没有街景可用,则会显示一条消息通知用户,并返回false以防止“显示”不存在的街景。效果很好,除了用户试图使用“pe
function loadGMap(lat, lng, nachladenAnzeigen, radialConflict){
// Create the Map variables
mapDiv = document.getElementById('map');
width = parseInt(mapDiv.style.width);
height = parseInt(mapDiv.style.height);
latlng = new google.maps.LatLng(lat, lng);
// Create Map
var mapOptions = {
zoom: 14,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP,
scrollwheel: false,
panControl: false
};
map = new google.maps.Map(mapDiv,mapOptions);
... Code here for laying marker to map...
google.maps.event.addListener(map, 'visible_changed', function(){
alert('please work');
// It doesn't - no alert when pegman is dropped :-(
}
// Check for a street view at the marker position
var streetViewCheck = new google.maps.StreetViewService();
streetViewCheck.getPanoramaByLocation(latlng, 50, function(result, status) {
if (status == google.maps.StreetViewStatus.ZERO_RESULTS) {
streetViewAvailable = 0;
}else{
streetViewAvailable = 1;
}
});
... more code (event listeners, ie, zoom changed, etc...
这是loadStreetView函数,它是通过地图上方的Show/Hide Streetview按钮上的“onclick”操作调用的(我不认为你会需要它,对于这个用例来说一切都很好,该死的pegman drop不起作用,但你永远不知道…)
“visible\u changed”的事件侦听器位于地图对象上,而不是全景图上。地图对象(v3)没有“visible\u changed”事件 我的解决方案(适用于我…)是:
var pano=null;//初始化时,我在全局范围内使用它,不好,我知道…
var map=null;//类似地
函数init();
map=new google.maps.map(document.getElementById('map'),
地图选项);
createPano();
…这里还有其他初始化内容..
}
函数createPano(){
如果(pano==null){
pano=map.getStreetView();//api说这将创建默认的pano对象。。
}
google.maps.event.addListener(pano,“可见的”,
函数(){
警报(“位置为”+pano.getPosition());
//当自定义全景可用时,将其更改为getPanoAndSwitch()。。
panoFlag=pano.getVisible();
...
剩下的代码在这里。
至少,对我来说,这就是它的样子。谢谢你发布这个问题,它帮助我修复了一个愚蠢的错误
function loadStreetView(){
// Make 'Show/Hide StreetView' links above the map work
// Handle the toggle of StreetView 'button' display
if(streetViewAvailable == 0){
noStreetViewVariable = document.getElementById('noStreetView');
noStreetViewVariable.style.display = "inline";
return false;
}else{
panorama = map.getStreetView();
panorama.setPosition(latlng);
panorama.setPov({
heading: 265,
zoom:1,
pitch:0
});
var toggle = panorama.getVisible();
if (toggle == false) {
panorama.setVisible(true);
$('#button_streetview').attr("src", 'img/buttons/mapview.png');
} else {
panorama.setVisible(false);
$('#button_streetview').attr("src", 'img/buttons/streetview.png');
}
}
google.maps.event.addListener(panorama, 'visible_changed', function(){
if(streetViewAvailable == 0){
$('#button_streetview').attr("src", 'img/buttons/mapview.png');
}
else if(streetViewAvailable == 1){
if (panorama.getVisible() == true ) {
$('#button_streetview').attr("src", 'img/buttons/mapview.png');
}
}
});
google.maps.event.addListener(panorama, 'closeclick', function() {
$('#button_streetview').attr("src", 'img/buttons/streetview.png');
});
}
var pano = null ; // on initialize I use this in the global scope, bad, I know... <br>
var map = null ; // likewise <br>
function init(); <br>
map = new google.maps.Map(document.getElementById('map'),
MapOptions ); <br>
createPano() ; <br>
... other init stuff here .. <br>
}
function createPano() { <br>
if ( pano == null ) { <br>
pano = map.getStreetView(); // the api says this creates the default pano object..
<br> }
google.maps.event.addListener(pano, "visible_changed",
function(){ <br>
alert("position is " + pano.getPosition() ) ; <br>
// change this to getPanoAndSwitch() when custom panos are available ..
<br> panoFlag = pano.getVisible();
...
rest of code here.