Krzywa HTML Canvas
- Poprzednia strona Kółko Canvas
- Następna strona Przejścia Canvas
Przykład
const canvas = document.getElementById("myCanvas");
const ctx = canvas.getContext("2d");
ctx.beginPath();
ctx.arc(100, 50, 50, 0, Math.PI);
ctx.stroke();
metoda arc()
Łuk jest częścią koła, również zdefiniowanym przez współrzędne środka i promień:
Rysowanie łuku na Canvas
Użyj ścieżki na płótnie, aby narysować łuk:
| metoda | opis | rysowanie |
|---|---|---|
| beginPath() | rozpoczyna nową ścieżkę. | Nie |
| arc() | definiować krzywą. | Nie |
| stroke() | tworzyć diagramy. | Tak |
Aby narysować okrąg na płótnie, użyj następujących metod:
- beginPath() - rozpoczyna ścieżkę
- arc(x,y,r,start,end) - definiuje koło
- stroke() - rysuje
arc(x,y,r,start,end) - tworzy łuk (krzywą).
Aby utworzyć koło, ustaw wartość kąta początkowego na 0, a wartość kąta końcowego na 2 * Math.PI.
Parametry 'x' i 'y' definiują współrzędne środka koła.
Parametr 'r' definiuje promień koła.
Zobacz również:
- Poprzednia strona Kółko Canvas
- Następna strona Przejścia Canvas
