บทความนี้ส่วนใหญ่แนะนำการใช้ HTML5 บริสุทธิ์เพื่อเขียนการแบ่งปันรหัสนาฬิกาบนหน้าเว็บ โปรแกรมนั้นง่ายมากและไม่มีจอแสดงผลดิจิตอลบนนาฬิกา มันสะท้อนแนวคิดการออกแบบขั้นพื้นฐานอย่างหมดจด เพื่อนที่ต้องการมันสามารถอ้างถึงมันได้
สิ่งที่คุณต้องรู้:
แท็ก Canvas เป็นเพียงคอนเทนเนอร์กราฟและคุณต้องใช้สคริปต์เพื่อวาดกราฟ ขนาดเริ่มต้น: 300px กว้างและสูง 150px;
เมธอด getContext () ส่งคืนวัตถุที่ให้วิธีการและคุณสมบัติสำหรับการวาดบนผืนผ้าใบ - รับวัตถุบริบท
คุณสมบัติและวิธีการของวัตถุ GetContext (2D) ที่สามารถใช้ในการวาดข้อความ, เส้น, สี่เหลี่ยม, วงกลมและอื่น ๆ บนผืนผ้าใบ
Fillrect (L, T, W, H): สีเริ่มต้นคือ Black Strokerect (L, T, W, H): สี่เหลี่ยมจัตุรัสที่มีเส้นขอบ ค่าเริ่มต้นหนึ่งเส้นขอบสีดำพิกเซล
เมธอด setInterval () เรียกฟังก์ชันหรือคำนวณการแสดงออกตามระยะเวลาที่ระบุ (เป็นมิลลิวินาที)
เริ่มต้น (): กำหนดเส้นทางที่จะเริ่มวาดภาพซึ่งตั้งค่าจุดปัจจุบันเป็น (0,0) เมื่อสภาพแวดล้อมผ้าใบถูกสร้างขึ้นครั้งแรกเริ่มต้น ()
วิธีการเรียกอย่างชัดเจน
ClosePath (): เส้นทางการวาดสิ้นสุด (เชื่อมต่อจุดเริ่มต้นและจุดสิ้นสุด)
วาดวงกลม:
อาร์ค (x, y, รัศมี, เรเดียนเริ่มต้น, เรเดียนปลาย, ทิศทางการหมุน)
x, y: ตำแหน่งเริ่มต้น
ความสัมพันธ์ระหว่างเรเดียนและมุม: เรเดียน = มุม *math.pi/180
ทิศทางการหมุน: ตามเข็มนาฬิกา (ค่าเริ่มต้น: เท็จ, ทวนเข็มนาฬิกา: จริง)
รหัส:
XML/HTML รหัสคัดลอกเนื้อหาไปยังคลิปบอร์ด