HTML5 - Bezier kreivės

The Bezier kreivės, Tai yra kreivių rūšis, plačiai naudojama piešimo ir grafikos programose, nes jos leidžia mums sukurti kreives su tam tikrais plokštumos taškais, todėl naudojant kai kurias matematines formules galime pasiekti lygias ar tikslesnes kreives, kurias galime naudoti daugiau informacijos rasite mūsų diagramose.
In HTML5 turime galimybę įgyvendinti Bezier kreivės Įvairių metodų dėka galime įtraukti kvadratines ir kubines kreives, apribojimas yra tas, kad drobėje mes neturime vizualios informacijos apie tai, kur turime atskaitos taškus.
Kreivių generavimo metodai
Kaip jau paaiškinome, kai kuriuose taškuose palaikomos „Bezier“ kreivės, kad būtų galima padaryti piešinį, norėdami pasiekti norimą kreivę, turime atlikti daugybę eksperimentų, tačiau norėdami eksperimentuoti, pirmiausia turime žinoti foną, todėl toliau pamatysite atitinkamą informaciją su metodais, leidžiančiais piešti šias kreives:
bezierCurveTo (cx1, cy1, cx2, cy2, x, y): Naudodami valdymo taškus (cx1, cy1) ir (cx2, cy2) nubrėžkite kubinio tipo Bezierio kreivę, kurioje susitinka taškai (x, y).
quadraticCurveTo (cx, xy, x, y): Nubrėžkite kvadratinę Bezierio kreivę iki taškų (x, y) su valdymo tašku (cx, cy).
Mes jau žinome techninį aspektą, su kuriuo turime dirbti, dabar pamatysime kodo pavyzdį.
Šiame pavyzdyje mes nupiešime kubinę Bezier kreivę, kur paskutinį imsimės kaip pradinį tašką pakeliui ir tada perkelkite jį į paskutinių dviejų metodo argumentų taškus, be to, jame yra funkcija, kurią paspaudus klaviatūros klavišą „Shift“ arba „Ctrl“, pasikeičia kreivės pradžios ir pabaigos taškai.

 Pavyzdys Jūsų naršyklė nepalaiko šio elemento drobė 

Kai turėsime kodą, pažiūrėkime, ką jis sukuria naršyklėje, mes apribojame, kad jame yra dinaminė dalis, todėl rezultatai gali skirtis:

Jei pažvelgsime, turime keturis valdymo taškus, pažymėtus raudonomis linijomis, kurias matome ekrano kopijoje.
Baigę šią pamoką apie Bezier kreives, svarbiausia yra eksperimentuoti, jei norime pasiekti sudėtingesnių efektų, kurie yra susiję su tuo, ko mums reikia.Ar jums patiko ir padėjo ši pamoka?Galite apdovanoti autorių paspausdami šį mygtuką, kad suteiktumėte jam teigiamą tašką