Question

Google Street View Image API可让您在不使用JavaScript的情况下将静态（非交互式）街景全景或缩略图嵌入到您的网页中。

请求网址：http://maps.googleapis.com/maps/api/streetview?parameters

+问题+

如果我给它一个没有街景视图的地址，它会返回一个图像，上面写着“对不起，我们这里没有图像”。

根据当前的API，我无法检测是否找到街景。任何人都有黑客或建议搞清楚这一点？

+ +实例

正确街景：http://maps.googleapis.com/maps/api/streetview?size=300x300&sensor=false&location=100+Highland+Ave+Baltimore,+MD+21224

对不起街景：http://maps.googleapis.com/maps/api/streetview?size=300x300&sensor=false&location=1600+Pennsylvania+Ave,+Washington,+DC+20500

Answer 1

考虑在Google地图中使用StreetViewService和StreetViewStatus对象：https://developers.google.com/maps/documentation/javascript/streetview#StreetViewService

基本上，您需要创建一个StreetViewService对象，尝试使用getPanoramaByLocation(latlng:LatLng, radius:number, callback:function(StreetViewPanoramaData, StreetViewStatus))方法根据位置查找全景图。

在回调函数中，有一个条件参数将检查数据可用性if (status == google.maps.StreetViewStatus.OK)。基于布尔返回，执行所需的操作。我提供的第一个链接得到了使用这些方法的一个很好的例子。

注意：我还注意到你有基于地址的位置。这可以使用地理编码服务（https://developers.google.com/maps/documentation/javascript/geocoding）

简单地转换为LatLng

Answer 2

只需查询Street View Image Metadata API。

这是2016年11月添加到街景图片API中的新功能，可让您查询指定位置（地址或latlng）的街景全景图，甚至是全景ID。这些查询是免费的。

Answer 3

似乎谷歌在幕后使用了json端点。我认为这就是你要找的http://andresmartinezsoto.wordpress.com/category/computing/google-maps-api/

当没有可用图像时，它返回空对象（{}）。

以前，我使用HEAD请求获取内容长度，并将其与之进行比较以了解是否存在图像。

Answer 4

我为这个问题写了一个小黑客。基本上它使用此plugin来获取图像的BASE64，将其绘制到画布（可见性设置为“隐藏”）并检查Google返回的图像的颜色。

 function checkImage(url){

        var error_image_color = {
            0: 228,
            1: 227,
            2: 223,
            3: 255
        }

        $.getImageData({
            url: url,
            success: function(image){
                var append_img = $(image);
                var img_base64 = $(image).attr('src');
                var image = new Image();
                image.src = img_base64;
                var canvas = document.getElementById('canvas').getContext('2d');
                canvas.drawImage(image, 0, 0);
                var data = canvas.getImageData(10, 10, 1, 1).data;

                if (data[0] != error_image_color[0]){
                    $('body').append(append_img);                       
                }
            },
            error: function(a,b,c){
                console.log([a,b,c]);
            }
        });

}

Answer 5

这对我有用：

$(function() {
    $('img[src*="maps.googleapis.com"]').each(
        function(){
             $(this).hide();  // you may want to replace this with a css rule
             var img=($(this).attr('src'));
             var xhr = new XMLHttpRequest();
             xhr.img=$(this);
             xhr.open("GET", img, true);
             xhr.responseType = "arraybuffer";
             xhr.onreadystatechange = function() {
                 if(this.readyState == this.DONE) {
                     if (this.response.byteLength!=8381) this.img.fadeIn();
                     // Here is a good place to measure the byteLength of 
                     // grey images in your requested size  
                 }
             };
             xhr.send(null);
        });
});

您可以添加css规则：

img[src*="maps.googleapis.com"] {display:none;}

而不是行：

$(this).hide();

哪个更顺畅。

请注意，灰色图片的响应内容长度可能会因您在请求中指定的尺寸而有所不同，因此请务必测试并将this.response.byteLength!=8381替换为您获得的特定尺寸。 8381是600 x 600图像的正确值。

此外，谷歌可能会更改不存在的图像或文本的位置，因此需要仔细测试。

要考虑的方法是检查response.byteLength是否高于给定阈值，作为压缩目标的灰色图像通常比实际图像小得多。

Answer 6

好吧，您可以轻松检查返回文件的大小

我用PHP编写我的解决方案作为例子。此功能有两个输入：google streat view API URL和“Blank Image”的大小。

<?
function street_view_check($url,$size_of_blank_image){
    $str=file_get_contents($url);
   if(strlen($str)==$size_of_blank_image){
            return false;
   }
   return true;
}

 $url1="http://maps.googleapis.com/maps/api/streetview?size=640x480&location=40.648215,-8.624296&fov=90&heading=$i&pitch=0&sensor=false";
 $url2="http://maps.googleapis.com/maps/api/streetview?size=640x480&location=41.157207,-8.62378&fov=90&heading=$i&pitch=0&sensor=false";

 echo street_view_check($url1,6778);
 echo street_view_check($url2,6778);
?>

Answer 7

检查响应大小的另一个选项。＆＃34; No Image＆＃34;灰度图像字节大小取决于请求的宽度和高度。但是，它比现有图像小得多。例如，使用angularJS：

$http.get("https://maps.googleapis.com/maps/api/streetview?size=600x300&location=46.404382,10.013988")
    .success(function(response) { 
        if(response.length < 5000) {
            console.log("This is a no-image image");
            }
    });

Answer 8

与MALK类似：

另一种方法是加载图像，然后比较一些像素颜色。来自谷歌的“无街景”图片始终是相同的。以下是比较2个像素的方法：

Dim l1args as Array = {"help","exit","start"} 'first position possibilities
Dim l2args as Array = {"server","exit"} 'second position possibilities

Console.Write("console# ")
Dim input = Console.ReadLine()
Dim tokens As String() = input.Split(CChar(" "))

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

如何判断Google的Streetview Image API是否返回“抱歉，我们这里没有图像”（即NULL）结果？

8 个答案: