为什么 StreetView JS API 不能正确镜像 StreetView 静态 API？答案

【问题标题】：Why is StreetView JS API not correctly mirroring StreetView Static API?为什么 StreetView JS API 不能正确镜像 StreetView 静态 API？
【发布时间】：2012-04-10 23:52:35
【问题描述】：

我正在尝试使用 JS StreetView API 让用户选择他们希望用于静态 StreetView 图像的视图。我已经在我的sandbox 实例上构建了一个基本测试（以及下面的以供将来使用）。

当页面首次加载时，StreetView 视口会加载，反映该视口的静态图像也会正确加载。如果我在没有我的位置的情况下平移，静态图像会正确更新。

我正在使用对pov_changed、position_changed 和visible_changed 事件的调用来调用静态图像的更新。我在这些事件的触发之间延迟了半秒，以免引发配额错误。

我的问题是： 如果我使用任何“clickToGo”操作来更改我的位置，我的静态 StreetView 中显示的位置（纬度/经度）不会正确反映 JS StreetView 视口。据我所知，pov（fov/zoom、heading、pitch）都是正确的，但我的位置不正确。

<!DOCTYPE html>
<html>
    <head>
        <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
        <script type="text/javascript">

          function initialize() {
            var panorama = new google.maps.StreetViewPanorama(document.getElementById("pano"), {
              position: new google.maps.LatLng(42.345573,-71.098326),
              pov: {
                heading: 34,
                pitch: 10,
                zoom: 1
              }
            });

            /**
             * Build static URL from streetview JS instance settings
             */
            function getStaticUrl(secure) {
                secure = (secure) ? 's' : '';
                var latlng = panorama.getPosition();
                var pov = panorama.getPov();
                var url = "http" + secure + "://maps.googleapis.com/maps/api/streetview?size=500x400&location=" + encodeURIComponent(latlng.lat() + ", " + latlng.lng()) + "&fov=" + (180 / Math.pow(2, pov.zoom)) + "&heading=" + encodeURI(pov.heading) + "&pitch=" + encodeURI(pov.pitch) + "&sensor=false";
                console.log("lat: " + latlng.lat() + "     " + "lng: " + latlng.lng());
                console.log("img src: " + url);
                return url;
            }

            /**
             * To stop overusing quota errors with the static streetview API, wait half a second after streetview has stopped moving to
             * update image preview.
             */
            var _updateStreetViewWait = 0;
            var _handleStreetViewPovChange = function() {
                clearTimeout(_updateStreetViewWait);
                _updateStreetViewWait = setTimeout(function() {
                    var linkUrl = getStaticUrl();
                    $('#link').html("<a target='_blank' href='" + linkUrl + "'><img src='" + linkUrl + "'/></a>");
                }, 500);
            };
            google.maps.event.addListener(panorama, 'pov_changed', _handleStreetViewPovChange);
            google.maps.event.addListener(panorama, 'position_changed', _handleStreetViewPovChange);
            google.maps.event.addListener(panorama, 'visible_changed', _handleStreetViewPovChange);
          }
        </script>
    </head>
    <body onload="initialize()">
      <div id="pano" style="width: 500px; height: 400px"></div>
      <div id="link" style="width:100%; height: 2%"></div>
    </body>
</html>

【问题讨论】：

为了解决我的问题，将问题标记为“不具建设性”的人能否告诉我如何将我的问题重新表述为适当的问题？
两种不同的 API 使用不同的投影系统。 JS API 根据浏览器使用不同的投影，所以不会排成一行。
该死，我也这么想，但觉得我会把问题放在那里。因为这是正确的答案，如果你把它作为答案，我会标记它是正确的。反正我好像没被咬过。

标签： javascript google-maps-api-3 google-static-maps google-street-view

【解决方案1】：

这两种不同的 API 使用不同的投影系统。 JS API 根据浏览器使用不同的投影，所以不会排成一行

【讨论】：