javascript - 谷歌地图 v3 fitBounds() 边界，填充 :number not working

Question

我正在尝试了解 fitBounds() 方法的填充选项的确切作用。

map.fitBounds(bounds, 100);

根据此处的文档，据说选项 100 会添加填充(至少我是这样读的): https://developers.google.com/maps/documentation/javascript/reference

但我已经添加了各种数字，但似乎什么也得不到(在我的使用项目中)，除非它以 100 为增量，这太多了。我设置了一个 JS fiddle 来显示填充选项的功能:http://fiddle.jshell.net/sc9bc4ab/

它们似乎在每个实现中都不同，但是一旦您达到某个数值，它们就会出现相同的“跳跃”问题。

我的问题是填充选项实际上做了什么？看起来很不协调。如果它是 10 或 20 或 30 在 fiddle 上它似乎保持不变，当你击中 40 东西跳。我也尝试过 {padding:50} 或 {padding:[50,50]} 只是关于这个特定问题的信息不多。

Answer 1

Google Maps API 实现了一个谨慎的缩放级别系统(点击放大/缩小按钮，您会注意到 map 跳跃了相当大的数量)。

API 可以使用两种方法来确保 map 中显示特定的边界框:

1. 调整 map 元素的大小 - 这可能会扰乱您的页面布局，因此是一个糟糕的选择。

2. 使 map 在边界上居中，然后在 map 元素的大小范围内选择“最适合”该边界框的缩放级别。 这是 API 的作用。

您看到的效果是，当您使用 40 的填充时 map 会跳动，这是因为这是最小的填充量，会导致缩放级别改变一个完整的整数值。由于 API 不支持分数缩放，因此小于此数量的任何内容都不会导致 map 外观发生变化。