Atribut width HTML <canvas>

Tag HTML <canvas>

Definisi dan penggunaan

width Atribut width menentukan lebar elemen <canvas> dalam satuan pixel.

Pemberitahuan

Gunakan Atribut height Tentukan tinggi elemen <canvas> dalam satuan pixel.

Pada setiap kali mengatur ulang tinggi atau lebar kanvas, konten kanvas akan dihapus (lihat contoh di bawah halaman).

Silakan lihat Panduan HTML Canvas Belajar lebih banyak tentang elemen <canvas> di sini.

Contoh

Contoh 1

Elemen <canvas> dengan tinggi dan lebar 200 pixel:

<canvas id="myCanvas" width="400" height="400" style="border:1px solid">

Coba Sendiri

Contoh 2

Dengan mengatur atribut width menjadi 400px untuk membersihkan kanvas (dengan JavaScript):

<canvas id="myCanvas" width="200" height="200" style="border:1px solid"></canvas>
<script>
var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.fillStyle = "#0192B9";
ctx.fillRect(50, 50, 300, 300);
function clearCanvas() {
  c.width = 400;
}
</script>

Coba Sendiri

Syarat

<canvas width="pixels">

Nilai Atribut

Nilai Deskripsi
pixels Tentukan lebar kanvas dalam piksel (contoh: "100"). Nilai default adalah 300.

Dukungan Browser

Angka di tabel menunjukkan versi browser pertama yang mendukung atribut ini.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
4.0 9.0 2.0 3.1 9.0

Tag HTML <canvas>