Canvas arcTo() -menetelmä

Määrittely ja käyttö

arcTo() Metodi luo käyrän tai kaaren kahden viivan välillä taulukossa.

Vinkki:Käytä stroke() Metodi piirtää tarkalleen käyrän taulukkoon.

Esimerkki

Luo käyrä, joka sijaitsee kahden viivan välillä taulukossa:

Selaimesi ei tue HTML5 canvas-tagiä.

JavaScript:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.beginPath();
ctx.beginPath();
ctx.moveTo(20,20);           // Luo alkupiste
ctx.lineTo(100,20);          // Luo horisontaalinen viiva
ctx.arcTo(150,20,150,70,50); // Luo käyrä
ctx.lineTo(150,120);         // Luo pystysuuntainen viiva
ctx.stroke();                // Tee piirto

Kokeile itse

Syntaksi

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

Parametrin arvo

Parametri Kuvaus
x1 Käyrän alkupisteen x-koordinaatti
y1 Käyrän alkupisteen y-koordinaatti
x2 Käyrän lopun x-koordinaatti
y2 Kaaren päätepisteen y-koordinaatti
r Kaaren säde

Selaimen tuki

Taulukossa olevat numerot viittaavat ensimmäiseen selaimen versioon, joka tukee kyseistä ominaisuutta täysin.

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

Huomautus:Internet Explorer 8 ja aikaisemmat versiot eivät tue <canvas>-elementtiä.