ตัวอย่าง
วาดรูปสี่เหลี่ยมผืนผ้าขนาดถึง 200% แล้ววาดรูปสี่เหลี่ยมอีกครั้ง:
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);
ลองตัวเอง» สนับสนุนเบราว์เซอร์
ตัวเลขในตารางระบุราว์เซอร์รุ่นแรกที่สนับสนุนอย่างเต็มที่วิธีการ
| วิธี | |||||
|---|---|---|---|---|---|
| scale() | ใช่ | 9.0 | ใช่ | ใช่ | ใช่ |
ความหมายและการใช้งาน
scale() วิธีการชั่งการวาดภาพในปัจจุบันใหญ่หรือเล็ก
หมายเหตุ: หากคุณปรับขนาดภาพวาดภาพวาดทั้งหมดในอนาคตยังจะถูกปรับการวางตำแหน่งที่จะได้รับการปรับขนาด หากคุณ scale(2,2) ; ภาพวาดจะถูกวางตำแหน่งเป็นสองเท่าไกลจากด้านซ้ายและด้านบนของผ้าใบตามที่คุณระบุ
| ไวยากรณ์ javascript: | context.scale( scalewidth,scaleheight ); |
|---|
ค่าพารามิเตอร์
| พารามิเตอร์ | ลักษณะ | เล่น |
|---|---|---|
| scalewidth | เครื่องชั่งความกว้างของการวาดภาพในปัจจุบัน ( 1=100%, 0.5=50%, 2=200% ฯลฯ ) | เล่น " |
| scaleheight | เครื่องชั่งความสูงของการวาดภาพในปัจจุบัน ( 1=100%, 0.5=50%, 2=200% ฯลฯ ) | เล่น " |
ตัวอย่างเพิ่มเติม
ตัวอย่าง
วาดรูปสี่เหลี่ยมผืนผ้าขนาดถึง 200%, วาดรูปสี่เหลี่ยมอีกครั้งขนาดถึง 200%, วาดรูปสี่เหลี่ยมอีกครั้งขนาดถึง 200%, วาดรูปสี่เหลี่ยมอีกครั้ง:
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); ลองตัวเอง»