如何检查 Google Street View Image API 是否没有返回图像？ [复制]答案

【问题标题】：How to check if Google Street View Image API returns no image? [duplicate]如何检查 Google Street View Image API 是否没有返回图像？ [复制]
【发布时间】：2011-12-03 16:35:48
【问题描述】：

我正在使用Google Street View image API 显示位置的图像。

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

【问题讨论】：

不知道为什么要结束投票，因为在我看来这是一个非常明智的问题 - 尽管乍一看没有简单的答案。

标签： javascript google-street-view

【解决方案1】：

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

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

【讨论】：

【解决方案2】：

另一种方法是加载图像，然后比较一些像素颜色。谷歌的“无街景”图像总是一样的。以下是比较 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 污染的错误。此外，如果 google 更改返回的图像，此代码将中断。

【讨论】：

【解决方案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

                    }
                });

【讨论】：