0

我目前正在使用 Phonegap 开发移动应用程序。该应用程序的一个组件是地图视图，而不是 Google 地图，而是使用 javascript (zynga-scroller) 可滚动/可缩放的自定义图形。滚动/缩放通过translate3d和发生scale。

可滚动/可缩放图像上方的一层有图标和/或弹出框，它们不会通过比例转换，而只是translate3d坐标乘以比例。

因为在滚动/缩放时，必须为每一帧上的每个元素计算和应用计算，所以在较慢的设备上，地图会有点慢。没有图标或只有几个图标，它真的很快。

到目前为止，我有以下优化这个的想法：

  • 变换原点

    尝试将图标的坐标设置为 transformOrigin，所以我只需要在缩放时更新这些值。这不起作用，因为 transformOrigin 似乎只适用于百分比值。如果似乎没有其他可能性，我也可以计算它们。

还有什么我忽略的吗？例如，某些阻止比例应用于某些元素的属性？

4

1 回答 1

0

我不确定我是否正确解释了我的问题，但现在我找到了以下解决方案：

现在，我将所有图标与地图图像本身放在同一个容器中。当您放大到 zoomlevel0.3时，scale(0.3)将应用于容器。为了让图标保持原来的大小，我通过应用scale( 1 / zoomlevel )图标来中和比例。

这样，图标的样式只需要在缩放时重新计算，地图在速度较慢的设备上感觉更灵敏，尤其是在滚动时。

于 2013-08-12T13:38:20.410 回答