ロケーションの画像を表示するにはGoogle Street View image APIを使用しています。Google Street View Image APIが画像を返さないかどうかを確認する方法は?
画像は利用できませんが、ロケーション画像の代わりに黒い画像が表示されます。イメージが返されず、代わりに別のイメージを表示する方法がありますか?
ロケーションの画像を表示するにはGoogle Street View image APIを使用しています。Google Street View Image APIが画像を返さないかどうかを確認する方法は?
画像は利用できませんが、ロケーション画像の代わりに黒い画像が表示されます。イメージが返されず、代わりに別のイメージを表示する方法がありますか?
これを確認する方法はありません。 SV画像APIは、ページに多くの機能を追加できない静的なケース向けに設計されています。
おそらくStreet View in the JS APIを参照すると、画像がいつ利用可能かを検出できます。
もう1つの方法は、イメージをロードし、次にいくつかのピクセルの色を比較することです。 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が返す画像を変更した場合、このコードは破損します。
//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
}
});
私は完全に賢明な質問であると思われるので、なぜ投票が終了するのかはわかりません。最初は簡単な答えがないように見えますが。 – Murph