HTML kanvas closePath() Metode

Referensi Kanvas HTML

Contoh

Gambar jalur, berbentuk huruf L, lalu tarik garis kembali ke titik awal:

Peramban Anda tidak mendukung kanvas HTML5.

JavaScript:

var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.beginPath();
ctx.moveTo(20, 20);
ctx.lineTo(20, 100);
ctx.lineTo(70, 100);
ctx.closePath();
ctx.stroke();

Dukungan Peramban

Angka-angka dalam tabel menentukan versi browser pertama yang sepenuhnya mendukung metode ini.

Method
closePath() Yes 9.0 Yes Yes Yes

Definisi dan Penggunaan

Metode closePath() membuat jalur dari titik saat ini kembali ke titik awal.

Tip: Gunakan metode stroke() untuk benar-benar menggambar jalur di kanvas.

Tip: Gunakan metode fill() untuk mengisi gambar (hitam adalah default). Gunakan properti fillStyle untuk mengisi dengan warna/gradien lain.

Sintaks JavaScript: konteks .closePath();

Lebih Banyak Contoh

Contoh

Gunakan warna merah sebagai warna isian:

Peramban Anda tidak mendukung tag kanvas.

JavaScript:

var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.beginPath();
ctx.moveTo(20, 20);
ctx.lineTo(20, 100);
ctx.lineTo(70, 100);
ctx.closePath();
ctx.stroke();
ctx.fillStyle = "red";
ctx.fill();

Referensi Kanvas HTML