Google Maps Api - map.panto(latlng) 何时平滑

Question

编辑： 我正在尝试计算 Google Maps API map.panTo(Lat, Lng) 何时决定行程对于“平滑”平移来说太远（像素）。

这就是手册所说的： -

将地图的中心更改为给定的 LatLng。如果变化小于地图的宽度和高度，过渡将平滑地进行动画处理。

我已经确定，如果只有 x 或 y 顶点移动（只有 Lat 或 Lng 值发生变化，但不是两者都发生变化），那么检查的只是地图视口宽度或高度的三分之二 0.6666。但如果 Lat 和 Lng 值都发生变化，那么我不确定公式。

我们所知道的一个例子： -

如果我们从珀斯前往耶蓬附近的某个地方： -

珀斯：纬度：-31.9523 经度：115.8613 x像素：13465 y像素：9728 Yeppoon：纬度：-22.9523 经度：150.2093 xPixel 15028，yPixel：9265

X/垂直移动：15028 - 13465 = 1563 Y/水平移动：9265 - 9728 = -463

然后，对于同一行程，以下视口尺寸会产生平滑的平移；宽度或高度小于 1 像素会强制进行硬平移： -

视口

宽度：1337 1435 1236 高度：492 448 574

视口平移边界线的公式是什么？

它应该是显而易见的，但我只是看不到它

我拥有的唯一其他信息是： -

零缩放时的 Google 标题大小 = 256 我使用的缩放是 6 = 乘数 64

X 像素公式 = 256 * (0.5 + 经度 / 360) * 64

let siny = Math.sin((Latitude * Math.PI) / 180); // 截断为 0.9999 有效地将纬度限制为 89.189。这是 // 大约超过世界图块边缘三分之一的图块。 siny = Math.min(Math.max(siny, -0.9999), 0.9999);

Y 像素公式 = 256 * (0.5 - Math.log((1 + siny) / (1 - siny)) / (4 * Math.PI))

有道理吗？

编辑

请复制 https://richardmaher.github.io/Brotkrumen/testmap.html如果它使生活更轻松（由于 API 密钥必须在本地运行）

请参阅控制台以获取调试信息。

将浏览器缩小到宽度 615 像素，您将平滑滚动/平移停止。

准备好回答任何其他问题

另请参阅 https://issuetracker.google.com/issues/228349799

有人可以用伪代码或至少不太含糊的语言解释 panTo() 方法平滑过渡要求的 API 参考手册定义：-

平移平移(latLng) 参数： latLng: LatLng|LatLngLiteral 地图的新中心纬度/经度。 返回值：无 将地图的中心更改为给定的 LatLng。 如果变化较小 比地图的宽度和高度都大，过渡会很平滑 动画。

具体而言，在这种情况下“变化”是什么？

示例： -

Zoom Level = 6
LatLng1 = lat: -31.9523, lng: 115.8613 Pixel X = 13464 Pixel Y = 9728
LatLng2 = lat: -33.8688, lng: 151.2093 Pixel X = 15073 Pixel Y = 9831
Current Map Center is LatLng1 and panning to LatLng2
I make the "change" to be horizontal 1609px and vertical 103px

如果地图的 DIV 容器至少有 616 像素宽和 344 像素高，则平移是平滑的，否则会跳跃。

有人可以帮我启发式地将这些数字与算法结合起来吗？

Answer 1

panTo() 更改地图的中点，如果中点的坐标在视口内发生变化，过渡将呈现平滑的动画效果。

视口包含用于显示返回结果的推荐视口，指定为定义视口边界框的西南角和东北角的两个纬度、经度值。通常，视口用于在向用户显示结果时构建结果。

Answer 2

好吧，我认为具体问题的答案只是四舍五入，但我不需要追逐这个问题，因为在上个月左右的时间里，谷歌已经将标记的重新归位与平滑泛测试脱钩了。现在，在停止维护标记的 DOM 之前，它是任意 100000px 限制。

完整的故事可以在此处找到（请记住，由于 API 密钥硬编码，您需要在尝试运行之前将 testmap.html 复制到本地文件系统。）

TL;DR 版本和核心逻辑在此函数中：-

    function makeDestCenter(){
        console.log("Panning to new Center " + map.getZoom());
        var home = map.getCenter();
        var zoom = map.getZoom();
        var scale = 1 << zoom;  
        var proj = map.getProjection();
        
        var homePoint =  proj.fromLatLngToPoint(home);  
        var startPixelX = Math.round(homePoint.x * scale);
        var startPixelY = Math.round(homePoint.y * scale);

        var destPoint =  proj.fromLatLngToPoint(dest[destIndex]);
        var destPixelX = Math.round(destPoint.x * scale);
        var destPixelY = Math.round(destPoint.y * scale);
        var xTrip = Math.abs(destPixelX - startPixelX);
        var yTrip = Math.abs(destPixelY - startPixelY);

        console.log("sX " + startPixelX + " dX " + destPixelX + " sY " + startPixelY + " dY " + destPixelY);

        if ((xTrip > MAX_TRIP) || (yTrip > MAX_TRIP)) {
            google.maps.event.addListenerOnce(map, 'idle', makeDestCenter);
            map.setZoom(--zoom);
        } else {
            if (xTrip == TOO_SMALL && yTrip == TOO_SMALL) {
                google.maps.event.addListenerOnce(map, 'idle', makeDestCenter);
                map.setZoom(++zoom);
            } else {
                map.panTo(dest[destIndex]);
            }
        }
    }