ตอนแรกฉันแค่อยากจะเขียนกระดานวาดภาพง่ายๆ ต่อมาฉันจำได้โดยไม่รู้ตัวว่าเอกสารกราไฟท์มีฟังก์ชันไวท์บอร์ด ดังนั้นฉันจึงต้องการพัฒนาฟังก์ชัน Canvas ในปัจจุบันให้เป็นกระดานวาดภาพสำหรับการทำงานร่วมกันเวอร์ชันที่เรียบง่าย
การสาธิตออนไลน์: ขณะนี้อยู่ในขั้นตอนการปรับใช้ จำเป็นต้องทำการโคลนจึงจะสามารถรันในเครื่องได้
ที่อยู่คอมไพล์
2. วิ่ง
git clone <repository>npm install#>>>>สำหรับขั้นตอนการพัฒนา: #การเริ่มต้นบริการส่วนหน้า (โดยใช้เซิร์ฟเวอร์ webpack dev): npm เรียกใช้ dev#การเริ่มต้นบริการแบ็กเอนด์ (nodemon ใช้ในการตรวจสอบการแก้ไขไฟล์ส่วนหลังในความเป็นจริง เวลาและเริ่มบริการใหม่) npm run start# >>>สำหรับขั้นตอนการผลิต: #Package ไฟล์ส่วนหน้า จากนั้นสตาร์ทเซิร์ฟเวอร์ 1. npm run build2
3. ฟังก์ชั่น:
การพัฒนาเสร็จสมบูรณ์:
•การซูมแคนวาส (เสร็จสิ้น)
•สีแคนวาส (เสร็จแล้ว)
•สีแปรง (เสร็จแล้ว)
•ความหนาของแปรง (เสร็จแล้ว)
•ประวัติ (เลิกทำ กู้คืน) (เสร็จสิ้น)
•ห้องสนทนา(เสร็จสิ้น)
• วาดการทำงานร่วมกัน (คล้ายกับการทำงานร่วมกันในเอกสารกราไฟท์) (เสร็จสิ้น)
คุณสมบัติที่จะพัฒนา:• ความสวยงามของอินเทอร์เฟซ UI (กำลังพัฒนา) • การวางแผนใช้ไลบรารี UI (การออกแบบวัสดุ)
•การควบคุมข้อความ (กำลังพัฒนา)
•อัปโหลดรูปภาพและวาดภาพตามรูปภาพ (อยู่ระหว่างการพัฒนา)
•สามารถลากรูปทรงพื้นฐานของภาพวาดเพื่อปรับขนาดได้ (เพื่อพัฒนา)
• ฟังก์ชั่นแชทที่หลากหลาย (การแสดงออก รูปภาพ เสียง และวิดีโอ) (กำลังพัฒนา) • webRTC รับข้อมูลสตรีมวิดีโอและส่ง
•ฟังก์ชันอื่นๆ ที่ไม่รู้จัก (x)
4. การวาดภาพเอฟเฟกต์
5. คำหลัง
การใช้งานแอปพลิเคชันนี้ค่อนข้างพื้นฐาน และยังมีสิ่งที่ต้องปรับปรุงอีกมาก
ข้างต้นคือฟังก์ชันกระดานวาดภาพที่ใช้ร่วมกันซึ่งใช้โดย socket.io และ canvas ที่บรรณาธิการแนะนำ ฉันหวังว่ามันจะเป็นประโยชน์กับคุณ หากคุณมีคำถามใดๆ โปรดฝากข้อความถึงฉัน แล้วบรรณาธิการจะตอบกลับคุณทันเวลา!