谷歌地图api v3谷歌街景和谷歌街景静态图像

时间:2015-02-25 22:51:17

标签: google-maps-api-3 google-street-view

Google可让我们检索静态街景图像

https://maps.googleapis.com/maps/api/streetview?size=400x400&location=40.720032,-73.988354&fov=90&heading=235&pitch=10

我正在建立一个房地产数据库,其中包含Google Maps Api v3和街景全景图。

如果你去这个网址bit.ly/17A6r4P,你会看到我做的例子,以便更清楚。显示的图片是生成的静态街景图片developers.google.com/maps/documentation/streetview *如果您点击"地图" Google地图街景视图将会打开,但我希望Google地图中街景全景图中的默认视图与"静态图像"相同 死在房子的前面。

2 个答案:

答案 0 :(得分:3)

您需要的信息位于网址中 位置= 40.720032,-73.988354&安培; FOV = 90安培;标题= 235安培;间距= 10

使用它初始化Google Maps Javascript API v3 Streetview:

working example

概念证明代码段:



var urlstring = 'location=40.720032,-73.988354&fov=90&heading=235&pitch=10';
// If there are any parameters at eh end of the URL, they will be in  location.search
// looking something like  "?marker=3"

var sv = new google.maps.StreetViewService();
var panorama;
var heading;
var pitch;

function initialize() {
  // skip the first character, we are not interested in the "?"
  var query = urlstring; // location.search.substring(1);

  // split the rest at each "&" character to give a list of  "argname=value"  pairs
  var pairs = query.split("&");
  for (var i = 0; i < pairs.length; i++) {
    // break each pair at the first "=" to obtain the argname and value
    var pos = pairs[i].indexOf("=");
    var argname = pairs[i].substring(0, pos).toLowerCase();
    var value = pairs[i].substring(pos + 1).toLowerCase();

    // process each possible argname  -  use unescape() if theres any chance of spaces
    if (argname == "location") {
      var coords = value.split(",");
      lat = parseFloat(coords[0]);
      lng = parseFloat(coords[1]);
    }
    if (argname == "pitch") {
      pitch = parseFloat(value);
    }
    if (argname == "heading") {
      heading = parseFloat(value);
    }
    if (argname == "lat") {
      lat = parseFloat(value);
    }
    if (argname == "lng") {
      lng = parseFloat(value);
    }
  }
  if (!isNaN(lat) && !isNaN(lng)) {
    myLatLng = new google.maps.LatLng(lat, lng);
  }
  // Set up the map
  var myOptions = {
    zoom: 10,
    center: myLatLng,
    streetViewControl: false
  };

  map = new google.maps.Map(document.getElementById('map_canvas'),
    myOptions);

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

  sv.getPanoramaByLocation(myLatLng, 50, processSVData);
}

function processSVData(data, status) {
  if (status == google.maps.StreetViewStatus.OK) {
    var marker = new google.maps.Marker({
      position: data.location.latLng,
      draggable: true,
      map: map,
      title: data.location.description
    });

    panorama.setPano(data.location.pano);
    if (isNaN(heading))
      heading = google.maps.geometry.spherical.computeHeading(data.location.latLng, myLatLng);
    if (isNaN(pitch)) pitch = 0;
    // alert(data.location.latLng+":"+myLatLng+":"+heading);
    panorama.setPov({
      heading: heading,
      pitch: pitch,
      zoom: 1
    });
    panorama.setVisible(true);

    google.maps.event.addListener(marker, 'click', function() {

      var markerPanoID = data.location.pano;
      // Set the Pano to use the passed panoID
      panorama.setPano(markerPanoID);
      panorama.setPov({
        heading: 270,
        pitch: 0,
        zoom: 1
      });
      panorama.setVisible(true);
    });
  } else {
    alert("Street View data not found for this location.");
  }
}

google.maps.event.addDomListener(window, 'load', initialize);
&#13;
<script src="http://maps.googleapis.com/maps/api/js?libraries=geometry"></script>
<div id="map_canvas" style="display:none; width: 425px; height: 400px;float:left"></div>
<div id="pano" style="width: 425px; height: 400px;float:left"></div>
&#13;
&#13;
&#13;

答案 1 :(得分:-1)

您可能希望使用Google Maps Street View API.

  

Google街景图片API可让您嵌入静态图片   (非交互式)街景全景图或缩略图到您的网站   页面,不使用JavaScript。视口使用URL定义   通过标准HTTP请求发送的参数,并作为a返回   静态图像