กลับไปหน้า Tools

GetNotes Tools

Excalidraw

Tool นี้คืออะไร

Excalidraw เป็นไวท์บอร์ดเสมือนจริงแบบโอเพนซอร์สที่ให้คุณสร้างไดอะแกรมและภาพวาดสไตล์ลายเส้นด้วยมือได้อย่างรวดเร็ว รองรับการทำงานร่วมกันแบบเรียลไทม์และการเข้ารหัสแบบ end-to-end เหมาะสำหรับนักพัฒนาและทีมที่ต้องการเครื่องมือวาดภาพที่ยืดหยุ่นและปรับแต่งได้

ข้อมูลโปรเจกต์

ดาว

128.6K

Forks

14.6K

License

MIT

อัปเดต GitHub ล่าสุด

28 ก.ค. 2569

เพิ่มใน GetNotes

13 ก.ค. 2569

Repository

excalidraw/excalidraw

เหมาะกับงาน

เพิ่ม Productivity

เหมาะกับอาชีพ

Ecosystem

TypeScript

แปลและเรียบเรียงโดย AI

เนื้อหาฉบับภาษาไทย

ใช้อ่านเพื่อทำความเข้าใจเบื้องต้น โปรดตรวจสอบรายละเอียดสำคัญกับเอกสารต้นฉบับด้านล่าง

Excalidraw
Excalidraw เผยแพร่ภายใต้สัญญาอนุญาต MITยอดดาวน์โหลด npm/เดือนยินดีรับ PRs!พูดคุยบน Discordถาม DeepWikiติดตาม Excalidraw บน Twitter
ตัวอย่างผลิตภัณฑ์

คุณสมบัติ

Excalidraw editor (npm package) รองรับ:

  • 💯 ฟรีและโอเพนซอร์ส
  • 🎨 ไวท์บอร์ดแบบ Canvas ที่ไม่มีที่สิ้นสุด
  • ✍️ สไตล์ลายเส้นด้วยมือ
  • 🌓 โหมดมืด
  • 🏗️ ปรับแต่งได้
  • 📷 รองรับรูปภาพ
  • 😀 รองรับไลบรารีรูปร่าง
  • 🌐 รองรับการแปลภาษา (i18n)
  • 🖼️ ส่งออกเป็น PNG, SVG และคัดลอกไปยังคลิปบอร์ด
  • 💾 รูปแบบเปิด - ส่งออกภาพวาดเป็นไฟล์ JSON .excalidraw
  • ⚒️ เครื่องมือหลากหลาย - สี่เหลี่ยม, วงกลม, เพชร, ลูกศร, เส้น, วาดอิสระ, ยางลบ...
  • ➡️ การผูกลูกศรและลูกศรที่มีป้ายกำกับ
  • 🔙 เลิกทำ / ทำซ้ำ
  • 🔍 รองรับการซูมและการเลื่อน

Excalidraw.com

แอปที่โฮสต์อยู่ที่ excalidraw.com เป็นตัวอย่างเล็กๆ น้อยๆ ของสิ่งที่คุณสามารถสร้างได้ด้วย Excalidraw ซอร์สโค้ดของแอปนี้ก็เป็นส่วนหนึ่งของ repository นี้เช่นกัน และแอปมีคุณสมบัติดังนี้:

  • 📡 รองรับ PWA (ทำงานแบบออฟไลน์ได้)
  • 🤼 การทำงานร่วมกันแบบเรียลไทม์
  • 🔒 การเข้ารหัสแบบ end-to-end
  • 💾 รองรับ Local-first (บันทึกอัตโนมัติไปยังเบราว์เซอร์)
  • 🔗 ลิงก์ที่แชร์ได้ (ส่งออกเป็นลิงก์แบบอ่านอย่างเดียวที่คุณสามารถแชร์กับผู้อื่นได้)

เราจะเพิ่มคุณสมบัติเหล่านี้เป็นปลั๊กอินแบบ drop-in สำหรับ npm package ในอนาคต

