Question

我正在寻找一种方法，将每个具有不同纬度/经度的多个谷歌地图（街景）包含到我网站的不同部分。

目前我可以在js文件中使用一个地图，但不知道如何添加第二个和第三个地图，可以使用自己的ID来调用另一个地图。下面是我的一张地图的代码，如何包含其他具有相同设置的地图？

谢谢！

var     pano;
var     latlng = new google.maps.LatLng(34.067722,-118.28681);

var panoOptions = {
    position: latlng,
        pov: {
          heading: 18.669,
          pitch: 20.072,
          zoom: 0,
        },
        addressControl:false,
        linksControl: false,
        panControl: false,
        zoomControl: false,
        enableCloseButton: false,
        fullScreenControlOptions: false
    };

pano = new google.maps.StreetViewPanorama(
    document.getElementById('streetViewIndex'), 
    panoOptions);

window.setInterval(function() {
    var pov = pano.getPov();
    pov.heading += 0.2;
    pano.setPov(pov);
}, 10);

Answer 1

一种可能的解决方案：使用类来指示要显示的元素;和一组坐标。

代码段

＆＃13;

jQuery(document).ready(function($) {

  function initialize() {
    var points = [
      new google.maps.LatLng(29.5524337, -95.0945819), // 1st div with class="streetview"
      new google.maps.LatLng(48.85837, 2.2944813),     // 2nd div with class="streetview"
      new google.maps.LatLng(40.6892494, -74.0445)
    ];
    var panoramaOptions = {
      pov: {
        heading: 0,
        pitch: 0,
        zoom: -1,
      },
      addressControl: false,
      linksControl: false,
      panControl: false,
      zoomControl: false,
      enableCloseButton: false,
      fullScreenControlOptions: false
    };
    var mapdivs = document.getElementsByClassName('streetView');
    for (var i = 0; i < mapdivs.length; i++) {
      panoramaOptions.position = points[i];
      var panorama = new google.maps.StreetViewPanorama(mapdivs[i], panoramaOptions);
    }
  }

  google.maps.event.addDomListener(window, 'load', initialize);

});

＆＃13;

.streetView {
  height: 200px;
  width: 400px;
  margin: 0px;
  padding: 0px
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maps.googleapis.com/maps/api/js"></script>
<div class="streetView"></div>
<div class="streetView"></div>
<div class="streetView"></div>

＆＃13;

一个JS文件中的多个Google地图

1 个答案: