How to define transformation of curve using single parameter? - math

Let's assume I have a curve defined by 4 points and I have 2 'states' of curve, like on this picture:
I want to control the deformation of the curve by single parameter in range [0, 1], 0 is corresponding to upper curve and 1 corresponding to lower curve, intermediate values like 0.5 should represent some intermediate transformation from upper curve to lower curve. How it can be done?

Do you know how to parametrize the motion of one point?
Suppose you have a point that can move on a vertical line, its position varying between two extremes, y0 and y1.
Now assign a parameter t, which varies from 0 t0 1, so that y(t=0) = y0 and y(t=1) = y1.
Now make y a linear function of t: y(t) = y0 + t(y1-y0)
Now look at your curves. The only motion of the points to get from one state to the other appears to be vertical. So each of the four points moves like an example of the y(t) above, but with different values of x, y0 and y1. (From your drawing, it looks as if the two end points are stationary and the two middle points move the same way, but that's just a special case.)

Related

Given a cubic Bezier curve with fixed endpoints, how can I find the x position of a point along it when given a y position to check?

Let's say I have a Bezier curve with two fixed endpoints, one at x(0), y(1) and one at x(1), y(0) (bottom left corner and upper right corner)
Now let's say I have two control points, which can be at any locations between x(0), x(1), y(0), and y(1). For this question, I'll just say that control point #1 is at x(0.1) y(0.6) and control point #2 is at x(0.9) and at y(0.4). (This assumes a "from upper left" coordinate system)
Here's a small illustration of our curve:
Now let's say I'm given a y position of 0.7. What would the math look like to figure out what the corresponding x position is to the point at y(0.7)? How would I do this?
Sorry if this question doesn't belong here, but I figured this is a common problem faced in coding and that it's likely that many of you have the answer I'm looking for.
You have cubic equation for functions X(t) and Y(t) where t is curve parameter (range 0..1 for points on curve). In Bernstein polynomial basis (usual form for curve definition):
X(t) = P0.X*(1-t)^3+3*P1.X*(1-t)^2*t+3*P2.X*(1-t)*t^2+P3.X*t^3
Y(t) = P0.Y*(1-t)^3+3*P1.Y*(1-t)^2*t+3*P2.Y*(1-t)*t^2+P3.Y*t^3
Having Y value, we can find corresponding t parameters - note there might be from 0 to 3 possible roots in range 0..1. Representation of Y-component in power basis:
Y(t) = P0.Y*(1-t)^3+3*P1.Y*(1-t)^2*t+3*P2.Y*(1-t)*t^2+P3.Y*t^3 =
t^3*(P3Y-3P2Y+3P1Y-P0Y) + t^2*(3P2Y-6P1Y+3P0Y) + t^2*(3P1Y-3P0Y) + (P0Y) =
t^3*a + t^2*b + t^2*c + d' = y_position
and finally cubic equation is:
t^3*a + t^2*b + t^2*c + d = 0
where
a = P3.Y-3*P2.Y+3*P1.Y-P0.Y
b = 3*P2.Y-6*P1.Y+3*P0.Y
c = 3*P1.Y-3*P0.Y
d = P0.Y - y_position
Solve cubic equation to calculate t (perhaps some values for wavy curves)
Then for given t calculate corresponding X value:
X(t) = P0.X*(1-t)^3+3*P1.X*(1-t)^2*t+3*P2.X*(1-t)*t^2+P3.X*t^3

How to identify the roots of an equation by plotting it's real and imaginary parts

This is more of a general Maths question (might be silly even). But in high school we learn to identify the roots of an equation via it's plot right.
For example, for the equation
y = x^2 - 1
The blue line would show us the roots. This is when the blue line crosses x, so +- 1.
Now, if we said that the equation had a real and an imaginary part, so that it is
y = x^2 - 1 + (x^2 - 0.5)i
as given in the Mathematica screenshot, then we have a real part which crosses zero, and an imaginary part which also crosses zero but at a different x. So my question is: is it possible to identify the roots of such an equation by simply looking at the real and imaginary parts of the plot?
Note: part of my confusion is that if I use FindRoot, in Mathematica, I get either 0.877659 - 0.142424i or -0.877659 + 0.142424i. So might be some fundamental property in Maths I don't know about which prevents one from identifying roots of a complex function through separating real and imaginary parts...
we have a real part which crosses zero, and an imaginary part which also crosses zero but at a different x.
Those are graphs of the real and imaginary parts plotted for real values of x. If they both crossed the horizontal axis at the same point(s), that would mean the equation has real root(s), since both real and imaginary parts would be zero for some real value of x. However, this equation has no real roots, so the crossing points are different.
So my question is: is it possible to identify the roots of such an equation by simply looking at the real and imaginary parts of the plot?
f(x) = x^2 - 1 + i (x^2 - 0.5) is a complex function of a complex variable, which maps a complex variable x = a + i b to the complex value f(x) = Re(f(x)) + i Im(f(x)).
Each of Re(f(x)) and Im(f(x)) is a real function of a complex variable. Such functions can be plotted in 3D by representing x = a + i b as a point in the (a, b) plane, and the value of the function along the third dimension, say c. For example, f(x) has the following graphs for the real and imaginary parts.
The cross-sections of the two surfaces by the horizontal plane c = 0 are pairs of curves where each function is zero, respectively. It follows that the intersections of those curves are the points where Re(f(x)) = Im(f(x)) = 0, which means they are the roots of the equation f(x) = 0.
Since f(x) = 0 is a quadratic equation, it must have two roots, and those two points are in fact ±(0.877659 - 0.142424 i), as can be verified by direct calculation.

Area under the curve using idl

I have a curve between dff(x axis) and dc(y axis) and I calculated the area under the curve using IN_TABULATED function.
X=[-0.00205553,-0.00186668,-0.00167783,-0.00148899,-0.00130014,-0.00111129,-0.000922443,-0.000733597,-0.000450326,-0.000261480,0.000116216,0.000399487, 0.000588333,0.000777179,0.000966027,0.00115488,0.00134372,0.00153257,0.00172141,0.00181584,0.00200468]
F=[0.00000,21.0000,26.0000,57.0000,94.0000,148.000,248.000,270.000,388.000,418.000,379.000,404.000,358.000,257.000,183.000,132.000,81.0000,47.0000,23.0000,17.0000,431.000]
A=INT_TABULATED(X,F)
print, A
Now, I need to have a loop start from n,0 (from right to left) and calculate A1 which is 0.01 of A and to stop there, then print dff values which represent A1's area. How can I do this? Any suggestion will be helpful.
I'm not sure I fully understand the question, so let me begin by stating my interpretation. You have a curve which integrates to A. Starting from the right, you want the X-value (let's call it X1) which encloses 0.01 of A (the total area under the curve). In other words, 0.99 of the total area under the curve F is to the left of X1, and 0.01 of the area is to the right.
Assuming this interpretation is correct, here's a solution:
First, loop through the data and calculate the integral from 0 to each point.
npoints = n_elements(x)
; Initialize a vector to hold integration results
area_cumulative = []
; Loop through each data point, calculating integrals from 0 to that point
for index = 0, npoints-1 do begin
; Assume area under first point is zero, otherwise, calculate integral
if index eq 0 then area_up_to_point = 0d0 $
else area_up_to_point = int_tabulated(x[0:index], f[0:index])
; Store integral value in the cumulative vector
area_cumulative = [area_cumulative, area_up_to_point]
endfor
Then, you can interpolate to find X1:
;;; Find where cumulative distribution reaches 0.99 of A
a1 = 0.99 * a
x1 = interpol(x, area_cumulative, a1)
Here's an illustration. The upper plot is your data, and the lower plot is the cumulative area (integral from x[0] to x). The red dashed lines show X1 = 0.001952. The gray shaded region contains 0.01 of the total area.
Hope this helps!

