Curves on HTML Canvas
- Previous Page Canvas Circle
- Next Page Canvas Gradients
Exempel
const canvas = document.getElementById("myCanvas");
const ctx = canvas.getContext("2d");
ctx.beginPath();
ctx.arc(100, 50, 50, 0, Math.PI);
ctx.stroke();
arc() metod
En båge är en del av en cirkel och definieras också av mittpunktskoordinater och radie:
Canvas ritning av båge
Använd banan i canvas för att rita bågar:
| metod | beskriv | rita |
|---|---|---|
| beginPath() | börja en bana. | nej |
| arc() | definiera kurva. | nej |
| stroke() | gör en graf. | ja |
För att rita en cirkel på canvas, använd följande metoder:
- beginPath() - börja med en bana
- arc(x,y,r,start,end) - definiera cirkel
- stroke() - rita
arc(x,y,r,start,end) - skapa en båge (kurva).
För att skapa en cirkel, ställ in startvinkeln till 0 och slutvinkeln till 2 * Math.PI.
x och y-argument definierar koordinaterna för cirkelns mittpunkt.
r-argument definierar radien av cirkeln.
See also:
- Previous Page Canvas Circle
- Next Page Canvas Gradients
