How to check if Google Street View available and display message?

I am passing lat and lng variables and display google sreet view in a div. The problem is that when the StreetView is unavilable then nothing is displayed. I would like to check if there is a streetview for a given lat and lng and display a message. Here is my code:

var myPano = new GStreetviewPanorama(document.getElementById("street2"), panoOpts);
var location = new GLatLng(lat,lng)
myPano.setLocationAndPOV(location);

Maybe I should use something like: Event.addListener(myPano, "error", errorMessage());

Any ideas?

In v3 this has changed a bit. Check out the documentation at http://code.google.com/apis/maps/documentation/javascript/reference.html#StreetViewService

The updated code is:

var streetViewService = new google.maps.StreetViewService();
var STREETVIEW_MAX_DISTANCE = 100;
var latLng = new google.maps.LatLng(40.7140, -74.0062);
streetViewService.getPanoramaByLocation(latLng, STREETVIEW_MAX_DISTANCE, function (streetViewPanoramaData, status) {
    if (status === google.maps.StreetViewStatus.OK) {
        // ok
    } else {
        // no street view available in this range, or some error occurred
    }
});

You may want to check out the following reference:

Google Maps API Documentation: Street View Client Querying

Determining whether a road supports Street View by visual inspection of the GStreetviewOverlay is not often feasible, or desirable from a user's perspective. For that reason, the API provides a service which programmatically requests and retrieves Street View data. This service is facilitated through use of the GStreetviewClient object.

Basically you can use the getNearestPanoramaLatLng() method of the GStreetviewClient class, which will return you a GLatLng of the nearest point where street view is available. You can then use the distanceFrom() method to check if the nearest street view point is within a certain threshold from your source point.

Here is a full example, which I believe should be self explanatory:

<!DOCTYPE html>
<html> 
<head> 
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/> 
    <title>Google Maps API - Street View Availability</title> 
    <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;sensor=false"
            type="text/javascript"></script> 
  </head> 
  <body> 
    <script type="text/javascript"> 
       var testPoint = new GLatLng(40.7140, -74.0062);   // Broadway, New York
       var svClient = new GStreetviewClient();

       svClient.getNearestPanoramaLatLng(testPoint, function (nearest) {
          if ((nearest !== null) && (testPoint.distanceFrom(nearest) <= 100)) {
             alert('Street View Available');             // Within 100 meters
          }
          else {
             alert('Street View Noet Available');        // Not within 100 meters
          }
       });
    </script> 
  </body> 
</html>

Update for Google Maps JavaScript API v3.25+: In v3.25 (current release version) and v3.26 (current experimental version), getPanoramaByLocation() is still available but not documented anymore.

@arthur-clemens's accepted answer still works, but use getPanorama() with a StreetViewLocationRequest instead if you want better compatibility:

var gstService = new google.maps.StreetViewService();

gstService.getPanorama({
    location: new google.maps.LatLng(40.7140, -74.0062),
    source: google.maps.StreetViewSource.OUTDOOR
}, function (data, status) {
    if (status === google.maps.StreetViewStatus.OK) {
        // OK
    } else {
        // error or no results
    }
});

Omit source in the StreetViewLocationRequest if you do not want the panorama search to be limited to outdoor ones.

来源：https://stackoverflow.com/questions/2675032/how-to-check-if-google-street-view-available-and-display-message

标签

javascript

google-maps

google-street-view