Canvas lineCap คุณสมบัติ

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

การรับรู้และวิธีใช้

lineCap คุณสมบัติที่ตั้งค่าหรือเรียกค่ากลับของรูปแบบของหุ้มหน้าสายสุดของสาย。

หมายเหตุ:"roundและsquareจะทำให้สายมีความยาวเล็กน้อยนัก。

ตัวอย่าง

วาดโหล่งหุ้มวงกลมสำหรับสายที่สิ้นสุด:

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

JavaScript:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.beginPath();
ctx.lineCap="round";
ctx.moveTo(20,20);
ctx.lineTo(20,200);
ctx.stroke();

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

วิธีใช้

context.lineCap="butt|round|square";

ค่ารายละเอียดของคุณสมบัติ

ค่า รายละเอียด
butt ค่าปริยาย ส่วนนี้จะเพิ่มขอบเรื่องในแบบที่แท้จริงที่ทุกด้านของสาย。
round เพิ่มโหล่งหุ้มวงกลมที่ทุกด้านของสาย。
square เพิ่มมุมโค้งแบบสี่เหลี่ยมเป็นรูปตัวสี่เหลี่ยมในทุกด้านของสาย

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

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

การสนับสนุนโปรแกรมบราวเซอร์

ตัวเลขในตารางระบุรุ่นที่สนับสนุนอัตราส่วนให้กับการใช้งาน

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