โครงการนี้มีเครื่องมือคำอธิบายประกอบสำหรับวิดีโอและองค์ประกอบภาพ HTML เครื่องมือนี้ช่วยให้ผู้ใช้สามารถวาดและใส่คำอธิบายประกอบวิดีโอและรูปภาพโดยใช้เครื่องมือวาดภาพต่าง ๆ รวมถึงเส้นโค้งสี่เหลี่ยมวงรีและข้อความ ผู้ใช้ยังสามารถปรับแต่งขนาดสีและจังหวะของคำอธิบายประกอบ
Demo: Lifeart.github.io/sm-annotate
เพิ่มแพ็คเกจลงในโครงการของคุณโดยใช้เส้นด้าย:
yarn add https://github.com/lifeart/sm-annotate.git import { SmAnnotate } from '@lifeart/sm-annotate' ;
const video = document . getElementById ( 'video' ) ;
const annotationTool = new AnnotationTool ( video ) ;ผู้ใช้สามารถวาดและใส่คำอธิบายประกอบโดยใช้เครื่องมือที่มีอยู่ (เส้นโค้ง, สี่เหลี่ยมผืนผ้า, วงรีและข้อความ) และปรับแต่งสีและขนาดจังหวะของคำอธิบายประกอบ เครื่องมือนี้ยังรองรับฟังก์ชั่นการเลิกทำและการจัดการเหตุการณ์สำหรับเหตุการณ์ตัวชี้ (เมาส์และสัมผัส)
ในการบันทึกเฟรมปัจจุบันหรือเฟรมทั้งหมดด้วยคำอธิบายประกอบให้ใช้วิธี saveCurrentFrame หรือ saveAllFrames ตามลำดับ
| ปุ่มกด | ผลลัพธ์ |
|---|---|
Shift | แว่นขยาย x2 |
r | สีแดง |
g | สีเขียว |
b | สีฟ้า |
y | สีเหลือง |
1 - 9 | ขนาดเครื่องมือ |
เรายินดีต้อนรับการมีส่วนร่วมในการปรับปรุงโครงการ โปรดส่งปัญหาหรือดึงคำขอเพื่อพิจารณา
รหัสนี้ได้รับอนุญาตสำหรับการใช้งานที่ไม่ใช่เชิงพาณิชย์ สำหรับการใช้งานเชิงพาณิชย์ผู้ใช้จะต้องติดต่อผู้แต่ง