我正在尝试以 60 fps 的速度渲染滚动轴。这几乎就像更新秤的域并axisGroupElement.call(axis)
在循环中调用一样简单。不幸的是,在不同的比例下,会产生一些非常平滑的动画,其中刻度和文本会抖动。
http://jsfiddle.net/langdonx/fTcrU/11/
- 抖动可能取决于容器的宽度和刻度域的长度......尝试更改下拉菜单以获得不同的结果。
所以,我想我会很有创意,将轴渲染为我需要的大小的 3 倍,并转换整个组以获得更平滑的滚动。不幸的是,这产生了几乎相同的结果。
我更进一步,移动了整个 SVG 元素,它更平滑了一点,但是一个巨大的 hack。
还有一个问题是我无法以与重绘滚动相同的速度让我自己的变换滚动。随着时间的推移,它似乎落后了。我以为我已经通过计算每个像素的毫秒数来确定它,但这似乎并不完全正确。有趣的是,它会在某些分辨率下以 1px 滴答,存储剩余的毫秒数,然后一些滴答会将其调整为 2px。
有什么我可以做的,或者滚动这些不规则的宽度/时间跨度总是会产生不流畅的动画吗?
蒂亚!