Canvas คุณสมบัติ shadowOffsetY

คู่มืออ้างอิง Canvas

การนิยายและการใช้งาน

shadowOffsetY คุณสมบัติตั้งค่าหรือคืนค่าระยะหน้าระหว่างรูปร่างและเงา.

  • shadowOffsetY=0 บอกว่าเงาตั้งอยู่ตรงข้างล่างของรูปร่าง
  • shadowOffsetY=20 บอกว่าเงาตั้งอยู่ที่ตำแหน่งด้านล่างของรูปร่าง 20 พิกเซล
  • shadowOffsetY=-20 บอกว่าเงาตั้งอยู่ที่ตำแหน่งด้านบนของรูปร่าง 20 พิกเซล

คำแนะนำ:เพื่อปรับตำแหน่งน้ำตาลอยู่ตรงข้ามรูปร่าง ใช้ shadowOffsetX คุณสมบัติ

ตัวอย่าง

วาดสี่เหลี่ยมผืนผ้า โดยมีเงาที่ลดลง 20 พิกเซล (จากตำแหน่งด้านบนของสี่เหลี่ยมผืนผ้า):

เว็บเครื่องคอมพิวเตอร์ของคุณไม่สนับสนุนแท็กคาวส์.

JavaScript:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.shadowBlur=10;
ctx.shadowOffsetY=20;
ctx.shadowColor="black";
ctx.fillStyle="blue";
ctx.fillRect(20,20,100,80);

ลองทดลองเอง

ภาษาเขียน

context.shadowOffsetY=number;

ค่านิยาย

ค่า รายละเอียด
number ค่าบวกหรือลบ นิยายระยะหน้าต่อรูปร่างตัวทรง.

รายละเอียดเทคนิค

ค่าเริ่มต้น: 0

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

ตัวเลขในตารางนี้บอกเรื่องราวถึงเวอร์ชั่นของเบราซเรอร์ที่สนับสนุนองค์ประกอบนี้เต็มที่

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

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

คู่มืออ้างอิง Canvas