Криви на Безие, компютърна графика
Криви на Безие
Кривите на Безие се използват в компютърната графика за изчертаване на плавни криви, в CSS анимация и много други.
Въпреки „умното“ име, това е много просто нещо.
По принцип можете да създавате анимация, без да знаете кривите на Безие, но си струва да изучите тази тема поне веднъж, за да използвате този прекрасен инструмент с комфорт в бъдеще. Освен това в света на векторната графика и усъвършенстваните анимации няма начин без тях.
Видове криви на Безие
Кривата на Безие се определя от опорни точки.
Те могат да бъдат два, три, четири или повече. Например:
Две точки:
Три точки:
Четири точки:
Ако се вгледате внимателно в тези криви, ще забележите „на око“:
- Точките не винаги са на крива. Това е напълно нормално, ще разгледаме как се изгражда кривата малко по-късно.
- Степента на кривата е равна на броя точки минус един. За две точки това е линейна крива (т.е. права), за три точки е квадратна крива (парабола), за четири точки е кубична.
- Кривата винаги е вътре в изпъкналия корпус, образуван от опорните точки:
Благодарение на последното свойство в компютърната графика е възможно да се оптимизира проверката на пресичането на две криви. Ако изпъкналите им корпуси не се пресичат, кривите също не се пресичат.
Основната стойност на кривите на Безие за рисуване е, че чрез преместване на точките кривата може да бъде променена и кривата се променя по интуитивен начин.
С малко практика става ясно как да позиционирате точките, за да получите формата, която искате. И като свържете множество криви, можете да получите почти всичко.
Ето няколко примера:
Кривите на Безие имат математическа формула.
Както ще видим по-късно, няма специална нужда да го знаем, за да използваме криви на Безие, но за пълнота, ето го.
Координатите на кривите са описани в зависимост от параметъра t⋲ [0,1]
За четири точки:
Вместо Pi трябва да замените координатите на i-та контролна точка (xi, yi).
Тези уравнения са векторни, т.е.за всяка от координатите:
Вместо x1, y1, x2, y2, x3, y3 се заместват координатите на три контролни точки и докато t преминава през множеството от 0 до 1, съответните стойности (x, y) образуват кривата.