Google地图StreetView来自地址 [英] Google Maps StreetView from Address

问题描述

当您访问Google地图网络地图服务并搜索地址时，请说纽约NY 10019第五大道666号，您将获得一张地图，其中包含一个显示位置的标记以及各种控件和链接地图的左上角。其中包括街景视图链接。点击它，你会得到一个全景图，显示建筑物的正面（在这种情况下，从第五大道）。

但是，如果我使用JavaScript API并想显示街景，全景图不会显示建筑物的正面。我可以对地址进行地理编码，但是当我获得全景图时，它不会看到建筑物的正面（在这种情况下，它将位于距离最近的交叉街道52nd Street的建筑物的一侧）。更糟糕的是，如果提供的地址是一个大型场地，例如购物中心，则需要增加50米默认值的容差，并且通常最终会看到来自小街道的视图。

是否有可能从地址获取StreetView全景图，最好与Google的网络地图服务提供的相同，而不是纬度，经度和可选的标题或间距API v3？ 使用 中的代码道路 - 街景 - 全景 - 而不是后面的小巷 - 从 - / api / 31186075＃31186075>这个问题的答案：请求主要道路StreetView全景图而不是来自API的后退小巷与示例地址纽约州纽约市1004号第五大道666号666号为我提供了与Google地图相同的结果。

代码段： div class =snippet-code>

var sv = new google.maps.StreetViewService（）; var geocoder = new google .maps.Geocoder（）; var directionsService = new google.maps.DirectionsService（）; var panorama; var address =666 5th avenue，New York，NY 10019; var myLatLng; function initialize（）{panorama = new google。 maps.StreetViewPanorama（document.getElemen tById（ 全景））; geocoder.geocode（{'address'：address}，function（results，status）{if（status == google.maps.GeocoderStatus.OK）{myLatLng = results [0] .geometry.location; //找到一个Streetview位置在路上var request = {origin：address，destination：address，travelMode：google.maps.DirectionsTravelMode.DRIVING}; directionsService.route（request，directionsCallback）;} else {alert（Geocode由于以下原因不成功： + status）;}}）;} google.maps.event.addDomListener（window，'load'，initialize）;函数processSVData（data，status）{if（status == google.maps.StreetViewStatus.OK）{panorama .setPano（data.location.pano）; var heading = google.maps.geometry.spherical.computeHeading（data.location.latLng，myLatLng）; panorama.setPov（{heading：heading，pitch：0，zoom：1}）; panorama.setVisible（真）; } else {alert（找不到这个位置的街景数据。）; }}函数directionsCallback（response，status）{if（status == google.maps.DirectionsStatus.OK）{var latlng = response.routes [0] .legs [0] .start_location; sv.getPanoramaByLocation（latlng，50，processSVData）; } else {alert（方向服务不成功，原因如下：+ status）; }}

< script src =https：// maps.googleapis.com/maps/api/js?libraries=geometry\"> ;</script><div id =panostyle =width：425px; height：400px; float：left>< / div>

When you go to Google Maps web mapping service and search for an address, say "666 5th avenue, New York, NY 10019" you will be served a map with a marker showing the location, along with various controls and links in the upper left of the map. Among those are the Street View link. Clicking it you will get a panorama showing the front of the building (from 5th Avenue in this case).

However, if I am using the JavaScript API and want to show the StreetView, the panorama will not show the front of the building. I can geocode the address, but when I get a panorama, it will not be looking at the front of the building (in this case, it will be the side of the building from the nearest cross-street, 52nd Street). To make matters worse, if the supplied address is a large venue, such as a shopping mall, you will need to increase the tolerance from the 50 meter default, and you usually end up with the view from a small side street.

Is it possible to obtain a StreetView panorama from an address, preferably the same one that Google's web mapping service will provide, rather than a latitude, longitude, and optionally a heading or pitch with the API v3?

解决方案

Using the code from this answer to the question: Request main road StreetView panoramas instead of back alleys from API with your "example" address of "666 5th avenue, New York, NY 10019" gives me the same result I get on Google Maps.

code snippet:

var sv = new google.maps.StreetViewService();
var geocoder = new google.maps.Geocoder();
var directionsService = new google.maps.DirectionsService();
var panorama;
var address = "666 5th avenue, New York, NY 10019";
var myLatLng;

function initialize() {

  panorama = new google.maps.StreetViewPanorama(document.getElementById("pano"));

  geocoder.geocode({
    'address': address
  }, function(results, status) {
    if (status == google.maps.GeocoderStatus.OK) {
      myLatLng = results[0].geometry.location;

      // find a Streetview location on the road
      var request = {
        origin: address,
        destination: address,
        travelMode: google.maps.DirectionsTravelMode.DRIVING
      };
      directionsService.route(request, directionsCallback);
    } else {
      alert("Geocode was not successful for the following reason: " + status);
    }
  });
}
google.maps.event.addDomListener(window, 'load', initialize);

function processSVData(data, status) {
  if (status == google.maps.StreetViewStatus.OK) {

    panorama.setPano(data.location.pano);

    var heading = google.maps.geometry.spherical.computeHeading(data.location.latLng, myLatLng);
    panorama.setPov({
      heading: heading,
      pitch: 0,
      zoom: 1
    });
    panorama.setVisible(true);

  } else {
    alert("Street View data not found for this location.");
  }
}

function directionsCallback(response, status) {
  if (status == google.maps.DirectionsStatus.OK) {
    var latlng = response.routes[0].legs[0].start_location;
    sv.getPanoramaByLocation(latlng, 50, processSVData);
  } else {
    alert("Directions service not successfull for the following reason:" + status);
  }
}

<script src="https://maps.googleapis.com/maps/api/js?libraries=geometry"></script>
<div id="pano" style="width: 425px; height: 400px;float:left"></div>

这篇关于Google地图StreetView来自地址的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！