全景ID列表（街景）

Question

我需要在一个方向上保留Panorama Id的列表。我可以使用方法StreetViewPanorama通过链接获得该功能。但我有这个错误：

  

变量“链接”未定义   

我的代码是：

var panorama = new google.maps.StreetViewPanorama(document.getElementById('pano'),{
          position: {lat: 37.869, lng: -122.255},
          pov: {
            heading: 270,
            pitch: 0
          },
          visible: true
          });
..
panorama.setPano('SomePAnoCode45994hf9hf');
var Links = panorama.getLinks();

我做错了什么？ 我希望通过Links获得下一个全景：

Links[0].getPano();

Answer 1

Google Maps Javascript API v3基于事件。你需要等待全景＆＃34; status_changed＆＃34;在getLinks()返回结果之前要触发的事件。

google.maps.event.addListener(panorama, 'status_changed', function() {
  var status = panorama.getStatus();
  if (status == "OK") {
    var Links = panorama.getLinks();
    console.log(Links);
  } else {
    alert("panorama status="+panorama.getStatus());
  }
});

proof of concept fiddle

代码段

＆＃13;

＆＃13;

var panorama;

function initialize() {
  panorama = new google.maps.StreetViewPanorama(
    document.getElementById('street-view'), {
      position: {
        lat: 37.869260,
        lng: -122.254811
      },
      pov: {
        heading: 165,
        pitch: 0
      },
      zoom: 1
    });
  var Links = panorama.getLinks();
  console.log(Links);
  google.maps.event.addListener(panorama, 'status_changed', function() {
    var status = panorama.getStatus();
    if (status == "OK") {
      var htmlStr = "<b>Links:</b><br>";
      var Links = panorama.getLinks();
      console.log(Links);
      for (var i = 0; i < Links.length; i++) {
        htmlStr += Links[i].heading.toFixed(3) + ":" + Links[i].description + "<br>";
      }
      document.getElementById('links').innerHTML = htmlStr;
    } else {
      alert("panorama status="+panorama.getStatus());
    }
  });
}

＆＃13;

html,
body {
  height: 100%;
  margin: 0;
  padding: 0;
}

#street-view {
  height: 100%;
}

＆＃13;

<!-- 
modified from:
https://developers.google.com/maps/documentation/javascript/examples/streetview-embed
-->
<div id="links"></div>
<div id="street-view"></div>
<script async defer src="https://maps.googleapis.com/maps/api/js?callback=initialize"></script>

＆＃13;

＆＃13;

＆＃13;