Google地图:自定义InfoWindow中的默认街景图像

时间:2012-05-05 22:09:51

标签: google-maps

当我使用谷歌地图作为匿名用户时,当我找到一家我正在建立网站的公司时,Google会向我展示某种默认的街景照片。它非常好,我希望这张照片也出现在我自定义的InfoWindow中,我正准备使用API​​3。有没有方法或者我应该嗅探并使用其源路径?

1 个答案:

答案 0 :(得分:1)

您可以像这样嵌入街景全景图,或在屏幕内容中嵌入屏幕捕获图像(<img src="...">)。您也可以设置标记visible: false

http://jsfiddle.net/sST8z/

<!DOCTYPE html>
<html>
  <head>
    <style type="text/css">
      html, body { margin: 0; padding: 0; height: 100% }
      #map_canvas { margin: 0; padding: 0; width: 500px; height: 300px }
      #street { margin: 0; padding: 0; width: 150px; height: 150px }

    </style>
    <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
    <script type="text/javascript">
      var map;
      var mapOptions = { center: new google.maps.LatLng(0.0, 0.0), zoom: 2,
        mapTypeId: google.maps.MapTypeId.ROADMAP };

      function initialize() {
        map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
        street = new google.maps.StreetViewPanorama(document.getElementById("street"), { 

        position: new google.maps.LatLng(40.72982797782924, -73.98622512817383),
        zoomControl: false,
        enableCloseButton: false,
        addressControl: false,
        panControl: false,
        linksControl: false
      });


      var infow = new google.maps.InfoWindow({ content: document.getElementById("street") });
      var myLatLng = new google.maps.LatLng(40.72982797782924, -73.98622512817383);
      var marker = new google.maps.Marker({ position: myLatLng, map: map, visible: true });

      infow.open(map, marker);
      map.setCenter(myLatLng);

      }
      google.maps.event.addDomListener(window, 'load', initialize);
    </script>
  </head>
  <body>
    <div id="street"></div>
    <div id="map_canvas"></div>

  </body>
</html>