Metoda Canvas arcTo()

Podręcznik Canvas

Definicja i użycie

arcTo() Metoda tworzy łuk lub krzywą między dwoma promieniami na płótnie.

Wskazówka:Użyj stroke() Metoda rysuje dokładny łuk na płótnie.

Przykład

Utwórz łuk między dwoma promieniami na płótnie:

Twoja przeglądarka nie obsługuje znacznika HTML5 canvas.

JavaScript:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.beginPath();
ctx.beginPath();
ctx.moveTo(20,20);           // Utwórz punkt początkowy
ctx.lineTo(100,20);          // Utwórz poziomą linię
ctx.arcTo(150,20,150,70,50); // Utwórz łuk
ctx.lineTo(150,120);         // Utwórz pionową linię
ctx.stroke();                // Przeprowadź rysowanie

Spróbuj sam

Gramatyka

context.fillRect(x1,y1,x2,y2,r);

Wartość parametru

Parametr Opis
x1 x-koordynat początku łuku
y1 y-koordynat początku łuku
x2 Końcowy x-koordynat łuku
y2 Współrzędna y końca łuku
r Promień łuku

Wsparcie przeglądarek

Numer w tabeli oznacza pierwszą wersję przeglądarki, która w pełni obsługuje tę właściwość.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
4.0 9.0 3.6 4.0 10.1

Uwaga:Internet Explorer 8 i wcześniejsze wersje nie obsługują elementu <canvas>.

Podręcznik Canvas