Exemplu
Se trasează o curbă Bezier cubi:
JavaScript:
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.beginPath();
ctx.moveTo(20,20);
ctx.bezierCurveTo(20,100,200,100,200,20);
ctx.stroke(); Încearcă - l singur » Suport pentru browser-
Internet Explorer 9, Firefox, Opera, Chrome și Safari sprijini bezierCurveTo() metoda.
Note: Internet Explorer 8 și versiunile anterioare, nu acceptă <canvas> element.
Definiție și utilizare
bezierCurveTo() metoda adaugă un punct la calea curentă utilizând punctele de control specificate care reprezintă o curbă Bezier cubi.
O curbă Bezier cubică necesită trei puncte. Primele două puncte sunt puncte de control, care sunt utilizate în calculul Bezier cubi, iar ultimul punct este punctul final pentru curba. Punctul de plecare pentru curba este ultimul punct în calea curentă. În cazul în care o cale nu există, utilizați beginPath() și moveTo() metode pentru a defini un punct de plecare.
Tip: Check out quadraticCurveTo() metoda. Acesta are un punct de control în loc de doi.
| sintaxa JavaScript: | context . bezierCurveTo( cp1x,cp1y,cp2x,cp2y,x,y ) ; |
|---|
Valorile parametrilor
| Parametru | Descriere | Joaca-l |
|---|---|---|
| cp1x | Coordonata X a primului punct de control Bezier | Joaca - l » |
| cp1y | Y coordonata a primului punct de control Bezier | Joaca - l » |
| cp2x | X coordonata al doilea punct de control Bezier | Joaca - l » |
| cp2y | Y-coordonata al doilea punct de control Bezier | Joaca - l » |
| x | X-coordonata punctului final | Joaca - l » |
| y | Y coordonata punctului final | Joaca - l » |