tutorial pengembangan web terbaru
 

HTML canvas scale() Method

<HTML Canvas Referensi

Contoh

Menggambar persegi panjang, skala 200%, maka menggambar persegi panjang lagi:

YourbrowserdoesnotsupporttheHTML5canvastag.

JavaScript:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.strokeRect(5,5,25,15);
ctx.scale(2,2);
ctx.strokeRect(5,5,25,15);
Cobalah sendiri "

Dukungan Browser

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

metode
scale() iya nih 9.0 iya nih iya nih iya nih

Definisi dan Penggunaan

The scale() metode skala gambar saat ini, lebih besar atau lebih kecil.

Catatan: Jika Anda skala gambar, semua gambar masa depan juga akan ditingkatkan.positioning juga akan ditingkatkan. Jika Anda scale(2,2) ; gambar akan diposisikan dua kali lebih jauh dari kiri dan atas kanvas seperti yang Anda tentukan.

sintaks JavaScript: context.scale( scalewidth,scaleheight );

Nilai parameter

Parameter Deskripsi Mainkan
scalewidth Skala lebar gambar saat ( 1=100%, 0.5=50%, 2=200% , dll) Mainkan "
scaleheight Skala ketinggian gambar saat ( 1=100%, 0.5=50%, 2=200% , dll) Mainkan "

Contoh lebih

Contoh

Menggambar persegi panjang, skala 200%, menggambar persegi panjang lagi, skala 200%, menggambar persegi panjang lagi, skala 200%, menggambar persegi panjang lagi:

YourbrowserdoesnotsupporttheHTMLcanvastag.

JavaScript:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.strokeRect(5,5,25,15);
ctx.scale(2,2);
ctx.strokeRect(5,5,25,15);
ctx.scale(2,2);
ctx.strokeRect(5,5,25,15);
ctx.scale(2,2);
ctx.strokeRect(5,5,25,15);
Cobalah sendiri "

<HTML Canvas Referensi