HTML5 - Bezjē līknes

Satura rādītājs
Bezjē līknes, Tās ​​ir līkņu veids, ko plaši izmanto zīmēšanas un grafikas programmās, jo tās ļauj mums izveidot līknes ar dažiem plaknes punktiem, pateicoties tam, izmantojot dažas matemātiskas formulas, mēs varam sasniegt vienmērīgas vai precīzākas līknes, kuras mēs varam izmantot sīkāku informāciju par mūsu diagrammām.
In HTML5 mums ir iespēja īstenot Bezjē līknes Pateicoties dažādām metodēm, mēs varam iekļaut kvadrātiskās un kubiskās līknes, ierobežojums ir tāds, ka uz audekla mums nav vizuāla atbalsta, kur mums ir atskaites punkti.
Līkņu ģenerēšanas metodes
Kā mēs jau esam paskaidrojuši, Bezier līknes tiek atbalstītas dažos punktos, lai varētu izdarīt zīmējumu, lai sasniegtu vēlamo līkni, mums ir jāveic daudzi eksperimenti, tomēr, lai eksperimentētu, mums vispirms jāzina fons, tāpēc tālāk mēs redzēsim atbilstošo informāciju ar metodēm, kas ļauj mums uzzīmēt šīs līknes:
bezierCurveTo (cx1, cy1, cx2, cy2, x, y): Izmantojot kontroles punktus (cx1, cy1) un (cx2, cy2), uzzīmējiet kubiskā tipa Bezjē līkni, kur punkti (x, y) sakrīt.
quadraticCurveTo (cx, xy, x, y): Uzzīmējiet kvadrātisko Bezjē līkni līdz punktiem (x, y) ar kontroles punktu (cx, cy).
Mēs jau zinām tehnisko aspektu, ar kuru mums jāstrādā, tagad mēs redzēsim piemēru kodā.
Šajā piemērā mēs uzzīmēsim kubisko Bezjē līkni, kur par izejas punktu ņemsim pēdējo apakšceļš un pēc tam pārnesiet uz pēdējo divu argumentu punktiem, kurus metode saņem, turklāt tajā ir iekļauta funkcionalitāte, kas, ja mēs nospiežam tastatūras taustiņu Shift vai ctrl, mainās līknes sākuma un beigu punkts.
 Piemērs Jūsu pārlūkprogramma neatbalsta šo elementu audekls 

Kad būsim ieguvuši kodu, redzēsim, ko tas ģenerē pārlūkprogrammā, mēs ierobežojam, ka, tā kā tajā ir dinamiska sadaļa, rezultāti var atšķirties:

Ja paskatāmies, mums ir četri kontroles punkti, kas atzīmēti ar sarkanām līnijām, kuras redzam ekrānuzņēmumā.
Ar to mēs pabeidzam šo apmācību par Bezjē līknēm, galvenais ir eksperimentēt, ja vēlamies sasniegt sarežģītākus efektus, kas ir saistīti ar to, kas mums nepieciešams.Vai jums patika šī apmācība un palīdzējāt tai?Jūs varat apbalvot autoru, nospiežot šo pogu, lai sniegtu viņam pozitīvu punktu

Jums palīdzēs attīstību vietā, daloties lapu ar draugiem

wave wave wave wave wave