What do the arguments to CSS3's animation-timing-function cubic-bezier() mean?

You pass cubic-bezier four different real number values, it creates a bezier curve.
For instance, cubic-bezier(0,0,1,1) creates a linear curve. cubic-bezier(0.25,0.1,0.25,1) creates an ease curve.
But a cubic bezier curve is defined by four points on a plane, and we only have four real values, which would only describe two points.
So what do these numbers mean?
From the MDN:
A cubic Bézier curve is defined by four points P0, P1, P2, and P3. P0 and P3 are the start and the end of the curve and, in CSS these points are fixed as the coordinates are ratios (the abscissa the ratio of time, the ordinate the ratio of the output range). P0 is (0, 0) and represents the initial time and the initial state, P3 is (1, 1) and represents the final time and the final state.
So the start and end points are automatically fixed at (0, 0) and (1, 1) - you are actually setting the inner two points (P1 and P2).

Using a Cubic Bezier Curve as a straight Line: where do the control points have to be located to get equidistant spacing for t

When the two control points of a cubic bezier curve are both located on the line between the two end points of the curve the resulting curve will be line. The issue in my case is that the actual spacing of the points on the curve that I get for different t's varies based on where the control points are located on that line.
If I calculate the locations of the two control points using a lerp between p1 and p2 like this:
controlPoint1 = endPoint1.lerp(endPoint2,a);
controlPoint2 = endPoint1.lerp(endPoint2,b);
there must be one configuration of a,b where the spacing will actually be equidistant. I tried 0.25/0.75, 0.3333/0.6666, 0.5/0.5 but none of these seem to cut it.
I believe the [0, 1/3, 2/3, 1] =[a, b, c, d] is the correct answer.
At least with these values the recursive bisection
e = a*(1-t)+b*t, f=b*(1-t)+c*t, g=c*(1-t)+d*t,
h = e*(1-t)+f*t, i=f*(1-t)+g*t,
j = h*(1-t)+i*t,
Gives j=t for all values.

Resources