如何缩放贝塞尔曲线(使用HTML5画布)?

4
我有一个Bezier路径,存储为包含多个点的数组,每个点都是形如[cp1x,cp1y,cp2x,cp2y,x,y]的坐标数组。
我希望能够缩放该路径以调整其大小,但我不知道如何进行数学计算。我试图将系数应用于每个坐标值,但这似乎没有起作用。
有人知道如何实现吗?

当你进行缩放时,曲线的哪一部分会保持固定不动,是其中一个端点还是中心? - SpacedMonkey
我没有什么具体的想法,但我会假设是居中。 - Thomas
1个回答

2
在标准表示法中,点P表示空间中的实际点,因此您可以像其他点一样移动它们。为了缩放它们,只需用比例因子乘以全部内容:假设它是a,那么就会变成[a*cp1x,a*cp1y,a*cp2x,a*cp2y,a*x,a*y],或者如果您想分别缩放xy,则可以为xy组件使用不同的因子。
还要注意,这将相对于原点(x=0, y=0)来缩放内容,因此如果您没有任何曲线在原点上,则可能看起来像是移位。如果要否定此移位的影响,则可以从xy值中分别减去PxPy,其中PxPy是您希望在缩放时不移动的点(如果您想要的话,在乘以之后再加回来)。但如果您要缩放整个画布,例如从5英寸乘以5英寸到7英寸乘以7英寸,则需要进行没有移位的乘法(在这种情况下,乘以7./5)。

请问,对于不在原点的贝塞尔曲线进行等比缩放的公式是什么: 将移动到x=5,y=6的原点 定义函数f(a, cpX, x) = (a * (x-cpXx))+x 因此[使用虚拟值] [f(a, 1, 5), f(a, 4, 6 ), f(a, 8, 5), f(a, 10, 6), f(a, 14, 5), f(a, 14, 6)]我正在尝试在一个自身按比例缩放到屏幕大小的上下文中绘制一系列曲线。当上下文重新缩放时,我希望曲线以屏幕面积的百分比(在这种情况下为变量a)进行缩放。这些对象以这种格式进行缩放,但它们也会略微移动。 - Cristian Cavalli
我实际上是指:f(a, cpX, x) = (a * (x-cpX))+x(从cpX中取出了一个额外的x)。 Stack Overflow不允许我编辑我的评论。 - Cristian Cavalli
@CristianCavalli:我不完全理解你的问题/评论。最好单独提出一个问题,这样你可以举例说明,进行编辑等操作。 - tom10

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接