2011-03-29 147 views
1

我正在完成一个使用OpenGL ES 2.0(WebGL)和JS的绘图应用程序。除非我以非常迅速的动作画画,否则事情会非常顺利。见下图:实现鼠标平滑的最有效方式

Faceted loop

这个循环被吸引了平滑的运动,但由于JS只能够获得在特定位置的鼠标读数,结果被刻面。如果您关闭了鼠标平滑功能,Photoshop在某种程度上会发生这种情况,但显然要少得多,因为PS能够以更高的速度进行轮询。因此,我想实现一些鼠标平滑,但我担心确保它非常高效,以避免陷入实际的像素绘制操作。我最初想到的是使用JS能够抓取的鼠标位置来生成样条线并在读数之间进行插值以获得更平滑的结果。不过,我不确定这是否是最好的方法。如果是,我如何确保在中间样条上采样正确的位置?我发现的大多数样条方程不具有t = [0, 1]的统一分布值。

任何帮助/指导/意见将不胜感激。谢谢!

回答

2

Catmull-Rom可能是一个很好的尝试,如果你还没有。

http://www.mvps.org/directx/articles/catmull/

我会选择一个最小段长度和瓜分上超过该成1 + segmentLength/minSegmentLength子段的段。

+0

我实际上为此玩了一下Catmull-Rom样条曲线,但是我无法让间隔工作良好。问题是你可以控制方程中的t来获得一个新的点,但t的值0.5不一定(或者甚至典型地)在两个端点之间。除非我错过了一些东西,否则我想我将不得不做一个二分法搜索,以便沿着样条线为每个子分段移动适当的距离? – Xenethyl 2011-03-29 07:51:55

+0

t = 0.5的点应在两点之间的路径中途。这并不一定是在点之间的中点附近,但这是非常正常的。样条上的点不会在任何样条上均匀分布,除非意外。尽管您可以尽量减少对以切线为参数的样条曲线的影响,但这是以牺牲显着不同的曲线形式为代价的。为了插入一些手绘草图,简单的Catmull-Rom通常是完全足够的。它是众所周知的,经过了充分测试,并且“正常工作”。 – Damon 2011-03-29 11:28:27

+0

@Damon t = 0.5时的点不会在两点之间的路径上一半。 t参数根本不与弧长相关。为了选择合适的t值,使得插值点沿着曲线均匀分布,必须使用另一个函数重新设置参数。这种重新参数化并不便宜,所以我一直在寻找替代品。话虽如此,我认为我可以估计一个可接受的步进值,如果它太小,就抛出过多的值。我会将其标记为已接受 - 感谢讨论人员。 – Xenethyl 2011-03-29 17:29:54