1

我正在为建筑物的内部创建一个演练，并且想知道如何在 StreetViewPanorama 上绘制标记。也许我错过了一些基本的东西，但我读过的所有内容都表明你需要一个 lat 和 lng 来绘制标记。

这是我所拥有的：

var initPosPanoID, streetView;

    function initPano() {
      // Set StreetView provider.
      var streetViewOptions = {
        zoom: 0,
        panoProvider:  getCustomPanorama,
        pano : "lobby",
        addressControlOptions: {
              position: google.maps.ControlPosition.BOTTOM_CENTER
        }
      };

      // Create a StreetView object.
      var streetViewDiv = document.getElementById('map');
      streetView = new google.maps.StreetViewPanorama(streetViewDiv, streetViewOptions);

      // Add links when it happens "links_change" event.
      google.maps.event.addListener(streetView, "links_changed", createCustomLink);

      google.maps.event.addListener(streetView, "pano_changed", function() {
          var panoCell = document.getElementById('pano-cell');
          panoCell.innerHTML = panorama.getPano();
      });

    }

    function getCustomPanoramaTileUrl(panoID, zoom, tileX, tileY) {
      // Return a pano image given the panoID.
      return "images/he/" + panoID + '.jpg';
    }

    function getHeading(panoID) {
          var heading;
          switch(panoID) {
              case "lobby":
                  heading = 0;
                  break;
              case "secorner":    
                  heading = 100;
                  break;
          }
          return heading;
    }

    function getCustomPanorama(panoID) {

      // get a custom heading for the pano
      var heading = getHeading(panoID);

      var streetViewPanoramaData = {
        links: [],
        copyright: 'Imagery (c) HumanElement',
        tiles: {
            tileSize : new google.maps.Size(1024, 512),
            worldSize : new google.maps.Size(1024, 512),
            // The heading in degrees at the origin of the panorama
            // tile set.
            centerHeading : heading,
            getTileUrl : getCustomPanoramaTileUrl
         }
      };
      switch(panoID) {
        case "lobby":
          // Description of this point.
          streetViewPanoramaData["location"] = {
            pano: 'lobby',
            description: "Human Element",
            latLng: new google.maps.LatLng(42.282138, -83.751471)
          };
          return streetViewPanoramaData;

        case "secorner":
          streetViewPanoramaData["location"] = {
            pano: 'secorner',
            description: "SouthEast Corner",
            latLng: new google.maps.LatLng(42.282078, -83.751413)
          };
          return streetViewPanoramaData;

      }
    }

    function createCustomLink() {

      var links = streetView.getLinks();
      var panoID = streetView.getPano();

      switch(panoID) {
        case "lobby":
          links.push({
            description : "SouthEast Corner",
            pano : "secorner",
            heading : 280
          });
          break;
        case "secorner":
          links.push({
              description : "HumanElement Lobby",
              pano : "lobby",
              heading : 90
          });
          break;

      }
    }

我想在不同的位置有不同的标记或接触点，但不知道如何让它们在那里。

如果没有 lat/lng，尝试绘制标准标记是行不通的。

我考虑过尝试围绕 google.maps.Point 创建它，我想我也许可以使用我的瓷砖中的 x 和 y，但似乎无法让它发挥作用。

我看到的其他选项与 google.maps.drawing.DrawingManager 有关。

有人对此有什么建议吗？

4

1 回答 1

0

以这种方式设置地图有帮助：它分别创建地图和全景图，然后将全景图设置到地图中，而不仅仅是拥有全景图对象。

map = new google.maps.Map(document.getElementById('map'), {
            center: position,
            zoom: 10
        });
        // Create the panorama and set it into the map
        panorama = new google.maps.StreetViewPanorama(
            document.getElementById('map'), {
                position: position,
                pov: {
                    heading: 0,
                    pitch: -10
                },
                // Override the default panoId to outside the building to start
                pano:'e_giRekRylYAAAQn7y2xAg'
        });
        map.setStreetView(panorama);

为了在地图上放置标记，我找到了一个出色的插件，它可以创建点然后在这些点上放置元素。

https://github.com/marmat/google-maps-api-addons/tree/master/panomarker

到目前为止，这工作得很好。如果您有内部演练，您应该能够根据 PanoId 切换标记。您甚至可以添加点击侦听器来打开对话框。

于 2015-10-23T15:55:12.353 回答