Как я могу узнать, возвращается ли Google Streetview Image API "Извините, у нас нет изображений здесь" (т.е. NULL) Результат?

Ответ 1

Рассмотрите возможность использования объектов StreetViewService и StreetViewStatus в Картах Google: 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). На основе логического возврата выполните требуемые действия. Первая ссылка, которую я предоставил, стала отличным примером использования этих методов.

Примечание. Я также заметил, что у вас есть адреса, основанные на адресах. Это можно просто преобразовать в LatLng с помощью службы геокодирования (https://developers.google.com/maps/documentation/javascript/geocoding)

Ответ 2

Похоже, Google использует конечную точку json за кулисами. Я думаю, что это то, что вы ищете http://andresmartinezsoto.wordpress.com/category/computing/google-maps-api/

Он возвращает пустой объект ({}), когда нет изображения.

Раньше я использовал запрос HEAD для получения длины контента и сравнивал это, чтобы узнать, существует ли изображение или нет.

Ответ 3

Просто выполните запрос API метаданных с просмотром изображений.

Это новая функция, добавленная к API-интерфейсу Street View Image в ноябре 2016 года, которая позволит вам запрашивать доступность панорамных панорам Street View в определенных местах (адрес или latlng) или даже идентификаторы панорамы. Эти запросы бесплатны.

Ответ 4

Я написал небольшой взлом для этой проблемы. В основном он использует этот плагин, чтобы получить 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]);
            }
        });

}

Ответ 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 изображений.

Кроме того, Google может изменить не существующий образ или местоположение текста на нем, поэтому необходимо тщательное тестирование.

Следует учитывать, что если response.byteLength имеет выше заданный порог, серые изображения, являющиеся большими мишенями для сжатия, обычно намного меньше реальных изображений.

Ответ 6

Ну, вы легко можете проверить размер возвращаемого файла

Я пишу свое решение с PHP в качестве примера. эта функция имеет два входа: URL-адрес API google google и размер "Пустое изображение".

<?
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);
?>

Ответ 7

Другой вариант - проверить размер ответа. Размер байта серого изображения "Нет изображения" зависит от требуемой ширины и высоты. Однако он намного меньше, чем существующее изображение. Например, с угловымJS:

$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");
            }
    });

Ответ 8

Аналогично MALK:

Другой способ - загрузить изображение, а затем сравнить несколько цветов. Изображение "no streetview" из Google всегда одно и то же. Вот как вы бы сравнили 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 изменяет изображение, которое возвращает этот код, он сломается.