【发布时间】：2011-12-11 23:45:12
【问题描述】：
我正在像这样生成街景静态图像：
如果您访问该链接，您会看到一张图片，上面写着“抱歉，我们没有这方面的图片...”
有什么方法可以检测到这种“抱歉”状态，以便我可以退回到另一张图片？
【问题讨论】：
标签： image google-maps static google-street-view
【发布时间】：2011-12-11 23:45:12
【问题描述】：
一种快速的解决方案是使用 xmlrpc 加载图像文件并检查其 md5sum 是否为 30234b543d5438e0a0614bf07f1ebd25，或者其大小是否为 1717 字节（另一个图像不太可能具有完全相同的大小），但这是不是很健壮，因为我看到谷歌改变了图像中文本的位置。虽然这对于原型来说是一个非常好的开始。
您可以改为进行图像处理。请注意，由于 Google 可以决定随时更改图像的外观，因此它仍然不是非常强大。你必须决定是否值得。
无论如何，这是我使用 jQuery 的方法：
- 加载图像并打开 2D 上下文以直接访问 pxiel（请参阅this question 了解如何操作）
- 分析图像：
- 随机位置的 2×2 像素样本组；我推荐至少 30 个组
- 如果所有像素具有相同的值并且它们的 R/G/B 值相差不超过 10%（即它们是灰色的），则一组 2×2 像素是好 )
- 统计图像中好个像素组的比例
- 如果有超过 70%好个像素组，那么我们很确定这是“无图像”版本：用您选择的另一个图像替换它。
我不建议直接测试 RGB 值的原因是因为 JPEG 解压缩在不同浏览器上的行为可能略有不同。
【讨论】：
-
请参阅stackoverflow.com/a/40803070/1069142，了解刚刚推出的更可靠的方法。
由于 3.0 版本已经内置了这种情况 布尔测试状态 === streetviewStatus.Ok，这是我的情况解决中的一个 sn-p
if (status === google.maps.StreetViewStatus.OK) {
var img = document.createElement("IMG");
img.src = 'http://maps.googleapis.com/maps/api/streetview?size=160x205&location='+ lat +','+ lng +'&sensor=false&key=AIzaSyC_OXsfB8-03ZXcslwOiN9EXSLZgwRy94s';
var oldImg = document.getElementById('streetViewImage');
document.getElementById('streetViewContainerShow').replaceChild(img, streetViewImage);
} else {
var img = document.createElement("IMG");
img.src = '../../images/ProfilnoProfilPicture.jpg';
img.height = 205;
img.width = 160;
var oldImg = document.getElementById('streetViewImage');
document.getElementById('streetViewContainerShow').replaceChild(img, streetViewImage);
}
【讨论】：
-
这部分工作，但请注意，JavaScript API 可能会返回街景图像 API 中不可用的全景（全景 ID 靠近纬度）。有关完整详细信息，请参阅 code.google.com/p/gmaps-api-issues/issues/detail?id=10402。
您可以使用 getPanoramaByLocation 函数（请参阅http://code.google.com/apis/maps/documentation/javascript/services.html#StreetViewService）。
试试这样的：
function handleMapClick()
{
var ll= new google.maps.LatLng(latitude,longitude);
sv.getPanoramaByLocation(ll, 50, processSVData);
}
function processSVData(data, status) {
if (status==google.maps.StreetViewStatus.ZERO_RESULTS)
{
<DO SOMETHING>
}
}
【讨论】：
-
这部分工作，但请注意，JavaScript API 可能会返回街景图像 API 中不可用的全景（全景 ID 靠近纬度）。有关完整详细信息，请参阅 code.google.com/p/gmaps-api-issues/issues/detail?id=10402。
从 2016 年起，您可以使用新的Street View Image Metadata API。
现在您只需要status 字段即可知道是否找到了全景图。
请求示例：
{
"status" : "ZERO_RESULTS"
}
{
...
"status" : "OK"
}
【讨论】：
请求 google 街景图片，如果它具有特定的文件大小，则它是“不提供街景”。我做了以下操作：
var url = 'google street view url';
var xhr = new XMLHttpRequest();
xhr.open('GET', url, true);
xhr.responseType = 'blob';
xhr.onload = function (e) {
if (this.status == 200) {
try {
var image = new Blob([this.response], {type: 'image/jpeg'});
if (image.size) {
if (url.indexOf('640x640') > -1 && image.size === 8410) {
// Not street view
}
if (url.indexOf('400x300') > -1 && image.size === 3946) {
// Not street view
}
}
} catch (err) {
// IE 9 doesn't support blob
}
}
};
xhr.send();
【讨论】：
-
很好的研究，但这始终是破坏图像的一种改变。
另一种方法是加载图像，然后比较一些像素颜色。谷歌的“无街景”图像总是一样的。以下是比较 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 更改返回的图像，此代码将中断。
【讨论】：