masyarakat Belajar Perpustakaan Alatan Masa lapang
cari
Melayu

Kanvas melukis bulatan dan elips

Kaedah lengkok Konteks ialah melukis bulatan atau elips Parameter x dan y kaedah lengkok ialah koordinat tengah bulatan, jejari ialah jejari, Sudut mula dan Sudut hujung ialah sudut permulaan dan sudut penamat. sektor (dinyatakan dalam radian), lawan arah jam Menunjukkan sama ada lukisan perlu dilukis mengikut lawan jam (benar) atau mengikut arah jam (salah).

Kodnya adalah seperti berikut: 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>huatu</title>
<body>
<canvas id="demoCanvas" width="500" height="600"></canvas>
<script type="text/javascript">
    //通过id获得当前的Canvas对象
 var canvasDom = document.getElementById("demoCanvas");
    //通过Canvas Dom对象获取Context的对象
 var context = canvasDom.getContext("2d");
    context.beginPath();//开始绘制路径
    //绘制以 （60,60）为圆心，50为半径长度，从0度到360度（PI是180度），最后一个参数代表顺时针旋转。
 context.arc(60, 60, 50, 0, Math.PI * 2, true);
    context.lineWidth = 2.0;//线的宽度
 context.strokeStyle = "#000";//线的样式
 context.stroke();//绘制空心的，当然如果使用fill那就是填充了。
</script>
</body>
</html>


Meneruskan pembelajaran
||
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>huatu</title> <body> <canvas id="demoCanvas" width="500" height="600"></canvas> <script type="text/javascript"> //通过id获得当前的Canvas对象 var canvasDom = document.getElementById("demoCanvas"); //通过Canvas Dom对象获取Context的对象 var context = canvasDom.getContext("2d"); context.beginPath();//开始绘制路径 //绘制以 （60,60）为圆心，50为半径长度，从0度到360度（PI是180度），最后一个参数代表顺时针旋转。 context.arc(60, 60, 50, 0, Math.PI * 2, true); context.lineWidth = 2.0;//线的宽度 context.strokeStyle = "#000";//线的样式 context.stroke();//绘制空心的，当然如果使用fill那就是填充了。 </script> </body> </html>
serahkanTetapkan Semula Kod
Bahagian sebelumnya bahagian seterusnya
Senarai Tutorial
dapatkan bantuan
  • Cadangan kursus
  • Muat turun perisian kursus
Perisian kursus tidak tersedia untuk dimuat turun pada masa ini. Kakitangan sedang menganjurkannya. Sila beri perhatian lebih kepada kursus ini pada masa hadapan~

Pelajar yang telah menonton kursus ini juga sedang belajar

Tutorial video perdana dunia ThinkPHP 5.1 terkini (60 hari untuk menjadi kursus latihan dalam talian pakar PHP)  492832 permainan