Съдържание
Изчертаването на криви върху платно може да бъде просто или сложно, всичко зависи от това какво искате да постигнете, можете да направите някои интересни ефекти, които бихме могли да използваме за изграждане на някои функционалности на нашата страница, които се открояват от останалите направени страници в HTML5.Едно от нещата, които можем да направим, е да дадем усъвършенствана работа при създаването на извити линии, като с този тип инструменти ще бъдем по -близо до това, че нямаме ограничения, когато мислим какво може да направи нашата страница.
Начертайте крива при движение на мишката
Този случай е доста интересен, тъй като това, което правим, е да начертаем крива при преместване на мишката, освен това, ако натиснем който и да е клавиш на нашата клавиатура, някои точки от кривата се променят.
Например, ако натиснем клавиша ctrl, първата точка, която представлява края на под-пътека, ако натиснем клавиша shift, втората точка ще се премести, което са първите два аргумента на метода arcTo () и накрая, ако не натиснем нито един клавиш, третата точка, представена от последните два аргумента на метода, ще се премести.
Нека да видим по -долу кода, с който постигаме тези ефекти:
Пример Вашият браузър не поддържа елемента платно Както виждаме, първо в кода дефинираме манипулатора за приемане на събития на клавишите, които натискаме, в него установяваме стойностите, които трябва да бъдат взети.
Нека видим по -долу екранна снимка на това как това може да доведе до нашия браузър, важно е да споменем, че динамичните резултати могат да варират при възпроизвеждането на този пример:
Преди това използвахме само този метод arcTo ()Сега ще видим как работи методът arc (), обработката му е по -лесна, тъй като ние определяме точка на платното през първите два аргумента, а след това радиуса и ъгъла на кривата.
Нека видим следния пример за това как да нарисуваме три типа криви с този метод:
Пример Вашият браузър не поддържа елемента платно Нека сега да видим как изглежда това в нашия браузър:
