Question

我正在使用Google Street View image API来显示某个位置的图片。

它工作正常，但是当没有可用的图片时，我会得到一张黑色图片而不是一张位置图片。有什么方法可以检查是否没有返回图像并显示另一个图像？

Answer 1

我认为没有办法检查这个。当您无法向页面添加太多功能时，SV图像API专为静态情况而设计。

也许您应该查看Street View in the JS API，这样可以让您检测图像何时可用。

Answer 2

另一种方法是加载图像，然后比较一些像素颜色。＆＃34;没有街景＆＃34;来自谷歌的图片总是一样的。以下是比较2个像素的方法：

var url = STREETVIEWURL
var img = new Image();
// Add some info to prevent cross origin tainting
img.src = url + '?' + new Date().getTime();
img.setAttribute('crossOrigin', '');
img.crossOrigin = "Anonymous";
img.onload = function() {
    var context = document.createElement('CANVAS').getContext('2d');
    context.drawImage(img, 0, 0);
    //load 2 pixels.  I chose the first one and the 5th row
    var data1 = context.getImageData(0, 0, 1, 1).data;
    var data2 = context.getImageData(0, 5, 1, 1).data;
    console.log(data1);
    // google unknown image is this pixel color [228,227,223,255]
    if(data1[0]==228 && data1[1]==227 && data1[2]==223 && data1[3]==255 && 
                     data2[0]==228 && data2[1]==227 && data2[2]==223 && data2[3]==255){
        console.log("NO StreetView Available");
    }else{
         console.log("StreetView is Available");
    }
};

一些潜在问题：我发现CrossOrigin污染有些错误。此外，如果谷歌更改返回的图像，此代码将中断。

Answer 3

//Image Div  

<div id='pano'>    

    streetview.getPanoramaByLocation(streetViewLocation, 50, function(data, status) {
                    if (status == 'OK') {
                      var fenway = {lat: Number(alarm_lat), lng: Number(alarm_lng)};
                      var panorama = new google.maps.StreetViewPanorama(document.getElementById('pano'), {
                        position: fenway,
                        pov: {
                          heading: 34,
                          pitch: 10
                        }
                      });    
                      map.setStreetView(panorama);
                    }
                    else{
                      //another image here

                    }
                });

如何检查Google街景图像API是否未返回图像？

3 个答案: