เหมาะกับ: งานเขียนที่ต้องร่วมมือกัน, เอกสารยาวๆ, การดีบักโค้ด, และโปรเจกต์ที่ต้องการการปรับปรุงแบบวนซ้ำ
พื้นที่ทำงาน Canvas ของ Gemini ให้คุณเขียนและแก้ไขเอกสารหรือโค้ด โดยการเปลี่ยนแปลงจะปรากฏบนหน้าจอแบบเรียลไทม์
วิธีใช้งาน:
เหมาะกับ: การสร้างเว็บแอป, การแก้ไขเอกสารด้วยพรีวิวสด, และการสร้างต้นแบบอย่างรวดเร็ว
Canvas ของ Mistral เป็นตัวแก้ไขในตัวสำหรับสร้างและปรับปรุงข้อความ โค้ด สเปรดชีต และอื่นๆ โดยร่วมมือกับ AI ภายในแชทของคุณ
วิธีใช้งาน:
Tools ที่ด้านล่างของหน้าต่างแชท แล้วทำเครื่องหมายที่ช่อง Canvas / ใน prompt และเลือก "Open a new Canvas" เหมาะกับ: การสร้างเนื้อหาอย่างรวดเร็ว, การแก้ไขสเปรดชีต, และการสร้างข้อความหรือโค้ดที่ไม่ซับซ้อนมาก
สำหรับนักพัฒนาที่ต้องการสร้างตัวแก้ไขข้อความหรือโค้ดตั้งแต่ต้นโดยใช้ <canvas> API นั้น วิธีการนั้นแตกต่างกันโดยสิ้นเชิง — คุณต้องใช้งานพื้นฐานการแก้ไขข้อความทั้งหมดด้วยตัวเองเนื่องจากองค์ประกอบ canvas ไม่มีความสามารถในการรับข้อความในตัว
ขั้นตอนหลัก:
ctx.measureText() และ Canvas Text Metrics API ที่ใหม่กว่า (getIndexFromOffset, getSelectionRects) เพื่อจับคู่พิกัดพิกเซลกลับเป็นดัชนีอักขระ ทางเลือก: สำหรับหลายๆ กรณี การใช้องค์ประกอบ HTML เช่น textarea หรือ contenteditable นั้นง่ายกว่าการสร้างตัวแก้ไขแบบเต็มรูปแบบบน canvas วิธีการนี้ใช้ canvas ก็ต่อเมื่อคุณต้องการควบคุมการเรนเดอร์ในระดับพิกเซล (เช่น สำหรับเครื่องมือออกแบบหรือแอปวาดภาพแบบกำหนดเอง)
สรุป: หากคุณเป็นนักเขียนหรือนักเขียนโค้ด ให้ใช้เครื่องมือ AI Canvas หากคุณกำลังสร้างแอปพลิเคชันแบบกำหนดเองที่ต้องการการเรนเดอร์ที่แม่นยำ วิธีการใช้ HTML5 Canvas จะให้คุณควบคุมได้เต็มที่ — แต่เตรียมตัวรับความพยายามในการพัฒนาเพิ่มเติม