Google maps api 3 谷歌地图SV3街景问题-如果街景不可用,则不工作

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

我们有一个标准地图(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”函数

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>    }

&nbsp;          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.