เริ่มต้นอย่างรวดเร็ว

หมายเหตุ: คำแนะนำต่อไปนี้สำหรับการติดตั้ง npm package ของ Excalidraw เมื่อคุณต้องการรวม Excalidraw เข้ากับแอปของคุณเอง หากต้องการรัน repository ในเครื่องสำหรับการพัฒนา โปรดดู คู่มือการพัฒนา ของเรา

ใช้ npm หรือ yarn เพื่อติดตั้งแพ็กเกจ

bash
npm install react react-dom @excalidraw/excalidraw
# or
yarn add react react-dom @excalidraw/excalidraw

ดู เอกสารประกอบ ของเราสำหรับรายละเอียดเพิ่มเติม!

การมีส่วนร่วม

การผสานรวม

ใครบ้างที่ผสานรวม Excalidraw

Google CloudMetaCodeSandboxObsidian ExcalidrawReplitSliteNotionHackerRank • และอื่นๆ อีกมากมาย

ผู้สนับสนุนและการสนับสนุน

หากคุณชอบโปรเจกต์นี้ คุณสามารถเป็นผู้สนับสนุนได้ที่ Open Collective หรือใช้ Excalidraw+

ขอขอบคุณที่สนับสนุน Excalidraw

สุดท้ายแต่ไม่ท้ายสุด เราขอขอบคุณบริษัทเหล่านี้ที่ให้บริการฟรี:

Vercel Sentry Crowdin

เอกสารโปรเจกต์

อ่านเอกสารต้นฉบับ

README วิธีติดตั้ง วิธีใช้งาน และข้อกำหนดจาก repository ต้นฉบับ

ดูไฟล์บน GitHub
Excalidraw
Excalidraw is released under the MIT license.npm downloads/monthPRs welcome!Chat on DiscordAsk DeepWikiFollow Excalidraw on Twitter
Product showcase

Features

The Excalidraw editor (npm package) supports:

  • 💯 Free & open-source.
  • 🎨 Infinite, canvas-based whiteboard.
  • ✍️ Hand-drawn like style.
  • 🌓 Dark mode.
  • 🏗️ Customizable.
  • 📷 Image support.
  • 😀 Shape libraries support.
  • 🌐 Localization (i18n) support.
  • 🖼️ Export to PNG, SVG & clipboard.
  • 💾 Open format - export drawings as an .excalidraw json file.
  • ⚒️ Wide range of tools - rectangle, circle, diamond, arrow, line, free-draw, eraser...
  • ➡️ Arrow-binding & labeled arrows.
  • 🔙 Undo / Redo.
  • 🔍 Zoom and panning support.

Excalidraw.com

The app hosted at excalidraw.com is a minimal showcase of what you can build with Excalidraw. Its source code is part of this repository as well, and the app features:

  • 📡 PWA support (works offline).
  • 🤼 Real-time collaboration.
  • 🔒 End-to-end encryption.
  • 💾 Local-first support (autosaves to the browser).
  • 🔗 Shareable links (export to a readonly link you can share with others).

We'll be adding these features as drop-in plugins for the npm package in the future.

Quick start

Note: following instructions are for installing the Excalidraw npm package when integrating Excalidraw into your own app. To run the repository locally for development, please refer to our Development Guide.

Use npm or yarn to install the package.

bash
npm install react react-dom @excalidraw/excalidraw
# or
yarn add react react-dom @excalidraw/excalidraw

Check out our documentation for more details!

Contributing

Integrations

Who's integrating Excalidraw

Google CloudMetaCodeSandboxObsidian ExcalidrawReplitSliteNotionHackerRank • and many others

Sponsors & support

If you like the project, you can become a sponsor at Open Collective or use Excalidraw+.

Thank you for supporting Excalidraw

Last but not least, we're thankful to these companies for offering their services for free:

Vercel Sentry Crowdin

#canvas#collaboration#diagrams#drawing#hacktoberfest#productivity#whiteboard