缩放/缩放 Div 后在 Google Maps API v3 上使用绘图管理器？

Question

我一直在尝试使用谷歌地图 API V3 的绘图管理器（绘制矩形）来解决问题。使用 -webkit-transform 缩放谷歌地图画布（包含 div）后 像这样

 var transform = ['scale(' + 0.5 + ')'];
 $("#map_canvas").css('-webkit-transform', transform.join(' '));

我开始绘制矩形的点似乎在地图上移位了。我所说的被移位的意思是绘制矩形的预期位置以某种方式被偏移量移位。最终结果是矩形出现在其他地方。我知道矩形的这种位移是由于 div 的缩放。有人可以帮助我解决这个问题并让绘图管理器即使在缩放后也能正常工作？如果您有更多问题，请告诉我。提前感谢您的帮助。

Answer 1

首先，您可以通过提供动态高度和宽度（以百分比表示）来完全避免缩放。

因此，如果您想在 80% 的可视区域中显示地图 div，您可以通过以下方式实现 -

<div id="MAP_DIV" style="height:80%;width:80%;"></div>

这可以避免缩放问题，从而避免“偏移偏移”问题。

但我强烈建议您将内联样式移到单独的 .css 文件中，以实现可重用性和代码维护。

希望对你有帮助。