Как я могу интерполировать вокруг прямоугольника?

Я хочу сделать необычную анимацию, где точка движется вокруг прямоугольника. Я хочу найти позицию точки одновременно t.

Прямоугольник дается X, Y, Widthи Height.

Есть ли алгоритм для этого?

Я использовал sin/ cosдля кругов. Каков эквивалентный подход для прямоугольников?

Я предполагаю, что ваш т идет от 0 до 1 . (Если нет, просто умножьте, чтобы масштабировать его соответствующим образом.)

Выясните, какая пропорция ( 0 - 1 ) каждой стороны периметра. ( длина стороны / общий периметр )

Чтобы узнать, сколько каждой стороны «заполнено» в момент времени t , переберите стороны, вычитая их пропорции до тех пор, пока t не опустится до отрицательного значения. Это последнее ребро (из-за которого t стало отрицательным) заполняется пропорцией (длина стороны + оставшаяся часть) / длина стороны . Остальные не заполнены.

Чтобы получить точное положение вектора в точке t , умножьте вектор каждой стороны на пропорцию той стороны, которая заполнена, и сложите их.

Это работает для любого многоугольника на самом деле!

Синус и косинус t являются соответственно координатами y и x точки на окружности, образующей угол t с осью x. Нет необходимости в этом в прямоугольнике! Прямоугольник состоит из четырех линий. Если tидет от 0к 1, он достигает точки (px,py)в t==0и к (qx,qy)в t==1с помощью строки, заданной:

(l(x),l(y)) = (t*qx + (1-t)*px, t*qy + (1-t)*py)

если вместо 0и 1вы переходите от времени t0к t1, вы можете сначала нормализовать время, а затем применить приведенную выше формулу.

(l(x),l(y)) = (  ((t-t0)/(t1-t0))*qx + ((t1-t)/(t1-t0))*px, ((t-t0)/(t1-t0))*qy + ((t1-t)/(t1-t0))*py  )

Теперь, для вашего прямоугольника, разделите на четыре случая ifпо каждому ребру, которое покрывает один промежуток времени, и примените движение линии.

Обратите внимание, что если ваш прямоугольник выровнен по оси, у вас всегда будет либо значение x, либо значение y, которое является постоянным. Например, для t между 0и a/4(и предположим (X, Y) внизу слева),

(l(x),l(y)) = ((4*t/a)*(X+Width) + (1-4*t/a)*(X), Y+Height)

Что также равно:

(l(x),l(y)) = (X + (1-4*t/a)*(Width), Y+Height)

Я не знаю, есть ли реальный алгоритм для этого, но я сделал его сам (Java):

int points = 4; // for a rectangle
double progress = 0.0; // 0.0 -> 1.0 (with 1.0 being 100%)
double pp = points * progress; // This calculation would otherwise be done multiple times

int p1 = Math.floor(pp);
int p2 = Math.ceil(pp);

while (p1 >= points) p1 -= points;
while (p2 >= points) p2 -= points;

double tmp = 2 * Math.PI / points;

int p1x = Math.cos(tmp * p1);
int p1y = Math.sin(tmp * p1);
int p2x = Math.cos(tmp * p2);
int p2y = Math.sin(tmp * p2);

double p = pp - Math.floor(pp);

int x = (1.0 - p) * p1x + p * p2x; // between -1.0 and 1.0
int y = (1.0 - p) * p2x + p * p2y; // between -1.0 and 1.0

if (p == 0.0) { // prevent a weird glitch when p = 0.0 (I think this is a glitch)
    x = p1x;
    y = p1y;
}

Вы должны преобразовать xи yпеременные , чтобы получить анимацию как большой или маленький , как вы хотите (путем умножения) и где вы хотите (добавление к / вычитания из х и у).

Я не тестировал этот код, но думаю, что он должен работать. Это также должно работать для любого многоугольника с любым количеством точек (вы также можете использовать немного кода для генерации многоугольника).

Дано :

a=total time

perimeter = WIDTH *2 + HEIGTH * 2;

По заданному времени T1как пройти Pпо периметру (при условии прямоугольного положения на 0,0)?

T1=T1%a; //use mod to have T1<a

distT1 = (T1*Perimeter)/a; //distance traveled in time T1

Теперь немного простой начальной геометрии школы и математики (надеюсь, вы меня пощадите), чтобы получить P.xи P.yизdistT1