通过重用基本的贝塞尔曲线函数绘制贝塞尔曲线的一部分？ [英] Drawing part of a Bézier curve by reusing a basic Bézier-curve-function?
问题描述
假设我使用了一些图形API，它允许我通过指定4个必要点来绘制
bezier曲线：
开始，结束，两个控制点。
我可以重复使用此功能以绘制<原始>曲线
的x％控制点和终点）？
或者是不可能的？
不必要的信息，应该有人在乎：
- 我需要绘制原始图片的每个n％ $ b bezier曲线
使用不同的颜色和/或线条样式 我使用Java的Path2D绘制贝塞尔曲线： em>
Path2D p = new GeneralPath（）;
p.moveTo（x1，y1）;
p.curveTo（bx1，by1，bx2，by2，x2，y2）;
g2.draw（p）;
您需要的是 De Casteljau算法。这将允许你将你的曲线分割成你想要的任何部分。然而，由于你只处理三次曲线，所以我想建议稍微容易使用的公式会给你一段从 t0 到 t1 的区段，其中 0 < = t0< = t1< = 1< / code> ;.这里有一些伪代码：
u0 = 1.0 - t0
u1 = 1.0 - t1
qxa = x1 * u0 * u0 + bx1 * 2 * t0 * u0 + bx2 * t0 * t0
qxb = x1 * u1 * u1 + bx1 * 2 * t1 * u1 + bx2 * t1 * t1
qxc = bx1 * u0 * u0 + bx2 * 2 * t0 * u0 + x2 * t0 * t0
qxd = bx1 * u1 * u1 + bx2 * 2 * t1 * u1 + x2 * t1 * t1
qya = y1 * u0 * u0 + by1 * 2 * t0 * u0 + by2 * t0 * t0
qyb = y1 * u1 * u1 + by1 * 2 * t1 * u1 + by2 * t1 * t1
qyc = by1 * u0 * u0 + by2 * 2 * t0 * u0 + y2 * t0 * t0
qyd = by1 * u1 * u1 + by2 * 2 * t1 * u1 + y2 * t1 * t1
xa = qxa * u0 + qxc * t0
xb = qxa * u1 + qxc * t1
xc = qxb * u0 + qxd * t0
xd = qxb * u1 + qxd * t1
ya = qya * u0 + qyc * t0
yb = qya * u1 + qyc * t1
yc = qyb * u0 + qyd * t0
yd = qyb * u1 + qyd * t1
然后只画出由（xa，ya），（xb，yb），（xc，yc） code>和（xd，yd）。
请注意 t0 和 t1 不完全是曲线距离的百分比，而是曲线参数空间。如果你一定有距离，那么事情就会变得更加困难。试试看看它是否满足你的需求。
编辑：值得注意的是，如果 t0 或 t1 是0或1（即您只想修剪一侧）。
另外，关系 0 <= t0 <= t1 <= 1 并不是一个严格的要求。例如 t0 = 1 和 t1 = 0 可用于向后翻转曲线，或<$ c可以使用$ c> t0 = 0 和 t1 = 1.5 来延伸曲线，使其超过原始末端。但是，如果您尝试将其延伸超过 [0,1] 范围，则曲线可能与您预期的不同。
编辑2：我的原始答案超过3年后，MvG指出我的方程中有一个错误。我忘了最后一步（额外的线性插值来获得最终的控制点）。上面的公式已经被修正。
Assuming I'm using some graphic API which allows me to draw bezier curves by specifying the 4 necessary points: start, end, two control points.
Can I reuse this function to draw x percent of the 'original' curve (by adjusting the control points and the end point)?
Or is it impossible?
Unnecessary information, should someone care:
- I need the whole thing to draw every n % of the original
bezier curve with different color and/or line style I'm using Java's Path2D to draw bezier curves:
Path2D p = new GeneralPath(); p.moveTo(x1, y1); p.curveTo(bx1, by1, bx2, by2, x2, y2); g2.draw(p);
What you need is the De Casteljau algorithm. This will allow you to split your curve into whatever segments you'd like.
However, since you're dealing with just cubic curves, I'd like to suggest a slightly easier to use formulation that'll give you a segment from t0 to t1 where 0 <= t0 <= t1 <= 1. Here's some pseudocode:
u0 = 1.0 - t0
u1 = 1.0 - t1
qxa = x1*u0*u0 + bx1*2*t0*u0 + bx2*t0*t0
qxb = x1*u1*u1 + bx1*2*t1*u1 + bx2*t1*t1
qxc = bx1*u0*u0 + bx2*2*t0*u0 + x2*t0*t0
qxd = bx1*u1*u1 + bx2*2*t1*u1 + x2*t1*t1
qya = y1*u0*u0 + by1*2*t0*u0 + by2*t0*t0
qyb = y1*u1*u1 + by1*2*t1*u1 + by2*t1*t1
qyc = by1*u0*u0 + by2*2*t0*u0 + y2*t0*t0
qyd = by1*u1*u1 + by2*2*t1*u1 + y2*t1*t1
xa = qxa*u0 + qxc*t0
xb = qxa*u1 + qxc*t1
xc = qxb*u0 + qxd*t0
xd = qxb*u1 + qxd*t1
ya = qya*u0 + qyc*t0
yb = qya*u1 + qyc*t1
yc = qyb*u0 + qyd*t0
yd = qyb*u1 + qyd*t1
Then just draw the Bézier curve formed by (xa,ya), (xb,yb), (xc,yc) and (xd,yd).
Note that t0 and t1 are not exactly percentages of the curve distance but rather the curves parameter space. If you absolutely must have distance then things are much more difficult. Try this out and see if it does what you need.
Edit: It's worth noting that these equations simplify quite a bit if either t0 or t1 is 0 or 1 (i.e. you only want to trim from one side).
Also, the relationship 0 <= t0 <= t1 <= 1 isn't a strict requirement. For example t0 = 1 and t1 = 0 can be used to "flip" the curve backwards, or t0 = 0 and t1 = 1.5 could be used to extend the curve past the original end. However, the curve might look different than you expect if you try to extend it past the [0,1] range.
Edit2: More than 3 years after my original answer, MvG pointed out an error in my equations. I forgot the last step (an extra linear interpolation to get the final control points). The equations above have been corrected.
这篇关于通过重用基本的贝塞尔曲线函数绘制贝塞尔曲线的一部分？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
