Обчислення точок на кривій в Processing

У прикладі Малюємо криві ми навчилися малювати криві Безьє і сплайни Катмулла-Рома У цьому прикладі ми навчимося обчислювати точки на кривих за допомогою функцій bezierPoint () і curvePoint ()

Як це робиться

Ось код нашого прикладу Я використовував функцію noise () щоб показати рух точки по кривій Крива, намальована з функцією curve (), управляється рухом миші

float noiseOffset

void setup()

{

size( 640, 480 )

smooth() noiseOffset = 00

rectMode( CENTER )

}

void draw() { noiseOffset += 001

background( 255 )

// Bézier curve stroke( 0 ) noFill()

bezier( 40, 200, 120, 40, 300, 240, 600, 40 )

stroke( 255, 0, 0 )

line(     40, 200,  120,   40 )

line(     600, 40,  300,   240 )

fill( rect(    255 )

120, 40,

4, 4   

)

rect( 300, 240, 4, 4 )

float n = noise( noiseOffset )

float x = bezierPoint( 40, 120, 300, 600, n )

float y = bezierPoint( 200, 40, 240, 40, n )

stroke( 0 )

rect( x, y, 6, 6 )

float t = map( mouseX, 0, width, -50, 50 ) curveTightness( t )

// Catmull-Rom spline stroke( 0 ) noFill()

curve( 120, 240, 40, 400, 600, 240, 300, 440 )

stroke( 255, 0, 0 )

line( 120, 240, 40, 400 )

line( 600, 240, 300, 440 )

fill( 255 )

rect( 120, 240, 4, 4 )

rect( 300, 440, 4, 4 )

x = curvePoint( 120, 40, 600, 300, n )

y = curvePoint( 240, 400, 240, 440, n )

stroke( 0 )

rect( x, y, 6, 6 )

}

Результат роботи скетчу повинен виглядати так, як на цьому скріншоті Посувайте мишею і подивіться, як крива реагує на рух

Як це працює

Тут ми використовували кілька нових функцій для обчислення точок кривої Безьє і сплайнів Катмулла-Рома Розглянемо докладніше роботу цих функцій

f Функція bezierPoint () має пять параметрів Перші чотири – це координати опорних і керуючих точок кривої Пятий параметр – це число в діапазоні від 0 до 1 Для генерації цього параметра я використовував функцію noise (), вона видає число саме в цьому діапазоні Якщо величина пятого параметра буде близька до 0, то обчислена точка буде знаходитися ближче до першої опорної точки, а якщо до 1, то до другої Функція застосовується двічі – один раз для обчислення координати х нової точки, другий – для координати у

f Функція curvePoint () працює аналогічно функції bezierPoint ()

Погляньте на код і порівняйте параметри в цих функціях

Джерело: Ян Вантомм, Processing 2: креативне програмування, переклад з англійської Олександри Мішутіної, Published by Packt Publishing Ltd, 2012, BIRMINGHAM – MUMBAI

Схожі статті:


Сподобалася стаття? Ви можете залишити відгук або підписатися на RSS , щоб автоматично отримувати інформацію про нові статтях.

Коментарів поки що немає.

Ваш отзыв

Поділ на параграфи відбувається автоматично, адреса електронної пошти ніколи не буде опублікований, допустимий HTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

*

*