วิธี Canvas rotate()

คำอธิบายและการใช้งาน

rotate() วิธีการหมุนการวาดที่ปัจจุบัน

ตัวอย่าง

หมุนสี่เหลี่ยมผืนผ้า 20 องศา

เว็บเบราว์เซอร์ของคุณไม่สนับสนุนแท็ก HTML5 canvas

JavaScript:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.rotate(20 * Math.PI / 180);
ctx.fillRect(50,20,100,50);

ลองทดลองด้วยตัวเอง

ภาษา

context.rotate(angle);

ค่าตัวแปร

ตัวแปร คำอธิบาย
angle

มุมการหมุน ระบุด้วยเรทเรียด

เพื่อการเปลี่ยนมุมออกเป็นเรทเรียด โปรดใชู้สูตร degrees * Math.PI / 180 สำหรับการคำนวณ

ตัวอย่าง: ถ้าต้องการหมุน 5 องศา สามารถกำหนดนิยามที่ต่อไปนี้: 5 * Math.PI / 180.

การสนับสนุนโดยเบราเซอร์

ตัวเลขในตารางนี้ระบุว่าเวอร์ชั่นของเบราเซอร์ที่สนับสนุนคุณสมบัตินี้ครบถ้วน

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
4.0 9.0 3.6 4.0 10.1

หมายเหตุ:Internet Explorer 8 และเวอร์ชั่นเก่ากว่าไม่สนับสนุนสิ่งที่เรียกว่า <canvas> อิเล็กทรอนิกส์