1
0
mirror of https://github.com/Pomax/BezierInfo-2.git synced 2025-08-18 14:31:24 +02:00

full regeneration

This commit is contained in:
Pomax
2021-02-28 12:28:41 -08:00
parent d8fab98ec7
commit 45394f6d0f
329 changed files with 3135 additions and 2361 deletions

View File

@@ -32,19 +32,19 @@ These three values A, B, and C allow us to derive an important identity formula
So, how can we compute `C`? We start with our observation that `C` always lies somewhere between the start and end points, so logically `C` will have a function that interpolates between those two coordinates:
\[
C = u(t) \cdot P_{start} + (1-u(t)) \cdot P_{end}
C = u(t) \cdot P_{\textit{start}} + (1-u(t)) \cdot P_{\textit{end}}
\]
If we can figure out what the function `u(t)` looks like, we'll be done. Although we do need to remember that this `u(t)` will have a different form depending on whether we're working with quadratic or cubic curves. [Running through the maths](https://mathoverflow.net/questions/122257/finding-the-formula-for-bezier-curve-ratios-hull-point-point-baseline) (with thanks to Boris Zbarsky) shows us the following two formulae:
\[
u(t)_{quadratic} = \frac{(1-t)^2}{t^2 + (1-t)^2}
u(t)_{\textit{quadratic}} = \frac{(1-t)^2}{t^2 + (1-t)^2}
\]
And
\[
u(t)_{cubic} = \frac{(1-t)^3}{t^3 + (1-t)^3}
u(t)_{\textit{cubic}} = \frac{(1-t)^3}{t^3 + (1-t)^3}
\]
So, if we know the start and end coordinates and the *t* value, we know C without having to calculate the `A` or even `B` coordinates. In fact, we can do the same for the ratio function. As another function of `t`, we technically don't need to know what `A` or `B` or `C` are. It, too, can be expressed as a pure function of `t`.
@@ -52,25 +52,25 @@ So, if we know the start and end coordinates and the *t* value, we know C withou
We start by observing that, given `A`, `B`, and `C`, the following always holds:
\[
ratio(t) = \frac{distance(B,C)}{distance(A,B)} = Constant
\textit{ratio}(t) = \frac{\textit{distance}(B,C)}{\textit{distance}(A,B)} = \textit{Constant}
\]
Working out the maths for this, we see the following two formulae for quadratic and cubic curves:
\[
ratio(t)_{quadratic} = \left | \frac{t^2 + (1-t)^2 - 1}{t^2 + (1-t)^2} \right |
ratio(t)_{\textit{quadratic}} = \left | \frac{t^2 + (1-t)^2 - 1}{t^2 + (1-t)^2} \right |
\]
And
\[
ratio(t)_{cubic} = \left | \frac{t^3 + (1-t)^3 - 1}{t^3 + (1-t)^3} \right |
ratio(t)_{\textit{cubic}} = \left | \frac{t^3 + (1-t)^3 - 1}{t^3 + (1-t)^3} \right |
\]
Which now leaves us with some powerful tools: given three points (start, end, and "some point on the curve"), as well as a `t` value, we can _construct_ curves. We can compute `C` using the start and end points and our `u(t)` function, and once we have `C`, we can use our on-curve point (`B`) and the `ratio(t)` function to find `A`:
\[
A = B - \frac{C - B}{ratio(t)} = B + \frac{B - C}{ratio(t)}
A = B - \frac{C - B}{\textit{ratio}(t)} = B + \frac{B - C}{\textit{ratio}(t)}
\]
With `A` found, finding `e1` and `e2` for quadratic curves is a matter of running the linear interpolation with `t` between start and `A` to yield `e1`, and between `A` and end to yield `e2`. For cubic curves, there is no single pair of points that can act as `e1` and `e2`: as long as the distance ratio between `e1` to `B` and `B` to `e2` is the Bézier ratio `(1-t):t`, we can reverse engineer `v1` and `v2`:
@@ -86,8 +86,8 @@ And then reverse engineer the curve's control points:
\[
\left \{ \begin{aligned}
C_1' &= start + \frac{v_1 - start}{t} \\
C_2' &= end + \frac{v_2 - end}{1 - t}
C_1' &= \textit{start} + \frac{v_1 - \textit{start}}{t} \\
C_2' &= \textit{end} + \frac{v_2 - \textit{end}}{1 - t}
\end{aligned} \right .
\]

View File

@@ -9,7 +9,7 @@ How long is a Bézier curve? As it turns out, that's not actually an easy questi
or, more commonly written using Leibnitz notation as:
\[
length = \int_{0}^{z}\sqrt{ \left (dx/dt \right )^2+\left (dy/dt \right )^2} dt
\textit{length} = \int_{0}^{z}\sqrt{ \left (dx/dt \right )^2+\left (dy/dt \right )^2} dt
\]
This formula says that the length of a parametric curve is in fact equal to the **area** underneath a function that looks a remarkable amount like Pythagoras' rule for computing the diagonal of a straight angled triangle. This sounds pretty simple, right? Sadly, it's far from simple... cutting straight to after the chase is over: for quadratic curves, this formula generates an [unwieldy computation](https://www.wolframalpha.com/input/?i=antiderivative+for+sqrt((2*(1-t)*t*B+%2B+t%5E2*C)%27%5E2+%2B+(2*(1-t)*t*E)%27%5E2)&incParTime=true), and we're simply not going to implement things that way. For cubic Bézier curves, things get even more fun, because there is no "closed form" solution, meaning that due to the way calculus works, there is no generic formula that allows you to calculate the arc length. Let me just repeat this, because it's fairly crucial: ***for cubic and higher Bézier curves, there is no way to solve this function if you want to use it "for all possible coordinates"***.
@@ -24,12 +24,12 @@ So we turn to numerical approaches again. The method we'll look at here is the [
\int_{-1}^{1}f(t) dt
\simeq
\left [
\underset{strip~1}{ \underbrace{ C_1 \cdot f\left(t_1\right) }}
\underset{\textit{strip 1}}{ \underbrace{ C_1 \cdot f\left(t_1\right) }}
~+~...
~+~\underset{strip~n}{ \underbrace{ C_n \cdot f\left(t_n\right) }}
~+~\underset{\textit{strip n}}{ \underbrace{ C_n \cdot f\left(t_n\right) }}
\right ]
=
\underset{strips~1~through~n}{
\underset{\textit{strips 1 through n}}{
\underbrace{
\sum_{i=1}^{n}{
C_i \cdot f\left(t_i\right)

View File

@@ -16,7 +16,7 @@ Thankfully, much like as was the case for Bézier curves, the derivative of a B-
where
\[
P_i \prime = \frac{d}{knot_{i+d+1} - knot_{i+1}} (P_{i+1} - P_i)
P_i \prime = \frac{d}{\textit{knot}_{i+d+1} - \textit{knot}_{i+1}} (P_{i+1} - P_i)
\]
@@ -28,7 +28,7 @@ As a concrete example, let's look at cubic (=degree 3) B-Spline with five coordi
\begin{array}{l}
d = 3, \\
P = {(50,240), (185,30), (320,135), (455,25), (560,255)}, \\
knots = {0,1,2,3,4,5,6,7,8}
\textit{knots} = {0,1,2,3,4,5,6,7,8}
\end{array}
\]
@@ -38,20 +38,20 @@ Applying the above knowledge, we end up with a new B-Spline of degree <em>d-1</e
\[
\begin{array}{l}
P_0 \prime = \frac{d}{knot_{i+d+1} - knot_{i+1}} (P_{i+1} - P_i)
= \frac{3}{knot_{4} - knot_{1}} (P_1 - P_0)
P_0 \prime = \frac{d}{\textit{knot}_{i+d+1} - \textit{knot}_{i+1}} (P_{i+1} - P_i)
= \frac{3}{\textit{knot}_{4} - \textit{knot}_{1}} (P_1 - P_0)
= \frac{3}{3} (P_1 - P_0)
= (135, -210) \\
P_1 \prime = \frac{d}{knot_{i+d+1} - knot_{i+1}} (P_{i+1} - P_i)
= \frac{3}{knot_{5} - knot_{2}} (P_2 - P_1)
P_1 \prime = \frac{d}{\textit{knot}_{i+d+1} - \textit{knot}_{i+1}} (P_{i+1} - P_i)
= \frac{3}{\textit{knot}_{5} - \textit{knot}_{2}} (P_2 - P_1)
= \frac{3}{3} (P_2 - P_1)
= (135, 105) \\
P_2 \prime = \frac{d}{knot_{i+d+1} - knot_{i+1}} (P_{i+1} - P_i)
= \frac{3}{knot_{6} - knot_{3}} (P_3 - P_2)
P_2 \prime = \frac{d}{\textit{knot}_{i+d+1} - \textit{knot}_{i+1}} (P_{i+1} - P_i)
= \frac{3}{\textit{knot}_{6} - \textit{knot}_{3}} (P_3 - P_2)
= \frac{3}{3} (P_3 - P_2)
= (135, -110) \\
P_3 \prime = \frac{d}{knot_{i+d+1} - knot_{i+1}} (P_{i+1} - P_i)
= \frac{3}{knot_{7} - knot_{4}} (P_4 - P_3)
P_3 \prime = \frac{d}{\textit{knot}_{i+d+1} - \textit{knot}_{i+1}} (P_{i+1} - P_i)
= \frac{3}{\textit{knot}_{7} - \textit{knot}_{4}} (P_4 - P_3)
= \frac{3}{3} (P_4 - P_3)
= (105, 230) \\
\end{array}
@@ -63,7 +63,7 @@ So, we end up with a derivative that has as parameters:
\begin{array}{l}
d = 3, \\
P = {(50,240), (185,30), (320,135), (455,25), (560,255)}, \\
knots = {0,1,2,3,4,5,6,7,8}
\textit{knots} = {0,1,2,3,4,5,6,7,8}
\end{array}
\]

View File

@@ -40,15 +40,21 @@ Doing so for a degree `d` B-Spline with `n` control point gives us `d + n + 1` k
Then the N() function itself. What does it look like?
\[
N_{i,k}(t) = \left ( \frac{t-knot_i}{knot_{(i+k-1)} - knot_i}\right ) \cdot N_{i,k-1}(t) + \left ( \frac{knot_{(i+k)}-t}{knot_{(i+k)} - knot_{(i+1)}} \right ) \cdot N_{i+1,k-1}(t)
N_{i,k}(t) =
\left ( \frac{t-\textit{knot}_i}{\textit{knot}_{(i+k-1)} - \textit{knot}_i}\right )
\cdot
N_{i,k-1}(t) +
\left ( \frac{\textit{knot}_{(i+k)}-t}{\textit{knot}_{(i+k)} - \textit{knot}_{(i+1)}} \right )
\cdot
N_{i+1,k-1}(t)
\]
So this is where we see the interpolation: N(t) for an `(i,k)` pair (that is, for a step in the above summation, on a specific knot interval) is a mix between N(t) for `(i,k-1)` and N(t) for `(i+1,k-1)`, so we see that this is a recursive iteration where `i` goes up, and `k` goes down, so it seem reasonable to expect that this recursion has to stop at some point; obviously, it does, and specifically it does so for the following `i`/`k` values:
\[
N_{i,1}(t) = \left\{\begin{matrix}
1& \text{if } t \in [knot_i,knot_{i+1}) \\
0& \text{otherwise}
1 & \textit{if } t \in [\textit{knot}_i,\textit{knot}_{i+1}) \\
0 & \textit{otherwise}
\end{matrix}\right.
\]
@@ -68,7 +74,7 @@ People far smarter than us have looked at this work, and two in particular — [
This is another recursive function, with *k* values decreasing from the curve order to 1, and the value *α* (alpha) defined by:
\[
\alpha_{i,k} = \frac{t - knots[i]}{knots[i+1+n-k] - knots[i]}
\alpha_{i,k} = \frac{t - \textit{knots}[i]}{\textit{knots}[i+1+n-k] - \textit{knots}[i]}
\]
That looks complicated, but it's not. Computing alpha is just a fraction involving known, plain numbers. And, once we have our alpha value, we also have `(1-alpha)` because it's a trivial subtraction. Computing the `d()` function is thus mostly a matter of computing pretty simple arithmetical statements, with some caching of results so we can refer to them as we recurve. While the recursion might see computationally expensive, the total algorithm is cheap, as each step only involves very simple maths.
@@ -78,8 +84,8 @@ Of course, the recursion does need a stop condition:
\[
d^k_0(t) = 0, ~d^0_i(t) = N_{i,1}(t) =
\left\{\begin{matrix}
1& \text{if } t \in [knot_i,knot_{i+1}) \\
0& \text{otherwise}
1 & \textit{if } t \in [\textit{knot}_i,\textit{knot}_{i+1}) \\
0 & \textit{otherwise}
\end{matrix}\right.
\]

View File

@@ -203,7 +203,7 @@ T_4 =
And this generates our final set of four coordinates. Of these, we already know that points 1 through 3 are (0,0), (0,1) and (1,1), and only the last coordinate is "free". In fact, given any four starting coordinates, the resulting "transformation mapped" coordinate will be:
\[
mapped_4 = \left (
\textit{mapped}_4 = \left (
\begin{matrix}
x \\
y

View File

@@ -25,7 +25,7 @@ Now, it may look like Catmull-Rom curves are very different from Bézier curves,
V'_1 &= \frac{P_3 - P_1}{2} \\
V'_2 &= \frac{P_4 - P_2}{2}
\end{array}
\right ]_{point-tangent}
\right ]_{\textit{point-tangent}}
\]
One downside of this is that—as you may have noticed from the graphic—the first and last point of the overall curve don't actually join up with the rest of the curve: they don't have a previous/next point respectively, and so there is no way to calculate what their tangent should be. Which also makes it rather tricky to fit a Catmull-Rom curve to three points like we were able to do for Bézier curves. More on that in [the next section](#catmullfitting).
@@ -64,7 +64,7 @@ The main difference between Catmull-Rom curves and Bézier curves is "what the p
Those are _very_ similar, so let's see exactly _how_ similar they are. We've already see the matrix form for Bézier curves, so how different is the matrix form for Catmull-Rom curves?:
\[
CatmullRom(t) =
\textit{CatmullRom}(t) =
\begin{bmatrix}
1 & t & t^2 & t^3
\end{bmatrix}
@@ -178,7 +178,7 @@ However, we're not <em>quite</em> done, because Catmull-Rom curves have that "te
With the mapping matrix properly done, let's rewrite the "point + tangent" Catmull-Rom matrix form to a matrix form in terms of four coordinates, and see what we end up with:
\[
CatmullRom(t)
\textit{CatmullRom}(t)
=
\begin{bmatrix}
1 & t & t^2 & t^3
@@ -199,7 +199,7 @@ With the mapping matrix properly done, let's rewrite the "point + tangent" Catmu
Replace point/tangent vector with the expression for all-coordinates:
\[
CatmullRom(t)
\textit{CatmullRom}(t)
=
\begin{bmatrix}
1 & t & t^2 & t^3
@@ -227,7 +227,7 @@ Replace point/tangent vector with the expression for all-coordinates:
and merge the matrices:
\[
CatmullRom(t)
\textit{CatmullRom}(t)
=
\begin{bmatrix}
1 & t & t^2 & t^3
@@ -248,7 +248,7 @@ and merge the matrices:
This looks a lot like the Bézier matrix form, which as we saw in the chapter on Bézier curves, should look like this:
\[
Bézier(t)
\textit{Bézier}(t)
=
\begin{bmatrix}
1 & t & t^2 & t^3
@@ -422,7 +422,7 @@ We now have the final piece of our function puzzle. Let's run through each step.
1. Start with the Catmull-Rom function:
\[
CatmullRom(t)
\textit{CatmullRom}(t)
=
\begin{bmatrix}
1 & t & t^2 & t^3
@@ -569,14 +569,14 @@ If we have a Catmull-Rom curve defined by four coordinates P<sub>1</sub> through
P_2 \\
P_3 \\
P_4
\end{bmatrix}_{CatmullRom}
\end{bmatrix}_{\textit{CatmullRom}}
\Rightarrow
\begin{bmatrix}
P_2 \\
P_2 + \frac{P_3-P_1}{6 \cdot τ} \\
P_3 - \frac{P_4-P_2}{6 \cdot τ} \\
P_3
\end{bmatrix}_{Bézier}
\end{bmatrix}_{\textit{Bézier}}
\]
Similarly, if we have a Bézier curve defined by four coordinates P<sub>1</sub> through P<sub>4</sub>, we can draw that using a standard tension Catmull-Rom curve with the following coordinate values:
@@ -587,14 +587,14 @@ Similarly, if we have a Bézier curve defined by four coordinates P<sub>1</sub>
P_2 \\
P_3 \\
P_4
\end{bmatrix}_{Bézier}
\end{bmatrix}_{\textit{Bézier}}
\Rightarrow
\begin{bmatrix}
P_1 \\
P_4 \\
P_4 + 3(P_1 - P_2) \\
P_1 + 3(P_4 - P_3)
\end{bmatrix}_{CatmullRom}
\end{bmatrix}_{\textit{CatmullRom}}
\]
Or, if your API allows you to specify Catmull-Rom curves using plain coordinates:
@@ -605,12 +605,12 @@ Or, if your API allows you to specify Catmull-Rom curves using plain coordinates
P_2 \\
P_3 \\
P_4
\end{bmatrix}_{Bézier}
\end{bmatrix}_{\textit{Bézier}}
\Rightarrow
\begin{bmatrix}
P_4 + 6(P_1 - P_2) \\
P_1 \\
P_4 \\
P_1 + 6(P_4 - P_3)
\end{bmatrix}_{CatmullRom}
\end{bmatrix}_{\textit{CatmullRom}}
\]

View File

@@ -5,14 +5,14 @@ It might seem odd to cover this subject so much later than the line/line, line/c
First, we observe that "finding intersections" in this case means that, given a circle defined by a center point `c = (x,y)` and a radius `r`, we want to find all points on the Bezier curve for which the distance to the circle's center point is equal to the circle radius, which by definition means those points lie on the circle, and so count as intersections. In maths, that means we're trying to solve:
\[
dist(B(t), c) = r
\textit{dist}(B(t), c) = r
\]
Which seems simple enough. Unfortunately, when we expand that `dist` function, things get a lot more problematic:
\[
\begin{aligned}
r &= dist(B(t), c) \\
r &= \textit{dist}(B(t), c) \\
&= \sqrt{ \left ( B_x{t} - c_x \right )^2 + \left ( B_y{t} - c_y \right )^2} \\
&= \sqrt{ \left (
x_1 (1-t)^3 + 3 x_2 (1-t)^2 t + 2 x_3 (1-t) t^2 + x_4 t^3 - c_x

View File

@@ -68,7 +68,7 @@ If we look at the triangle that is formed between our starting point, or initial
The distance from our guessed point to the start point is exactly the same as the projection distance we looked at earlier. Using <i>t=0.5</i> as our point "B" in the "A,B,C" projection, then we know the length of the line segment {C,A}, since it's d<sub>1</sub> = {A,B} + d<sub>2</sub> = {B,C}:
\[
||{A,C}|| = d_2 + d_1 = d_2 + d_2 \cdot ratio_3 \left(\frac{1}{2}\right) = d_2 + \frac{1}{3}d_2 = \frac{4}{3}d_2
||{A,C}|| = d_2 + d_1 = d_2 + d_2 \cdot \textit{ratio}_3 \left(\frac{1}{2}\right) = d_2 + \frac{1}{3}d_2 = \frac{4}{3}d_2
\]
So that just leaves us to find the distance from <i>t=0.5</i> to the baseline for an arbitrary angle φ, which is the distance from the centre of the circle to our <i>t=0.5</i> point, minus the distance from the centre to the line that runs from start point to end point. The first is the same as the point P we found for the quadratic curve:
@@ -146,7 +146,7 @@ So, to recap, given an angle φ, the new control coordinates are:
C_1 = \left [ \begin{matrix}
1 \\
f
\end{matrix} \right ],~with~f = \frac{4}{3} tan \left( \frac{φ}{4} \right)
\end{matrix} \right ]~,~\textit{with}~f = \frac{4}{3} tan \left( \frac{φ}{4} \right)
\]
and
@@ -155,7 +155,7 @@ and
C_2 = \left [ \begin{matrix}
cos(φ) + f \cdot sin(φ) \\
sin(φ) - f \cdot cos(φ)
\end{matrix} \right ],~with~f = \frac{4}{3} tan \left( \frac{φ}{4} \right)
\end{matrix} \right ]~,~\textit{with}~f = \frac{4}{3} tan \left( \frac{φ}{4} \right)
\]
And, because the "quarter curve" special case comes up so incredibly often, let's look at what these new control points mean for the curve coordinates of a quarter curve, by simply filling in φ = π/2:

View File

@@ -22,11 +22,11 @@ If we want to change the curve, we need to change the weights of each point, eff
\[
Bézier(n,t) = \sum_{i=0}^{n}
\underset{binomial~term}{\underbrace{\binom{n}{i}}}
\underset{\textit{binomial term}}{\underbrace{\binom{n}{i}}}
\cdot\
\underset{polynomial~term}{\underbrace{(1-t)^{n-i} \cdot t^{i}}}
\underset{\textit{polynomial term}}{\underbrace{(1-t)^{n-i} \cdot t^{i}}}
\cdot\
\underset{weight}{\underbrace{w_i}}
\underset{\textit{weight}}{\underbrace{w_i}}
\]
That looks complicated, but as it so happens, the "weights" are actually just the coordinate values we want our curve to have: for an <i>n<sup>th</sup></i> order curve, w<sub>0</sub> is our start coordinate, w<sub>n</sub> is our last coordinate, and everything in between is a controlling coordinate. Say we want a cubic curve that starts at (110,150), is controlled by (25,190) and (210,250) and ends at (210,30), we use this Bézier curve:

View File

@@ -22,11 +22,11 @@
\[
Bézier(n,t) = \sum_{i=0}^{n}
\underset{二項係数部分の項}{\underbrace{\binom{n}{i}}}
\underset{\textit{二項係数部分の項}}{\underbrace{\binom{n}{i}}}
\cdot\
\underset{多項式部分の項}{\underbrace{(1-t)^{n-i} \cdot t^{i}}}
\underset{\textit{多項式部分の項}}{\underbrace{(1-t)^{n-i} \cdot t^{i}}}
\cdot\
\underset{重み}{\underbrace{w_i}}
\underset{\textit{重み}}{\underbrace{w_i}}
\]
複雑そうに見えますが、運がいいことに「重み」というのは実はただの座標値です。というのは<i>n</i>次の曲線の場合、w<sub>0</sub>が始点の座標、w<sub>n</sub>が終点の座標となり、その間はどれも制御点の座標になります。例えば、始点が(120,160)、制御点が(35,200)と(220,260)、終点が(220,40)となる3次ベジエ曲線は、次のようになります。

View File

@@ -22,11 +22,11 @@
\[
Bézier(n,t) = \sum_{i=0}^{n}
\underset{биноминальный~термин}{\underbrace{\binom{n}{i}}}
\underset{\textit{биноминальный термин}}{\underbrace{\binom{n}{i}}}
\cdot\
\underset{полиноминальный~термин}{\underbrace{(1-t)^{n-i} \cdot t^{i}}}
\underset{\textit{полиноминальный термин}}{\underbrace{(1-t)^{n-i} \cdot t^{i}}}
\cdot\
\underset{вес}{\underbrace{w_i}}
\underset{\textit{вес}}{\underbrace{w_i}}
\]
Хоть и выглядит заморочено, но, так уж получается, в реальности "веса" просто значения координат на графике, к которым мы бы хотели, чтобы наша функция стремилась. Так, для кривой <i>n-го</i> порядка, w<sub>0</sub> есть начальной координатой, w<sub>n</sub> конечной координатой, а все между ними — контрольными координатами. Например, чтобы кубическая кривая начиналась в (110,150), стремилась к точкам (25,190) и (210,250) заканчиваясь на (210,30), мы запишем это следующим образом:

View File

@@ -22,11 +22,11 @@
\[
Bézier(n,t) = \sum_{i=0}^{n}
\underset{binomial~term}{\underbrace{\binom{n}{i}}}
\underset{\textit{binomial term}}{\underbrace{\binom{n}{i}}}
\cdot\
\underset{polynomial~term}{\underbrace{(1-t)^{n-i} \cdot t^{i}}}
\underset{\textit{polynomial term}}{\underbrace{(1-t)^{n-i} \cdot t^{i}}}
\cdot\
\underset{weight}{\underbrace{w_i}}
\underset{\textit{weight}}{\underbrace{w_i}}
\]
看起来很复杂但实际上“权重”只是我们想让曲线所拥有的坐标值对于一条n<sup>th</sup>阶曲线w<sup>0</sup>是起始坐标w<sup>n</sup>是终点坐标中间的所有点都是控制点坐标。假设说一条曲线的起点为110150终点为21030并受点25190和点210250的控制贝塞尔曲线方程就为

View File

@@ -20,7 +20,7 @@ Rewriting Bézier functions to matrix form is fairly easy, if you first expand t
\[
\begin{aligned}
B_{quadratic} & = a (1-t)^2 + 2 b (1-t) t + c t^2 \\
B_{\textit{quadratic}} & = a (1-t)^2 + 2 b (1-t) t + c t^2 \\
& = a - 2at + at^2 + 2bt - 2bt^2 + ct^2
\end{aligned}
\]
@@ -29,7 +29,7 @@ And then we (trivially) rearrange the terms across multiple lines:
\[
\begin{aligned}
B_{quadratic} &=& a & & \\
B_{\textit{quadratic}} &=& a & & \\
& & - 2at & + 2bt & \\
& & + at^2 & - 2bt^2 & + ct^2
\end{aligned}
@@ -41,7 +41,7 @@ With that arrangement, we can easily decompose this as a matrix multiplication:
\[
\begin{aligned}
B_{quadratic} &= T \cdot M \cdot C
B_{\textit{quadratic}} &= T \cdot M \cdot C
=
\begin{bmatrix}1 & t & t^2 \end{bmatrix}
\cdot
@@ -67,7 +67,7 @@ We can do the same for the cubic curve, of course. We know the base function for
\[
\begin{aligned}
B_{cubic} & = & a(1-t)^3 + 3b(1-t)^2 t + 3c(1-t)t^2 + dt^3
B_{\textit{cubic}} & = & a(1-t)^3 + 3b(1-t)^2 t + 3c(1-t)t^2 + dt^3
\end{aligned}
\]
@@ -75,7 +75,7 @@ So we write out the expansion and rearrange:
\[
\begin{aligned}
B_{cubic} & = & a & & & \\
B_{\textit{cubic}} & = & a & & & \\
& & - 3at & + 3bt & & \\
& & + 3at^2 & - 6bt^2 & +3ct^2 & \\
& & - at^3 & + 3bt^3 & -3ct^3 & + dt^3
@@ -86,7 +86,7 @@ Which we can then decompose:
\[
\begin{aligned}
B_{cubic} &= T \cdot M \cdot C =
B_{\textit{cubic}} &= T \cdot M \cdot C =
\begin{bmatrix}1 & t & t^2 & t^3 \end{bmatrix}
\cdot
\begin{bmatrix}
@@ -104,7 +104,7 @@ And, of course, we can do this for quartic curves too (skipping the expansion st
\[
\begin{aligned}
B_{quartic} &= T \cdot M \cdot C =
B_{\textit{quartic}} &= T \cdot M \cdot C =
\begin{bmatrix}1 & t & t^2 & t^3 & t^4 \end{bmatrix}
\cdot
\begin{bmatrix}
@@ -170,13 +170,13 @@ And now we can move on to the actual "curve fitting" part: what we want is a fun
As mentioned before, this function is really just "the distance between the actual coordinate, and the coordinate that the curve evaluates to for the associated `t` value", which we'll square to get rid of any pesky negative signs:
\[
E(C)_i = \left ( p_i - Bézier(s_i) \right )^2
E(C)_i = \left ( p_i - \textit{Bézier}(s_i) \right )^2
\]
Since this function only deals with individual coordinates, we'll need to sum over all coordinates in order to get the full error function. So, we literally just do that; the total error function is simply the sum of all these individual errors:
\[
E(C) = \sum^n_{i=1} \left ( p_i - Bézier(s_i) \right )^2
E(C) = \sum^n_{i=1} \left ( p_i - \textit{Bézier}(s_i) \right )^2
\]
And here's the trick that justifies using matrices: while we can work with individual values using calculus, with matrices we can compute as many values as we make our matrices big, all at the "same time", We can replace the individual terms p<sub>i</sub> with the full **P** coordinate matrix, and we can replace Bézier(s<sub>i</sub>) with the matrix representation **T x M x C** we talked about before, which gives us:

View File

@@ -5,13 +5,13 @@ There's a number of useful things that you can do with Bézier curves based on t
First, let's look at the derivative rule for Bézier curves, which is:
\[
Bézier'(n,t) = n \cdot \sum_{i=0}^{n-1} (b_{i+1}-b_i) \cdot Bézier(n-1,t)_i
\textit{Bézier}'(n,t) = n \cdot \sum_{i=0}^{n-1} (b_{i+1}-b_i) \cdot \textit{Bézier}(n-1,t)_i
\]
which we can also write (observing that <i>b</i> in this formula is the same as our <i>w</i> weights, and that <i>n</i> times a summation is the same as a summation where each term is multiplied by <i>n</i>) as:
\[
Bézier'(n,t) = \sum_{i=0}^{n-1} Bézier(n-1,t)_i \cdot n \cdot (w_{i+1}-w_i)
\textit{Bézier}'(n,t) = \sum_{i=0}^{n-1} \textit{Bézier}(n-1,t)_i \cdot n \cdot (w_{i+1}-w_i)
\]
Or, in plain text: the derivative of an n<sup>th</sup> degree Bézier curve is an (n-1)<sup>th</sup> degree Bézier curve, with one fewer term, and new weights w'<sub>0</sub>...w'<sub>n-1</sub> derived from the original weights as n(w<sub>i+1</sub> - w<sub>i</sub>). So for a 3<sup>rd</sup> degree curve, with four weights, the derivative has three new weights: w'<sub>0</sub> = 3(w<sub>1</sub>-w<sub>0</sub>), w'<sub>1</sub> = 3(w<sub>2</sub>-w<sub>1</sub>) and w'<sub>2</sub> = 3(w<sub>3</sub>-w<sub>2</sub>).
@@ -75,8 +75,8 @@ And that's the first part done: the two components inside the parentheses are ac
Now to apply this to our weighted Bézier curves. We'll write out the plain curve formula that we saw earlier, and then work our way through to its derivative:
\[\begin{array}{lcl}
Bézier_{n,k}(t) &=& B_{n,0}(t) \cdot w_0 + B_{n,1}(t) \cdot w_1 + B_{n,2}(t) \cdot w_2 + B_{n,3}(t) \cdot w_3 + ... \\
Bézier_{n,k}(t) \frac{d}{dt} &=& n \cdot (B_{n-1,-1}(t) - B_{n-1,0}(t)) \cdot w_0 + \\
\textit{Bézier}_{n,k}(t) &=& B_{n,0}(t) \cdot w_0 + B_{n,1}(t) \cdot w_1 + B_{n,2}(t) \cdot w_2 + B_{n,3}(t) \cdot w_3 + ... \\
\textit{Bézier}_{n,k}(t) \frac{d}{dt} &=& n \cdot (B_{n-1,-1}(t) - B_{n-1,0}(t)) \cdot w_0 + \\
& & n \cdot (B_{n-1,0}(t) - B_{n-1,1}(t)) \cdot w_1 + \\
& & n \cdot (B_{n-1,1}(t) - B_{n-1,2}(t)) \cdot w_2 + \\
& & n \cdot (B_{n-1,2}(t) - B_{n-1,3}(t)) \cdot w_3 + \\
@@ -106,7 +106,7 @@ Two of these terms fall way: the first term falls away because there is no -1<su
And that's just a summation of lower order curves:
\[
Bézier_{n,k}(t) \frac{d}{dt} = n \cdot B_{(n-1),BLUE[0]}(t) \cdot (w_1 - w_0)
\textit{Bézier}_{n,k}(t) \frac{d}{dt} = n \cdot B_{(n-1),BLUE[0]}(t) \cdot (w_1 - w_0)
+ n \cdot B_{(n-1),RED[1]}(t) \cdot (w_2 - w_1)
+ n \cdot B_{(n-1),MAGENTA[2]}(t) \cdot (w_3 - w_2)
~+ ~...
@@ -115,8 +115,8 @@ And that's just a summation of lower order curves:
We can rewrite this as a normal summation, and we're done:
\[
Bézier_{n,k}(t) \frac{d}{dt} = \sum_{k=0}^{n-1} n \cdot B_{n-1,k}(t) \cdot (w_{k+1} - w_k)
= \sum_{k=0}^{n-1} B_{n-1,k}(t) \cdot \underset{derivative~weights}
\textit{Bézier}_{n,k}(t) \frac{d}{dt} = \sum_{k=0}^{n-1} n \cdot B_{n-1,k}(t) \cdot (w_{k+1} - w_k)
= \sum_{k=0}^{n-1} B_{n-1,k}(t) \cdot \underset{\textit{derivative weights}}
{\underbrace{n \cdot (w_{k+1} - w_k)}}
\]
@@ -125,22 +125,22 @@ We can rewrite this as a normal summation, and we're done:
Let's rewrite that in a form similar to our original formula, so we can see the difference. We will first list our original formula for Bézier curves, and then the derivative:
\[
Bézier(n,t) = \sum_{i=0}^{n}
\underset{binomial~term}{\underbrace{\binom{n}{i}}}
\textit{Bézier}(n,t) = \sum_{i=0}^{n}
\underset{\textit{binomial term}}{\underbrace{\binom{n}{i}}}
\cdot\
\underset{polynomial~term}{\underbrace{(1-t)^{n-i} \cdot t^{i}}}
\underset{\textit{polynomial term}}{\underbrace{(1-t)^{n-i} \cdot t^{i}}}
\cdot\
\underset{weight}{\underbrace{w_i}}
\underset{\textit{weight}}{\underbrace{w_i}}
\]
\[
Bézier'(n,t) = \sum_{i=0}^{k}
\underset{binomial~term}{\underbrace{\binom{k}{i}}}
\textit{Bézier}'(n,t) = \sum_{i=0}^{k}
\underset{\textit{binomial term}}{\underbrace{\binom{k}{i}}}
\cdot\
\underset{polynomial~term}{\underbrace{(1-t)^{k-i} \cdot t^{i}}}
\underset{\textit{polynomial term}}{\underbrace{(1-t)^{k-i} \cdot t^{i}}}
\cdot\
\underset{derivative~weight}{\underbrace{n \cdot (w_{i+1} - w_i)}}
{~, ~with ~k=n-1}
\underset{\textit{derivative weight}}{\underbrace{n \cdot (w_{i+1} - w_i)}}
~,~\textit{with } k=n-1
\]

View File

@@ -5,13 +5,13 @@
Для начала рассмотрим правило производных для кривых Безье:
\[
Bézier'(n,t) = n \cdot \sum_{i=0}^{n-1} (b_{i+1}-b_i) \cdot Bézier(n-1,t)_i
\textit{Bézier}'(n,t) = n \cdot \sum_{i=0}^{n-1} (b_{i+1}-b_i) \cdot \textit{Bézier}(n-1,t)_i
\]
которое мы так же можем записать (отметив что <i>b</i> в этой формуле, то-же что наш <i>w</i> "вес", а <i>n</i> умноженная на функцию сумы — то-же что функция сумы, с каждой составляющей умноженной на <i>n</i>) как:
\[
Bézier'(n,t) = \sum_{i=0}^{n-1} Bézier(n-1,t)_i \cdot n \cdot (w_{i+1}-w_i)
\textit{Bézier}'(n,t) = \sum_{i=0}^{n-1} \textit{Bézier}(n-1,t)_i \cdot n \cdot (w_{i+1}-w_i)
\]
Другими словами, производная кривой Безье n<sup>го</sup> порядка равна кривой Безье на порядок ниже (n-1), соответственно имея на один термин составляющих меньше, где новые веса w'<sub>0</sub>...w'<sub>n-1</sub> произведены из оригинальных по принципу n(w<sub>i+1</sub> - w<sub>i</sub>). Так, для кривой 3<sup>го</sup> порядка, с 4мя весами, производная имеет 3 веса: w'<sub>0</sub> = 3(w<sub>1</sub>-w<sub>0</sub>), w'<sub>1</sub> = 3(w<sub>2</sub>-w<sub>1</sub>) и w'<sub>2</sub> = 3(w<sub>3</sub>-w<sub>2</sub>).
@@ -75,8 +75,8 @@
Теперь применим это к записям наших формул с "весами". Начнем с формулы кривой Безье приведенной выше и пройдемся по ее производным.
\[\begin{array}{lcl}
Bézier_{n,k}(t) &=& B_{n,0}(t) \cdot w_0 + B_{n,1}(t) \cdot w_1 + B_{n,2}(t) \cdot w_2 + B_{n,3}(t) \cdot w_3 + ... \\
Bézier_{n,k}(t) \frac{d}{dt} &=& n \cdot (B_{n-1,-1}(t) - B_{n-1,0}(t)) \cdot w_0 + \\
\textit{Bézier}_{n,k}(t) &=& B_{n,0}(t) \cdot w_0 + B_{n,1}(t) \cdot w_1 + B_{n,2}(t) \cdot w_2 + B_{n,3}(t) \cdot w_3 + ... \\
\textit{Bézier}_{n,k}(t) \frac{d}{dt} &=& n \cdot (B_{n-1,-1}(t) - B_{n-1,0}(t)) \cdot w_0 + \\
& & n \cdot (B_{n-1,0}(t) - B_{n-1,1}(t)) \cdot w_1 + \\
& & n \cdot (B_{n-1,1}(t) - B_{n-1,2}(t)) \cdot w_2 + \\
& & n \cdot (B_{n-1,2}(t) - B_{n-1,3}(t)) \cdot w_3 + \\
@@ -106,7 +106,7 @@
И это по сути формула функции сумы на 1 порядок ниже:
\[
Bézier_{n,k}(t) \frac{d}{dt} = n \cdot B_{(n-1),BLUE[0]}(t) \cdot (w_1 - w_0)
\textit{Bézier}_{n,k}(t) \frac{d}{dt} = n \cdot B_{(n-1),BLUE[0]}(t) \cdot (w_1 - w_0)
+ n \cdot B_{(n-1),RED[1]}(t) \cdot (w_2 - w_1)
+ n \cdot B_{(n-1),MAGENTA[2]}(t) \cdot (w_3 - w_2)
~+ ~...
@@ -116,8 +116,8 @@
\[
Bézier_{n,k}(t) \frac{d}{dt} = \sum_{k=0}^{n-1} n \cdot B_{n-1,k}(t) \cdot (w_{k+1} - w_k)
= \sum_{k=0}^{n-1} B_{n-1,k}(t) \cdot \underset{вес~производной}
\textit{Bézier}_{n,k}(t) \frac{d}{dt} = \sum_{k=0}^{n-1} n \cdot B_{n-1,k}(t) \cdot (w_{k+1} - w_k)
= \sum_{k=0}^{n-1} B_{n-1,k}(t) \cdot \underset{\textit{вес производной}}
{\underbrace{n \cdot (w_{k+1} - w_k)}}
\]
@@ -126,22 +126,22 @@
Давайте перепишем это по форме схожей с нашей исходной формулой, чтобы легче было разглядеть разницу. Сначала оригинальная формула, за ней производная:
\[
Bézier(n,t) = \sum_{i=0}^{n}
\underset{биноминальный~термин}{\underbrace{\binom{n}{i}}}
\textit{Bézier}(n,t) = \sum_{i=0}^{n}
\underset{\textit{биноминальный термин}}{\underbrace{\binom{n}{i}}}
\cdot\
\underset{полиноминальный~термин}{\underbrace{(1-t)^{n-i} \cdot t^{i}}}
\underset{\textit{полиноминальный термин}}{\underbrace{(1-t)^{n-i} \cdot t^{i}}}
\cdot\
\underset{вес}{\underbrace{w_i}}
\underset{\textit{вес}}{\underbrace{w_i}}
\]
\[
Bézier'(n,t) = \sum_{i=0}^{k}
\underset{биноминальный~термин}{\underbrace{\binom{k}{i}}}
\textit{Bézier}'(n,t) = \sum_{i=0}^{k}
\underset{\textit{биноминальный термин}}{\underbrace{\binom{k}{i}}}
\cdot\
\underset{полиноминальный~термин}{\underbrace{(1-t)^{k-i} \cdot t^{i}}}
\underset{\textit{полиноминальный термин}}{\underbrace{(1-t)^{k-i} \cdot t^{i}}}
\cdot\
\underset{вес~производной}{\underbrace{n \cdot (w_{i+1} - w_i)}}
{~, ~with ~k=n-1}
\underset{\textit{вес производной}}{\underbrace{n \cdot (w_{i+1} - w_i)}}
~,~ \textit{with } k=n-1
\]
И в чем же разница? В терминах формулы кривой Безье, по сути, никакой! Мы уменьшили порядок (вместо порядка <i>n</i>, он теперь <i>n-1</i>), но это все та же функция Безье. Единственное отличие в подсчете изменений в "весах" при нахождении производной. К примеру, исходя из 4-х контрольных точек A, B, C и D, первая производная получит 3 точки, вторая — 2, третья — 1:

View File

@@ -59,9 +59,9 @@ Bézier curves are polynomials of <i>t</i>, rather than <i>x</i>, with the value
\[
\begin{aligned}
linear &= (1-t) + t \\
square &= (1-t)^2 + 2 \cdot (1-t) \cdot t + t^2 \\
cubic &= (1-t)^3 + 3 \cdot (1-t)^2 \cdot t + 3 \cdot (1-t) \cdot t^2 + t^3
\textit{linear} &= (1-t) + t \\
\textit{square} &= (1-t)^2 + 2 \cdot (1-t) \cdot t + t^2 \\
\textit{cubic} &= (1-t)^3 + 3 \cdot (1-t)^2 \cdot t + 3 \cdot (1-t) \cdot t^2 + t^3
\end{aligned}
\]
@@ -69,10 +69,10 @@ I know what you're thinking: that doesn't look too simple! But if we remove <i>t
\[
\begin{aligned}
linear &= \hspace{2.5em} 1 + 1 \\
square &= \hspace{1.7em} 1 + 2 + 1\\
cubic &= \hspace{0.85em} 1 + 3 + 3 + 1\\
quartic &= 1 + 4 + 6 + 4 + 1
\textit{linear} &= \hspace{2.5em} 1 + 1 \\
\textit{square} &= \hspace{1.7em} 1 + 2 + 1\\
\textit{cubic} &= \hspace{0.85em} 1 + 3 + 3 + 1\\
\textit{quartic} &= 1 + 4 + 6 + 4 + 1
\end{aligned}
\]
@@ -82,19 +82,19 @@ There's an equally simple way to figure out how the polynomial terms work: if we
\[
\begin{aligned}
linear &= BLUE[a] + RED[b] \\
square &= BLUE[a] \cdot BLUE[a] + BLUE[a] \cdot RED[b] + RED[b] \cdot RED[b] \\
cubic &= BLUE[a] \cdot BLUE[a] \cdot BLUE[a] + BLUE[a] \cdot BLUE[a] \cdot RED[b] + BLUE[a] \cdot RED[b] \cdot RED[b] + RED[b] \cdot RED[b] \cdot RED[b]\\
\textit{linear} &= BLUE[a] + RED[b] \\
\textit{square} &= BLUE[a] \cdot BLUE[a] + BLUE[a] \cdot RED[b] + RED[b] \cdot RED[b] \\
\textit{cubic} &= BLUE[a] \cdot BLUE[a] \cdot BLUE[a] + BLUE[a] \cdot BLUE[a] \cdot RED[b] + BLUE[a] \cdot RED[b] \cdot RED[b] + RED[b] \cdot RED[b] \cdot RED[b]\\
\end{aligned}
\]
It's basically just a sum of "every combination of <i>a</i> and <i>b</i>", progressively replacing <i>a</i>'s with <i>b</i>'s after every + sign. So that's actually pretty simple too. So now you know binomial polynomials, and just for completeness I'm going to show you the generic function for this:
\[
Bézier(n,t) = \sum_{i=0}^{n}
\underset{binomial~term}{\underbrace{\binom{n}{i}}}
\textit{Bézier}(n,t) = \sum_{i=0}^{n}
\underset{\textit{binomial term}}{\underbrace{\binom{n}{i}}}
\cdot\
\underset{polynomial~term}{\underbrace{(1-t)^{n-i} \cdot t^{i}}}
\underset{\textit{polynomial term}}{\underbrace{(1-t)^{n-i} \cdot t^{i}}}
\]
And that's the full description for Bézier curves. Σ in this function indicates that this is a series of additions (using the variable listed below the Σ, starting at ...=&lt;value&gt; and ending at the value listed on top of the Σ).

View File

@@ -57,9 +57,9 @@
\[
\begin{aligned}
1次 &= (1-t) + t \\
2次 &= (1-t)^2 + 2 \cdot (1-t) \cdot t + t^2 \\
3次 &= (1-t)^3 + 3 \cdot (1-t)^2 \cdot t + 3 \cdot (1-t) \cdot t^2 + t^3
\textit{1次} &= (1-t) + t \\
\textit{2次} &= (1-t)^2 + 2 \cdot (1-t) \cdot t + t^2 \\
\textit{3次} &= (1-t)^3 + 3 \cdot (1-t)^2 \cdot t + 3 \cdot (1-t) \cdot t^2 + t^3
\end{aligned}
\]
@@ -67,10 +67,10 @@
\[
\begin{aligned}
1次 &= \hspace{2.5em} 1 + 1 \\
2次 &= \hspace{1.7em} 1 + 2 + 1\\
3次 &= \hspace{0.85em} 1 + 3 + 3 + 1\\
4次 &= 1 + 4 + 6 + 4 + 1
\textit{1次} &= \hspace{2.5em} 1 + 1 \\
\textit{2次} &= \hspace{1.7em} 1 + 2 + 1\\
\textit{3次} &= \hspace{0.85em} 1 + 3 + 3 + 1\\
\textit{4次} &= 1 + 4 + 6 + 4 + 1
\end{aligned}
\]
@@ -80,19 +80,19 @@
\[
\begin{aligned}
1次 &= BLUE[a] + RED[b] \\
2次 &= BLUE[a] \cdot BLUE[a] + BLUE[a] \cdot RED[b] + RED[b] \cdot RED[b] \\
3次 &= BLUE[a] \cdot BLUE[a] \cdot BLUE[a] + BLUE[a] \cdot BLUE[a] \cdot RED[b] + BLUE[a] \cdot RED[b] \cdot RED[b] + RED[b] \cdot RED[b] \cdot RED[b]\\
\textit{1次} &= BLUE[a] + RED[b] \\
\textit{2次} &= BLUE[a] \cdot BLUE[a] + BLUE[a] \cdot RED[b] + RED[b] \cdot RED[b] \\
\textit{3次} &= BLUE[a] \cdot BLUE[a] \cdot BLUE[a] + BLUE[a] \cdot BLUE[a] \cdot RED[b] + BLUE[a] \cdot RED[b] \cdot RED[b] + RED[b] \cdot RED[b] \cdot RED[b]\\
\end{aligned}
\]
これは要するに、「<i>a</i><i>b</i>のすべての組み合わせ」の単なる和です。プラスが出てくるたびに、<i>a</i><i>b</i>へと1つずつ置き換えていけばよいのです。こちらも本当に単純です。さて、これで「二項係数多項式」がわかりました。完璧を期するため、この関数の一般の形を示しておきます。
\[
Bézier(n,t) = \sum_{i=0}^{n}
\underset{二項係数部分の項}{\underbrace{\binom{n}{i}}}
\textit{Bézier}(n,t) = \sum_{i=0}^{n}
\underset{\textit{二項係数部分の項}}{\underbrace{\binom{n}{i}}}
\cdot\
\underset{多項式部分の項}{\underbrace{(1-t)^{n-i} \cdot t^{i}}}
\underset{\textit{多項式部分の項}}{\underbrace{(1-t)^{n-i} \cdot t^{i}}}
\]
そして、これがベジエ曲線の完全な表現です。この関数中のΣは、加算の繰り返し(Σの下にある変数を使って、...=<>から始めてΣの下にある値まで)を表します。

View File

@@ -59,9 +59,9 @@
\[
\begin{aligned}
линейный &= (1-t) + t \\
квадратный &= (1-t)^2 + 2 \cdot (1-t) \cdot t + t^2 \\
кубический &= (1-t)^3 + 3 \cdot (1-t)^2 \cdot t + 3 \cdot (1-t) \cdot t^2 + t^3
\textit{линийный} &= (1-t) + t \\
\textit{квадратый} &= (1-t)^2 + 2 \cdot (1-t) \cdot t + t^2 \\
\textit{кубический} &= (1-t)^3 + 3 \cdot (1-t)^2 \cdot t + 3 \cdot (1-t) \cdot t^2 + t^3
\end{aligned}
\]
@@ -69,10 +69,10 @@
\[
\begin{aligned}
линийный &= \hspace{2.5em} 1 + 1 \\
квадратый &= \hspace{1.7em} 1 + 2 + 1\\
кубический &= \hspace{0.85em} 1 + 3 + 3 + 1\\
квартический &= 1 + 4 + 6 + 4 + 1
\textit{линийный} &= \hspace{2.5em} 1 + 1 \\
\textit{квадратый} &= \hspace{1.7em} 1 + 2 + 1\\
\textit{кубический} &= \hspace{0.85em} 1 + 3 + 3 + 1\\
\textit{квартический} &= 1 + 4 + 6 + 4 + 1
\end{aligned}
\]
@@ -82,19 +82,19 @@
\[
\begin{aligned}
линийный &= BLUE[a] + RED[b] \\
квадратый &= BLUE[a] \cdot BLUE[a] + BLUE[a] \cdot RED[b] + RED[b] \cdot RED[b] \\
кубический &= BLUE[a] \cdot BLUE[a] \cdot BLUE[a] + BLUE[a] \cdot BLUE[a] \cdot RED[b] + BLUE[a] \cdot RED[b] \cdot RED[b] + RED[b] \cdot RED[b] \cdot RED[b]\\
\textit{линийный} &= BLUE[a] + RED[b] \\
\textit{квадратый} &= BLUE[a] \cdot BLUE[a] + BLUE[a] \cdot RED[b] + RED[b] \cdot RED[b] \\
\textit{кубический} &= BLUE[a] \cdot BLUE[a] \cdot BLUE[a] + BLUE[a] \cdot BLUE[a] \cdot RED[b] + BLUE[a] \cdot RED[b] \cdot RED[b] + RED[b] \cdot RED[b] \cdot RED[b]\\
\end{aligned}
\]
В целом это просто сума "каждого сочетания <i>a</i> и <i>b</i>", получаемая прогрессивной заменой <i>a</i> на <i>b</i> по ходу уравнения. Потому, это так-же довольно просто. Итак теперь вы знаете что такое биноминальные полиномы. Для полноты картины, ниже привожу их общую функцию:
\[
Bézier(n,t) = \sum_{i=0}^{n}
\underset{биноминальный~термин}{\underbrace{\binom{n}{i}}}
\textit{Bézier}(n,t) = \sum_{i=0}^{n}
\underset{\textit{биноминальный термин}}{\underbrace{\binom{n}{i}}}
\cdot\
\underset{полиноминальный~термин}{\underbrace{(1-t)^{n-i} \cdot t^{i}}}
\underset{\textit{полиноминальный термин}}{\underbrace{(1-t)^{n-i} \cdot t^{i}}}
\]
И теперь, это полное объяснение. Σ в этой функции означает, что это серия сум (с использованием переменной приведенной под Σ, со стартовым значением в ...=&lt;value&gt; и максимальным значением представленным над Σ)

View File

@@ -57,9 +57,9 @@
\[
\begin{aligned}
linear &= (1-t) + t \\
square &= (1-t)^2 + 2 \cdot (1-t) \cdot t + t^2 \\
cubic &= (1-t)^3 + 3 \cdot (1-t)^2 \cdot t + 3 \cdot (1-t) \cdot t^2 + t^3
\textit{linear} &= (1-t) + t \\
\textit{square} &= (1-t)^2 + 2 \cdot (1-t) \cdot t + t^2 \\
\textit{cubic} &= (1-t)^3 + 3 \cdot (1-t)^2 \cdot t + 3 \cdot (1-t) \cdot t^2 + t^3
\end{aligned}
\]
@@ -67,10 +67,10 @@
\[
\begin{aligned}
linear &= \hspace{2.5em} 1 + 1 \\
square &= \hspace{1.7em} 1 + 2 + 1\\
cubic &= \hspace{0.85em} 1 + 3 + 3 + 1\\
quartic &= 1 + 4 + 6 + 4 + 1
\textit{linear} &= \hspace{2.5em} 1 + 1 \\
\textit{square} &= \hspace{1.7em} 1 + 2 + 1\\
\textit{cubic} &= \hspace{0.85em} 1 + 3 + 3 + 1\\
\textit{quartic} &= 1 + 4 + 6 + 4 + 1
\end{aligned}
\]
@@ -80,19 +80,19 @@
\[
\begin{aligned}
linear &= BLUE[a] + RED[b] \\
square &= BLUE[a] \cdot BLUE[a] + BLUE[a] \cdot RED[b] + RED[b] \cdot RED[b] \\
cubic &= BLUE[a] \cdot BLUE[a] \cdot BLUE[a] + BLUE[a] \cdot BLUE[a] \cdot RED[b] + BLUE[a] \cdot RED[b] \cdot RED[b] + RED[b] \cdot RED[b] \cdot RED[b]\\
\textit{linear} &= BLUE[a] + RED[b] \\
\textit{square} &= BLUE[a] \cdot BLUE[a] + BLUE[a] \cdot RED[b] + RED[b] \cdot RED[b] \\
\textit{cubic} &= BLUE[a] \cdot BLUE[a] \cdot BLUE[a] + BLUE[a] \cdot BLUE[a] \cdot RED[b] + BLUE[a] \cdot RED[b] \cdot RED[b] + RED[b] \cdot RED[b] \cdot RED[b]\\
\end{aligned}
\]
基本上它就是“每个<i>a</i><i>b</i>结合项”的和,在每个加号后面逐步的将<i>a</i>换成<i>b</i>。因此这也很简单。现在你已经知道了二次多项式,为了叙述的完整性,我将给出一般方程:
\[
Bézier(n,t) = \sum_{i=0}^{n}
\underset{binomial~term}{\underbrace{\binom{n}{i}}}
\textit{Bézier}(n,t) = \sum_{i=0}^{n}
\underset{\textit{binomial term}}{\underbrace{\binom{n}{i}}}
\cdot\
\underset{polynomial~term}{\underbrace{(1-t)^{n-i} \cdot t^{i}}}
\underset{\textit{polynomial term}}{\underbrace{(1-t)^{n-i} \cdot t^{i}}}
\]
这就是贝塞尔曲线完整的描述。在这个函数中的Σ表示了这是一系列的加法(用Σ下面的变量,从...=<>开始,直到Σ上面的数字结束)。

View File

@@ -5,13 +5,13 @@ Now that we know the mathematics behind Bézier curves, there's one curious thin
It all has to do with how we run from "the start" of our curve to "the end" of our curve. If we have a value that is a mixture of two other values, then the general formula for this is:
\[
mixture = a \cdot value_1 + b \cdot value_2
\textit{mixture} = a \cdot \textit{value}_1 + b \cdot \textit{value}_2
\]
The obvious start and end values here need to be `a=1, b=0`, so that the mixed value is 100% value 1, and 0% value 2, and `a=0, b=1`, so that the mixed value is 0% value 1 and 100% value 2. Additionally, we don't want "a" and "b" to be independent: if they are, then we could just pick whatever values we like, and end up with a mixed value that is, for example, 100% value 1 **and** 100% value 2. In principle that's fine, but for Bézier curves we always want mixed values *between* the start and end point, so we need to make sure we can never set "a" and "b" to some values that lead to a mix value that sums to more than 100%. And that's easy:
\[
m = a \cdot value_1 + (1 - a) \cdot value_2
m = a \cdot \textit{value}_1 + (1 - a) \cdot \textit{value}_2
\]
With this we can guarantee that we never sum above 100%. By restricting `a` to values in the interval [0,1], we will always be somewhere between our two values (inclusively), and we will always sum to a 100% mix.

View File

@@ -5,13 +5,13 @@
このことは、曲線の「始点」から曲線の「終点」までどうやって動かすか、ということにすべて関係しています。2つの値を混ぜ合わせて1つの値をつくる場合、一般の式は次のようになります。
\[
混ぜ合わさった値 = a \cdot _1 + b \cdot _2
\textit{混ぜ合わさった値} = a \cdot \textit{値}_1 + b \cdot \textit{値}_2
\]
明らかに、始点では`a=1, b=0`とする必要があります。こうすれば、値1が100%、値2が0%で混ぜ合わさるからです。また、終点では`a=0, b=1`とする必要があります。こうすれば、値1が0%、値2が100%で混ぜ合わさります。これに加えて、`a``b`を独立にしておきたくはありません。独立になっている場合、何でも好きな値にすることできますが、こうすると例えば「値1が100%**かつ**値2が100%」のようなことが可能になってしまいます。これはこれで原則としてはかまいませんが、ベジエ曲線の場合は混ぜ合わさった値が常に始点と終点の*間*になってほしいのです。というわけで、混ぜ合わせの和が100%を決して超えないように、`a``b`の値を設定する必要があります。これは次のようにすれば簡単です。
\[
混ぜ合わさった値 = a \cdot _1 + (1 - a) \cdot _2
\textit{混ぜ合わさった値} = a \cdot \textit{値}_1 + (1 - a) \cdot \textit{値}_2
\]
こうすれば、和が100%を超えることはないと保証できます。`a`の値を区間[0,1]に制限してしまえば、混ぜ合わさった値は常に2つの値の間のどこか両端を含むになり、また和は常に100%になります。

View File

@@ -5,13 +5,13 @@
Последнее обусловленно тем, как мы определяем "начало" и "конец" нашей кривой. Если у нас есть значение, которое представляет собой сочетание двух других значений, тогда общая формула для этого будет:
\[
mixture = a \cdot value_1 + b \cdot value_2
\textit{mixture} = a \cdot \textit{value}_1 + b \cdot \textit{value}_2
\]
Очевидно, что начальное и конечное значения `a` и `b` должны быть `a=1, b=0`, чтобы в начале получать вывод 100% первого показателя и 0% второго; и `a=0, b=1`, чтобы в конце получать 0% value 1 и 100% value 2. В дополнение, мы не хотим чтобы "a" и "b" были независимыми, в коем случае можно было бы присвоить им любые значения и на выводе получить, например, 100% первого показателя **и** 100% второго. В принципе, с последним все ок, но в случае кривых Безье, мы всегда должны получать значение *между* двух крайностей, потому нельзя присвоить `a` и `b` значения, которые бы вместе составляли суму более 100% на выводе, что можно записать как:
\[
m = a \cdot value_1 + (1 - a) \cdot value_2
m = a \cdot \textit{value}_1 + (1 - a) \cdot \textit{value}_2
\]
С этим у нас есть гарантия, что мы не получим суму значений пропорций более 100%. Мы ограничиваем значение `a` интервалом [0,1], потому всегда получаем вывод из пропорционального смешения двух показателей, с сумой смесителей не превышающей 100%.

View File

@@ -5,13 +5,13 @@
这一切都与我们如何从曲线的“起点”变化到曲线“终点”有关。如果有一个值是另外两个值的混合,一般方程如下:
\[
mixture = a \cdot value_1 + b \cdot value_2
\textit{mixture} = a \cdot \textit{value}_1 + b \cdot \textit{value}_2
\]
很显然,起始值需要`a=1, b=0`混合值就为100%的value 1和0%的value 2。终点值需要`a=0, b=1`则混合值是0%的value 1和100%的value 2。另外我们不想让“a”和“b”是互相独立的:如果它们是互相独立的话我们可以任意选出自己喜欢的值并得到混合值比如说100%的value1和100%的value2。原则上这是可以的但是对于贝塞尔曲线来说我们通常想要的是起始值和终点值*之间*的混合值所以要确保我们不会设置一些“a”和"b"而导致混合值超过100%。这很简单:
\[
m = a \cdot value_1 + (1 - a) \cdot value_2
m = a \cdot \textit{value}_1 + (1 - a) \cdot \textit{value}_2
\]
用这个式子我们可以保证相加的值永远不会超过100%。通过将`a`限制在区间[01],我们将会一直处于这两个值之间包括这两个端点并且相加为100%。

View File

@@ -33,7 +33,7 @@ Although with the [caveat](https://en.wikipedia.org/wiki/Caveat_emptor#Caveat_le
The derivative of a cubic Bézier curve is a quadratic Bézier curve, and finding the roots for a quadratic polynomial means we can apply the [Quadratic formula](https://en.wikipedia.org/wiki/Quadratic_formula). If you've seen it before, you'll remember it, and if you haven't, it looks like this:
\[
Given~f(t) = at^2 + bt + c,~f(t)=0~when~t = \frac{-b \pm \sqrt{b^2 - 4ac}}{2a}
\textit{Given}~f(t) = at^2 + bt + c,~f(t)=0 ~\textit{when}~ t = \frac{-b \pm \sqrt{b^2 - 4ac}}{2a}
\]
So, if we can rewrite the Bézier component function as a plain polynomial, we're done: we just plug in the values into the quadratic formula, check if that square root is negative or not (if it is, there are no roots) and then just compute the two values that come out (because of that plus/minus sign we get two). Any value between 0 and 1 is a root that matters for Bézier curves, anything below or above that is irrelevant (because Bézier curves are only defined over the interval [0,1]). So, how do we convert?
@@ -42,8 +42,8 @@ First we turn our cubic Bézier function into a quadratic one, by following the
\[
\begin{array}{l}
B(t)~uses~\{ p_1,p_2,p_3,p_4 \} \\
B'(t)~uses~\{ v_1,v_2,v_3 \},~where~v_1 = 3(p_2-p_1),~v_2 = 3(p_3-p_2),~v_3 = 3(p_4-p_3)
B(t)~\textit{uses}~\{ p_1,p_2,p_3,p_4 \} \\
B'(t)~\textit{uses}~\{ v_1,v_2,v_3 \},~\textit{where}~v_1 = 3(p_2-p_1),~v_2 = 3(p_3-p_2),~v_3 = 3(p_4-p_3)
\end{array}
\]

View File

@@ -13,7 +13,7 @@ What we need to do is solve a simple equation:
What we're saying here is that given the curvature function *C(t)*, we want to know for which values of *t* this function is zero, meaning there is no "curvature", which will be exactly at the point between our circle being on one side of the curve, and our circle being on the other side of the curve. So what does *C(t)* look like? Actually something that seems not too hard:
\[
C(t) = Bézier_x\prime(t) \cdot Bézier_y{\prime\prime}(t) - Bézier_y\prime(t) \cdot Bézier_x{\prime\prime}(t)
C(t) = \textit{Bézier}_x\prime(t) \cdot \textit{Bézier}_y{\prime\prime}(t) - \textit{Bézier}_y\prime(t) \cdot \textit{Bézier}_x{\prime\prime}(t)
\]
The function *C(t)* is the cross product between the first and second derivative functions for the parametric dimensions of our curve. And, as already shown, derivatives of Bézier curves are just simpler Bézier curves, with very easy to compute new coefficients, so this should be pretty easy.
@@ -28,9 +28,9 @@ Of course, before we do our aligned check, let's see what happens if we compute
\[
\begin{aligned}
& Bézier(t) = x_1(1-t)^3 + 3x_2(1-t)^2t + 3x_3(1-t)t^2 + x_4t^3 \\
& Bézier^\prime(t) = a(1-t)^2 + 2b(1-t)t + ct^2~ \left\{ a=3(x_2-x_1),b=3(x_3-x_2),c=3(x_4-x_3) \right\} \\
& Bézier^{\prime\prime}(t) = u(1-t) + vt~\left\{ u=2(b-a),v=2(c-b) \right\}\
& \textit{Bézier}(t) = x_1(1-t)^3 + 3x_2(1-t)^2t + 3x_3(1-t)t^2 + x_4t^3 \\
& \textit{Bézier}^\prime(t) = a(1-t)^2 + 2b(1-t)t + ct^2~ \left\{ a=3(x_2-x_1),b=3(x_3-x_2),c=3(x_4-x_3) \right\} \\
& \textit{Bézier}^{\prime\prime}(t) = u(1-t) + vt~\left\{ u=2(b-a),v=2(c-b) \right\}\
\end{aligned}
\]
@@ -38,9 +38,9 @@ And of course the same functions for *y*:
\[
\begin{aligned}
& Bézier(t) = y_1(1-t)^3 + 3y_2(1-t)^2t + 3y_3(1-t)t^2 + y_4t^3 \\
& Bézier^\prime(t) = d(1-t)^2 + 2e(1-t)t + ft^2\\
& Bézier^{\prime\prime}(t) = w(1-t) + zt
& \textit{Bézier}(t) = y_1(1-t)^3 + 3y_2(1-t)^2t + 3y_3(1-t)t^2 + y_4t^3 \\
& \textit{Bézier}^\prime(t) = d(1-t)^2 + 2e(1-t)t + ft^2\\
& \textit{Bézier}^{\prime\prime}(t) = w(1-t) + zt
\end{aligned}
\]

View File

@@ -155,7 +155,7 @@ Deriving the two segments upon splitting a curve takes a few steps, and the high
1 & t & t^2
\end{bmatrix}
\cdot
\underset{we~turn~this...}{\underbrace{\kern 2.25em Z \cdot M \kern 2.25em}}
\underset{\textit{we turn this...}}{\underbrace{\kern 2.25em Z \cdot M \kern 2.25em}}
\cdot
\begin{bmatrix}
P_1 \\ P_2 \\ P_3
@@ -168,7 +168,7 @@ Deriving the two segments upon splitting a curve takes a few steps, and the high
1 & t & t^2
\end{bmatrix}
\cdot
\underset{...into~this...}{\underbrace{ M \cdot M^{-1} \cdot Z \cdot M }}
\underset{\textit{into this...}}{\underbrace{ M \cdot M^{-1} \cdot Z \cdot M }}
\cdot
\begin{bmatrix}
P_1 \\ P_2 \\ P_3
@@ -182,7 +182,7 @@ Deriving the two segments upon splitting a curve takes a few steps, and the high
\end{bmatrix}
\cdot
M
\underset{...to~get~this!}{\underbrace{ \kern 1.25em \cdot \kern 1.25em Q \kern 1.25em \cdot \kern 1.25em}}
\underset{\textit{...to get this!}}{\underbrace{ \kern 1.25em \cdot \kern 1.25em Q \kern 1.25em \cdot \kern 1.25em}}
\begin{bmatrix}
P_1 \\ P_2 \\ P_3
\end{bmatrix}

View File

@@ -155,7 +155,7 @@
1 & t & t^2
\end{bmatrix}
\cdot
\underset{これを…}{\underbrace{\kern 2.25em Z \cdot M \kern 2.25em}}
\underset{\textit{これを…}}{\underbrace{\kern 2.25em Z \cdot M \kern 2.25em}}
\cdot
\begin{bmatrix}
P_1 \\ P_2 \\ P_3
@@ -168,7 +168,7 @@
1 & t & t^2
\end{bmatrix}
\cdot
\underset{…こうして…}{\underbrace{ M \cdot M^{-1} \cdot Z \cdot M }}
\underset{\textit{…こうして…}}{\underbrace{ M \cdot M^{-1} \cdot Z \cdot M }}
\cdot
\begin{bmatrix}
P_1 \\ P_2 \\ P_3
@@ -182,7 +182,7 @@
\end{bmatrix}
\cdot
M
\underset{…こうじゃ!}{\underbrace{ \kern 1.25em \cdot \kern 1.25em Q \kern 1.25em \cdot \kern 1.25em}}
\underset{\textit{…こうじゃ!}}{\underbrace{ \kern 1.25em \cdot \kern 1.25em Q \kern 1.25em \cdot \kern 1.25em}}
\begin{bmatrix}
P_1 \\ P_2 \\ P_3
\end{bmatrix}

View File

@@ -5,13 +5,13 @@ Armed with knowledge of the "ABC" relation, point-on-curve projection, and guest
For quadratic curve, this is a really simple trick: we project our cursor onto the curve, which gives us a `t` value and initial `B` coordinate. We don't even need the latter: with our `t` value and "wherever the cursor is" as target `B`, we can compute the associated `C`:
\[
C = u(t)_{q} \cdot Start + \left ( 1-u(t)_{q} \right ) \cdot End
C = u(t)_{q} \cdot \textit{Start} + \left ( 1-u(t)_{q} \right ) \cdot \textit{End}
\]
And then the associated `A`:
\[
A = B - \frac{C - B}{ratio(t)_{q}} = B + \frac{B - C}{ratio(t)_{q}}
A = B - \frac{C - B}{\textit{ratio}(t)_{q}} = B + \frac{B - C}{\textit{ratio}(t)_{q}}
\]
And we're done, because that's our new quadratic control point!

View File

@@ -4,9 +4,9 @@ If you want to move objects along a curve, or "away from" a curve, the two vecto
\[
\begin{matrix}
tangent_x(t) = B'_x(t) \\
\textit{tangent}_x(t) = B'_x(t) \\
\\
tangent_y(t) = B'_y(t)
\textit{tangent}_y(t) = B'_y(t)
\end{matrix}
\]
@@ -14,14 +14,14 @@ This gives us the directional vector we want. We can normalize it to give us uni
\[
\begin{matrix}
d = \left \| tangent(t) \right \| = \sqrt{B'_x(t)^2 + B'_y(t)^2} \\
d = \left \| \textit{tangent}(t) \right \| = \sqrt{B'_x(t)^2 + B'_y(t)^2} \\
\\
\hat{x}(t) = \left \| tangent_x(t) \right \|
=\frac{tangent_x(t)}{ \left \| tangent(t) \right \| }
\hat{x}(t) = \left \| \textit{tangent}_x(t) \right \|
=\frac{\textit{tangent}_x(t)}{ \left \| \textit{tangent}(t) \right \| }
= \frac{B'_x(t)}{d} \\
\\
\hat{y}(t) = \left \| tangent_y(t) \right \|
= \frac{tangent_y(t)}{ \left \| tangent(t) \right \| }
\hat{y}(t) = \left \| \textit{tangent}_y(t) \right \|
= \frac{\textit{tangent}_y(t)}{ \left \| \textit{tangent}(t) \right \| }
= \frac{B'_y(t)}{d}
\end{matrix}
\]
@@ -30,9 +30,9 @@ The tangent is very useful for moving along a line, but what if we want to move
\[
\begin{array}{l}
normal_x(t) = \hat{x}(t) \cdot \cos{\frac{\pi}{2}} - \hat{y}(t) \cdot \sin{\frac{\pi}{2}} = - \hat{y}(t) \\
\textit{normal}_x(t) = \hat{x}(t) \cdot \cos{\frac{\pi}{2}} - \hat{y}(t) \cdot \sin{\frac{\pi}{2}} = - \hat{y}(t) \\
\\
normal_y(t) = \underset{quarter~circle~rotation} {\underbrace{ \hat{x}(t) \cdot \sin{\frac{\pi}{2}} + \hat{y}(t) \cdot \cos{\frac{\pi}{2}} }} = \hat{x}(t)
\textit{normal}_y(t) = \underset{\textit{quarter circle rotation}} {\underbrace{ \hat{x}(t) \cdot \sin{\frac{\pi}{2}} + \hat{y}(t) \cdot \cos{\frac{\pi}{2}} }} = \hat{x}(t)
\end{array}
\]

View File

@@ -21,7 +21,7 @@ Dragging the control points around only affects the curve segments that the cont
We can effect this quite easily, because we know that the vector from a curve's last control point to its last on-curve point is equal to the derivative vector. If we want to ensure that the first control point of the next curve matches that, all we have to do is mirror that last control point through the last on-curve point. And mirroring any point A through any point B is really simple:
\[
Mirrored = \left [
\textit{Mirrored} = \left [
\begin{matrix} B_x + (B_x - A_x) \\ B_y + (B_y - A_y) \end{matrix}
\right ] = \left [
\begin{matrix} 2B_x - A_x \\ 2B_y - A_y \end{matrix}

View File

@@ -7,13 +7,13 @@ If we have a curve with three points, then we can create a curve with four point
The general rule for raising an *n<sup>th</sup>* order curve to an *(n+1)<sup>th</sup>* order curve is as follows (observing that the start and end weights are the same as the start and end weights for the old curve):
\[
Bézier(k,t) = \sum_{i=0}^{k}
\underset{binomial~term}{\underbrace{\binom{k}{i}}}
\textit{Bézier}(k,t) = \sum_{i=0}^{k}
\underset{\textit{binomial term}}{\underbrace{\binom{k}{i}}}
\cdot\
\underset{polynomial~term}{\underbrace{(1-t)^{k-i} \cdot t^{i}}}
\underset{\textit{polynomial term}}{\underbrace{(1-t)^{k-i} \cdot t^{i}}}
~\cdot \
\underset{new~weights}{\underbrace{\left ( \frac{(k-i) \cdot w_i + i \cdot w_{i-1}}{k} \right )}}
~,~with~k = n+1~and~w_{i-1}=0~when~i = 0
\underset{\textit{new weights}}{\underbrace{\left ( \frac{(k-i) \cdot w_i + i \cdot w_{i-1}}{k} \right )}}
~,~\textit{with}~k = n+1~\textit{and}~w_{i-1}=0~when~i = 0
\]
However, this rule also has as direct consequence that you **cannot** generally safely lower a curve from *n<sup>th</sup>* order to *(n-1)<sup>th</sup>* order, because the control points cannot be "pulled apart" cleanly. We can try to, but the resulting curve will not be identical to the original, and may in fact look completely different.
@@ -23,7 +23,7 @@ However, there is a surprisingly good way to ensure that a lower order curve loo
We start by taking the standard Bézier function, and condensing it a little:
\[
Bézier(n,t)
\textit{Bézier}(n,t)
=
\sum_{i=0}^{n} w_i B^n_i(t)
\textit{, where }
@@ -42,7 +42,7 @@ So, with that seemingly trivial observation, we rewrite that Bézier function by
\[
\begin{aligned}
Bézier(n,t) &= (1-t) B(n,t) + t B(n,t) \\
\textit{Bézier}(n,t) &= (1-t) B(n,t) + t B(n,t) \\
&= \sum_{i=0}^{n} w_i (1 - t) B^n_i(t) + \sum_{i=0}^{n} w_i t B^n_i(t)
\end{aligned}
\]

View File

@@ -5,13 +5,13 @@ We can further control Bézier curves by "rationalising" them: that is, adding a
Adding these ratio values to the regular Bézier curve function is fairly easy. Where the regular function is the following:
\[
Bézier(n,t) = \sum_{i=0}^{n} \binom{n}{i} \cdot (1-t)^{n-i} \cdot t^{i} \cdot w_i
\textit{Bézier}(n,t) = \sum_{i=0}^{n} \binom{n}{i} \cdot (1-t)^{n-i} \cdot t^{i} \cdot w_i
\]
The function for rational Bézier curves has two more terms:
\[
Rational~Bézier(n,t) = \frac{ \sum_{i=0}^{n} \binom{n}{i} \cdot (1-t)^{n-i} \cdot t^{i} \cdot w_i \cdot BLUE[ratio_i] }{ BLUE[ \sum_{i=0}^{n} \binom{n}{i} \cdot (1-t)^{n-i} \cdot t^{i} \cdot ratio_i ] }
\textit{Rational Bézier}(n,t) = \frac{ \sum_{i=0}^{n} \binom{n}{i} \cdot (1-t)^{n-i} \cdot t^{i} \cdot w_i \cdot BLUE[ratio_i] }{ BLUE[ \sum_{i=0}^{n} \binom{n}{i} \cdot (1-t)^{n-i} \cdot t^{i} \cdot ratio_i ] }
\]
In this, the first new term represents an additional weight for each coordinate. For example, if our ratio values are [1, 0.5, 0.5, 1] then <code>ratio<sub>0</sub> = 1</code>, <code>ratio<sub>1</sub> = 0.5</code>, and so on, and is effectively identical as if we were just using different weight. So far, nothing too special.

View File

@@ -5,13 +5,13 @@
Как и прочее, воплощение этого коэффициента не должно составить нам особого труда. Тогда как обычная функция:
\[
Bézier(n,t) = \sum_{i=0}^{n} \binom{n}{i} \cdot (1-t)^{n-i} \cdot t^{i} \cdot w_i
\textit{Bézier}(n,t) = \sum_{i=0}^{n} \binom{n}{i} \cdot (1-t)^{n-i} \cdot t^{i} \cdot w_i
\]
Функция для соотносительных кривых Безье имеет два дополнительных термина:
\[
Rational~Bézier(n,t) = \frac{ \sum_{i=0}^{n} \binom{n}{i} \cdot (1-t)^{n-i} \cdot t^{i} \cdot w_i \cdot BLUE[ratio_i] }{ BLUE[ \sum_{i=0}^{n} \binom{n}{i} \cdot (1-t)^{n-i} \cdot t^{i} \cdot ratio_i ] }
\textit{Rational Bézier}(n,t) = \frac{ \sum_{i=0}^{n} \binom{n}{i} \cdot (1-t)^{n-i} \cdot t^{i} \cdot w_i \cdot BLUE[ratio_i] }{ BLUE[ \sum_{i=0}^{n} \binom{n}{i} \cdot (1-t)^{n-i} \cdot t^{i} \cdot ratio_i ] }
\]
Первый из добавочных терминов, представляет собой дополнительный "вес" для каждой координаты, Например если наши значения соотношений [1, 0.5, 0.5, 1], тогда <code>частица<sub>0</sub> = 1</code>, <code>частица<sub>1</sub> = 0.5</code> и т.д., и на практике ничем не отличается от использования дополнительного "вес"-а. Пока ничего особо выдающегося.

View File

@@ -7,14 +7,14 @@ Bézier curves are the result of [linear interpolations](https://en.wikipedia.or
If we know the distance between those two points, and we want a new point that is, say, 20% the distance away from the first point (and thus 80% the distance away from the second point) then we can compute that really easily:
\[
Given \left (
\textit{Given} \left (
\begin{aligned}
p_1 &= some~point \\
p_2 &= some~other~point \\
distance &= (p_2 - p_1) \\
ratio &= \frac{percentage}{100} \\
p_1 &= \textit{some point} \\
p_2 &= \textit{some other point} \\
\textit{distance} &= (p_2 - p_1) \\
\textit{ratio} &= \frac{\textit{percentage}}{100} \\
\end{aligned}
\right ),~our~new~point = p_1 + distance \cdot ratio
\right ),~\textit{our new point} = p_1 + \textit{distance} \cdot \textit{ratio}
\]
So let's look at that in action: the following graphic is interactive in that you can use your up and down arrow keys to increase or decrease the interpolation ratio, to see what happens. We start with three points, which gives us two lines. Linear interpolation over those lines gives us two points, between which we can again perform linear interpolation, yielding a single point. And that point —and all points we can form in this way for all ratios taken together— form our Bézier curve:

View File

@@ -9,12 +9,12 @@
\[
\left (
\begin{aligned}
p_1 &= 一方の点 \\
p_2 &= もう一方の点 \\
距離 &= (p_2 - p_1) \\
比率 &= \frac{百分率}{100} \\
p_1 &= \textit{一方の点} \\
p_2 &= \textit{もう一方の点} \\
\textit{距離} &= (p_2 - p_1) \\
\textit{比率} &= \frac{\textit{百分率}}{100} \\
\end{aligned}
\right )のとき、新しい点 = p_1 + 距離 \cdot 比率
\right ) \textit{のとき、新しい点} = p_1 + \textit{距離} \cdot \textit{比率}
\]
では、実際に見てみましょう。下の図はインタラクティブになっています。上下キーで補間の比率が増減しますので、どうなるか確かめてみましょう。最初に3点があり、それを結んで2本の直線が引かれています。この直線の上でそれぞれ線形補間を行うと、2つの点が得られます。この2点の間でさらに線形補間を行うと、1つの点を得ることができます。そして、あらゆる比率に対して同様に点を求め、それをすべて集めると、このようにベジエ曲線ができるのです。

View File

@@ -7,14 +7,14 @@
Вот, скажем, зная расстояние между двух точек и желая поставить третью на удалении 20ти % этого расстояния до первой и, соответственно, 80ти % до второй, вычислить результат можно следующим образом:
\[
Дано \left (
\textit{Дано} \left (
\begin{aligned}
p_1 &= неикая~точка \\
p_2 &= неикая~другая~точка \\
расстояние &= (p_2 - p_1) \\
соотношение &= \frac{процентаж}{100} \\
p_1 &= \textit{неикая точка} \\
p_2 &= \textit{неикая другая точка} \\
\textit{расстояние} &= (p_2 - p_1) \\
\textit{соотношение} &= \frac{\textit{процентаж}}{100} \\
\end{aligned}
\right ),~наша~новая~точка = p_1 + расстояние \cdot соотношение
\right ),~\textit{наша новая точка} = p_1 + \textit{расстояние} \cdot \textit{соотношение}
\]
Что же, посмотрим на это в действии: ниже представлена интерактивная проекция, кликнув на ползунок, можно пользоваться клавишами вниз-вверх для увеличения и уменьшения соотношения интерполяции и наблюдать получаемый результат. Сначала, основываясь на трех точках, задаем два отрезка, затем производим линейную интерполяцию по длине каждого из них, получая еще две точки. Далее мы опять производим линейную интерполяцию уже между полученными точками и в итоге получаем искомую точку. (* на изображении видим 3 проекции соответственно этим трем действиям).

View File

@@ -7,14 +7,14 @@
如果我们知道两点之间的距离并想找出离第一个点20%间距的一个新的点(也就是离第二个点80%的间距),我们可以通过简单的计算来得到:
\[
Given \left (
\textit{Given} \left (
\begin{aligned}
p_1 &= some~point \\
p_2 &= some~other~point \\
distance &= (p_2 - p_1) \\
ratio &= \frac{percentage}{100} \\
p_1 &= \textit{some point} \\
p_2 &= \textit{some other point} \\
\textit{distance} &= (p_2 - p_1) \\
\textit{ratio} &= \frac{\textit{percentage}}{100} \\
\end{aligned}
\right ),~our~new~point = p_1 + distance \cdot ratio
\right ),~\textit{our new point} = p_1 + \textit{distance} \cdot \textit{ratio}
\]
让我们来通过实际操作看一下:下面的图形都是可交互的,因此你可以通过上下键来增加或减少插值距离,来观察图形的变化。我们从三个点构成的两条线段开始。通过对各条线段进行线性插值得到两个点,对点之间的线段再进行线性插值,产生一个新的点。最终这些点——所有的点都可以通过选取不同的距离插值产生——构成了贝塞尔曲线

View File

@@ -13,19 +13,19 @@ Now, if you look more closely at that right graphic, you'll notice something int
First, let's look at the function for x(t):
\[
x(t) = a(1-t)³ + 3b(1-t)²t + 3c(1-t)t² + dt³
x(t) = a(1-t)^3 + 3b(1-t)^2t + 3c(1-t)t^2 + dt^3
\]
We can rewrite this to a plain polynomial form, by just fully writing out the expansion and then collecting the polynomial factors, as:
\[
x(t) = (-a + 3b- 3c + d)t³ + (3a - 6b + 3c)t² + (-3a + 3b)t + a
x(t) = (-a + 3b- 3c + d)t^3 + (3a - 6b + 3c)t^2 + (-3a + 3b)t + a
\]
Nothing special here: that's a standard cubic polynomial in "power" form (i.e. all the terms are ordered by their power of `t`). So, given that `a`, `b`, `c`, `d`, *and* `x(t)` are all known constants, we can trivially rewrite this (by moving the `x(t)` across the equal sign) as:
\[
(-a + 3b - 3c + d)t³ + (3a - 6b + 3c)t² + (-3a + 3b)t + (a-x) = 0
(-a + 3b - 3c + d)t^3 + (3a - 6b + 3c)t^2 + (-3a + 3b)t + (a-x) = 0
\]
You might be wondering "where did all the other 'minus x' for all the other values a, b, c, and d go?" and the answer there is that they all cancel out, so the only one we actually need to subtract is the one at the end. Handy! So now we just solve this equation using Cardano's algorithm, and we're left with some rather short code:

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 22 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 11 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 13 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 17 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 17 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 12 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 12 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 15 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 12 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 11 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 22 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 13 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 15 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 12 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 17 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 17 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 15 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 11 KiB

After

Width:  |  Height:  |  Size: 11 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 11 KiB

After

Width:  |  Height:  |  Size: 11 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 15 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 48 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 48 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 12 KiB

After

Width:  |  Height:  |  Size: 12 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 37 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 18 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 24 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 23 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 17 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 37 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 17 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 17 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 70 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 70 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 29 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 27 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 35 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 23 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 29 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 34 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 23 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 23 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 27 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 23 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 28 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 28 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 28 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 28 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 35 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 34 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 49 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 6.2 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 49 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 6.2 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 24 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 24 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 11 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 11 KiB

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 18 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 18 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 16 KiB

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 17 KiB

Some files were not shown because too many files have changed in this diff Show More