مقدمه
erd-editor یک ویرایشگر نمودار موجودیت-رابطه است.
این ویرایشگر بهصورت برنامهٔ وب، برنامهٔ Google Drive، افزونهٔ VS Code، پلاگین IntelliJ، پلاگین Obsidian و نیز بهصورت عنصر سفارشی <erd-editor> که میتوانید آن را در صفحهٔ خودتان جاسازی کنید، در دسترس است.
ویرایشگر و قالب سند در همهٔ آنها یکی است.

از کجا دریافت کنید
| پلتفرم | نصب | آنچه به دست میآورید |
|---|---|---|
| برنامهٔ وب | erd-editor.io | PWA قابل نصب، کار بهصورت آفلاین، همکاری بلادرنگ |
| Google Drive | Google Workspace Marketplace | افزودن ERD Editor به منوهای Open with و New در Drive و ذخیره در همان فایل |
| VS Code | Marketplace | باز کردن فایلهای .erd.json در یک ویرایشگر سفارشی |
| IntelliJ | JetBrains Marketplace | همان ویرایشگر، برای IDEهای مبتنی بر IntelliJ |
| Obsidian | Community plugins | باز کردن فایلهای .erd و .erd.json در زبانهای از خزانه، فقط روی دسکتاپ |
| صفحهٔ خودتان | npm install @dineug/erd-editor | عنصر سفارشی <erd-editor> بدون وابستگی به فریمورک؛ نصب را ببینید |
| عاملهای کدنویسی | @dineug/erd-editor-mcp | یک سرور MCP که به Claude Code، Codex یا کلاینتی دیگر امکان میدهد نمودار را بهصورت زنده در VS Code، یک IDE از JetBrains یا Obsidian، یا در خود فایل ویرایش کند |
برای امتحان کردن آن در یک IDE، یک فایل خالی با پسوند .erd.json ایجاد کنید و آن را باز کنید.
در Obsidian، فرمان ERD Editor: Create new diagram را از پالت فرمان اجرا کنید یا گزینهٔ New ERD را از منوی زمینهٔ یک پوشه در کاوشگر فایل انتخاب کنید. هر یک از این دو، یک فایل خالی .erd ایجاد میکند و آن را باز میکند.
در Google Drive، New → More → ERD Editor را انتخاب کنید و سپس با Google وارد شوید. ERD Editor فقط به فایلهایی دسترسی دارد که با آن ایجاد میکنید یا باز میکنید.
در برنامهٔ وب، Google Drive، VS Code، یک IDE از JetBrains و Obsidian، نمودار جدید و خالی با صفحهٔ خوشآمد باز میشود که منویی از گامهای نخست است: New Table، New Memo، Import، Command Palette و Shortcuts.
پیمایش، بزرگنمایی و جابهجایی میان زبانهها فایل خالی یک نمودار جدید را همانطور که هست باقی میگذارند، زیرا در نمودار جدید همهٔ قفلها روشن هستند. قفل را ببینید.
VS Code فایل ERD را در Source Control، Local History، Compare with Saved، بازبینی ویرایشهای چت VS Code و عاملهای کدنویسی مانند GitHub Copilot و Claude Code و نیز در نماهای نسخهها در افزونههایی مانند GitLens، GitHub Pull Requests و Git Graph بهصورت متن JSON باز میکند، بنابراین تفاوتهای هر تغییر خط به خط نمایش داده میشود. Reopen Editor With... نسخهای ثبتشده در Git را بهصورت نمودار فقط خواندنی نمایش میدهد.
پس از بهروزرسانی پلاگین Obsidian، Obsidian را دوباره راهاندازی کنید: تا آن زمان، پنجره همان ویرایشگری را نگه میدارد که نسخهٔ قبلی بارگذاری کرده بود.
ERD Editor را در هر جایی که نمودارها را به اشتراک میگذارید بهروزرسانی کنید: نسخهای که پیش از معرفی گروههای جدول منتشر شده است، در فایلی که نسخهٔ فعلی ذخیره کرده است هیچ نماد کلید اصلی نشان نمیدهد و ذخیرهٔ فایل در آنجا، گروههای جدول و اسکریپتهای طرحواره SQL آن را از بین میبرد.
فایلی که چنین نسخهای ذخیره کرده باشد، با نخستین تغییری که در فایل ثبت میشود به شکل فعلی بازنویسی میشود؛ قفل را ببینید. تا آن زمان، هر ویرایشگر JSON که فایل را با $schema آن اعتبارسنجی کند، آن را نامعتبر گزارش میکند.
قابلیتها
- جدولها، ستونها و یادداشتها را روی یک بوم بیکران رسم کنید و آنها را با چهار نوع رابطه به هم وصل کنید:
Zero One،Zero N،One Only،One N. شروع ویرایش را ببینید. شاخصها در پنل ویژگیهای جدول تعریف میشوند. شاخص یکتایی که روی دو ستون یا بیشتر تعریف شده باشد یک کلید جایگزین است و وقتی گزینهٔ نمایشAlternate Keyروشن باشد، نمودار ستونهای آن را باAK1.1،AK1.2و غیره علامتگذاری میکند. شاخصها و کلیدهای جایگزین را ببینید. - رابطه را روی ستونهایی که جدول از قبل دارد به پایان برسانید: هنگامی که رابطهای را با ماوس یا قلم رسم میکنید، دکمهٔ
Map to existing columnsدر کنار جدولی که رابطه به آن ختم میشود، کلید جدول والد را با ستونهای آن جدول جفت میکند وCreate new columnsستونهای جدیدی اضافه میکند. گزینهٔMap Columnsدر منوی زمینهٔ رابطه، ستونهای آن را بعداً تغییر میدهد. نگاشت ستونها را ببینید. رابطه میتواند کنشهای ON DELETE و ON UPDATE را نیز داشته باشد. ON DELETE و ON UPDATE را ببینید. - سریع ویرایش کنید:
Alt + Nیک جدول اضافه میکند؛Alt + Enterیک ستون اضافه میکند؛Alt + Kکلید اصلی را روی ستون دارای فوکوس، یا اگر آن ستون یکی از ستونهای انتخابشده باشد روی همهٔ ستونهای انتخابشده، روشن و خاموش میکند؛ وDeleteیاBackspaceموارد انتخابشده را حذف میکند. هر کدام یک گام واگرد است. میانبرها را ببینید. نوار ابزار بوم در پایین بوم نیز با یک کلیک یک جدول یا یک یادداشت اضافه میکند. - یک جدول، یادداشت یا گروه جدول را با انتخابگر رنگی که رنگهای آماده و رنگهایی را که نمودار از قبل به کار میبرد در خود دارد، رنگ کنید و رنگ را با
No colorیاRemove colorحذف کنید. تعیین رنگ جدول و یادداشت را ببینید. - جدولهای مرتبط را در گروههای جدول گرد آورید: کادری پشت آنها که میتوانید برایش نام و رنگ تعیین کنید. گروه را با
Alt + Gیا باNew Table Groupاز منوی زمینهٔ بوم، نوار ابزار بوم یا جستوجوی سریع رسم کنید، یا باTو سپسGیا باGroup selected tablesدر منوی زمینهٔ جدولهای انتخابشده، از آنها یک گروه بسازید. وقتی جدولی را درون گروه رها کنید به آن میپیوندد و وقتی آن را بیرون از گروه رها کنید از آن خارج میشود، و کشیدن گروه از نوار عنوانش، جدولهای آن را همراه با آن جابهجا میکند. DBML گروهها را در هر دو جهت، بهصورت بلوکهایTableGroup، منتقل میکند. - یک طرحوارهٔ موجود را از
json،Schema SQL،GraphQL،DBMLیاAMLوارد کنید. وارد کردن یا صادر کردن فایلها را ببینید. فایل طرحواره SQL، GraphQL، DBML یا AML با جدولهایی وارد میشود که در امتداد رابطههایشان چیده شدهاند، یا اگر رابطهای نداشته باشد، در چند ردیف.Import and Addفایل را بهجای جایگزین کردن نمودار، زیر آن اضافه میکند. - نمودار را بهصورت
jsonصادر کنید؛ بهصورت طرحواره SQL از زبانهٔ طرحواره SQL، که بهصورت فایل.sqlذخیره یا کپی میشود؛ یا از کادر گفتوگویExport imageبهشکل تصویر PNG یا SVG، یا PNG در کلیپبورد. - طرحواره SQL را با نحو هشت سامانهٔ پایگاه داده بنویسید: Databricks، MSSQL، MariaDB، MySQL، Oracle، PostgreSQL، Snowflake و SQLite. قابلیتهای مربوط به جدول را ببینید. پنل گزینههای زبانهٔ طرحواره SQL دستورها، سرآیند و گروههای جدولی را که باید نوشته شوند انتخاب میکند و SQL خودتان را، که در نمودار ذخیره میشود، برای نوشتن پیش و پس از جدولها نگه میدارد.
- برای بیستودو هدف کد تولید کنید: زبانهای C#، Go، Java، Kotlin، PHP، Rust، Scala، Swift و TypeScript؛ ابزارهای ORM یعنی Doctrine، Drizzle، JPA، SeaORM، Sequelize، SQLAlchemy و TypeORM؛ و AML، DBML، GraphQL، JSON Schema، Mermaid و Zod. پنل گزینههای زبانهٔ مولد کد، زبان کد، پایگاه داده و شیوههای نگارش نام را انتخاب میکند و کد بهصورت فایلی با پسوند آن زبان ذخیره یا کپی میشود. مولد کد را ببینید.
- طرحواره را در مصورسازی بخوانید، بهصورت
Graphنیرومحور یا بهصورتFlowاز کارتهای جدول که در امتداد رابطههایشان چیده شدهاند؛ در آنجا بردن نشانگر روی یک جدول، هر چیزی را که به آن متصل است برجسته میکند. در زبانهٔ ERD،Alt + Fرا فشار دهید تا روی جدولهای انتخابشده و جدولهای مرتبط با آنها تمرکز کنید. - روی بومی بیمرز کار کنید: نما را به هر جایی که نمودار امتداد مییابد جابهجا کنید، سطح بزرگنمایی را با
Ctrl + Wheel(⌘ + Wheelدر Mac)، صفحهکلید یا حرکت دوانگشتی از10%تا150%تغییر دهید و با حالت ذن همه چیز جز نمودار را پنهان کنید. کشیدن با دکمهٔ میانی ماوس، نما را از هر جای بوم، حتی روی یک جدول، جابهجا میکند. حرکت در بوم را ببینید. - کل نمودار را در یک گام با چیدمان خودکار مرتب کنید: شبیهسازی نیرو، جریان چپبهراست یا درختی در هر یک از دو جهت، در حالی که هر گروه جدول یکجا نگه داشته میشود.
- با جستوجوی سریع از هر جایی یک فرمان اجرا کنید، یا جستوجو را با
#،@یا:آغاز کنید تا به یک جدول، به یک ستون یا به یک توضیح یا یادداشت بروید. با واگرد، ازنو گامبهگام در تاریخچهٔ ویرایش حرکت کنید، با سفر در زمان تاریخچهٔ این نشست را روی بوم بازپخش کنید یا نمودار را در نمایشگر تفاوتها با یک فایل.jsonدیگر مقایسه کنید. درخت آن، در کنار دو نسخه، جدولها، ستونها، شاخصها، کلیدهای خارجی، یادداشتها و گروههای جدولی را فهرست میکند که افزوده شدهاند، تغییر کردهاند، حذف شدهاند یا تغییر نام یافتهاند. - نمودار را در کاوشگر مرور کنید، درختی که در سمت چپ بوم جای گرفته است: جدولها، هر یک با ستونها، شاخصها و کلیدهای خارجیاش، سپس گروههای جدول و یادداشتها. روی یک ردیف کلیک کنید تا به چیزی بروید که آن ردیف روی بوم نشان میدهد؛ ردیف کلید خارجی، رابطهٔ خود را نیز برجسته میکند. دکمهٔ
Explorerدر نوار ابزار، کنارSearch، آن را باز و بسته میکند. - با یافتن و جایگزینی در بالای کاوشگر، متن را بیابید. این قابلیت نام جدولها، ستونها، شاخصها و گروههای جدول و نیز، پس از روشن کردنشان، توضیحات و یادداشتها را جستوجو میکند و موارد منطبق را در درخت کاوشگر نشان میدهد. یک مورد منطبق یا همهٔ آنها را جایگزین کنید؛
Preserve Caseبه هر جایگزینی، بزرگی و کوچکی حروف متنی را میدهد که جایگزین آن میشود.Ctrl + F(⌘ + Fدر Mac) کاوشگر را با مکاننما در فیلد یافتن باز میکند و فشار دادن دوبارهٔ آن، کاوشگر را میبندد. - از ویرایشگر به 25 زبان استفاده کنید که از دکمهٔ
Display Languageدر نوار ابزار یا از جستوجوی سریع انتخاب میشوند.Systemاز زبان مرورگر یا برنامهٔ میزبان پیروی میکند و در عربی، عبری و فارسی، چیدمان ویرایشگر راستبهچپ میشود، در حالی که نمودار چپبهراست میماند. فقط متن خود ویرایشگر تغییر میکند: نامها، SQL و کد تولیدشده همانطور که نوشته شدهاند میمانند. سازندهٔ طرح زمینه در نوار ابزار، ظاهر (System،LightیاDark)، یک رنگ خاکستری و یک رنگ تأکیدی را انتخاب میکند. زبان و طرح زمینه را ببینید. - تفاوتها را تمیز نگه دارید: موقعیت پیمایش و بزرگنمایی، زبانهٔ باز، زبان کد و شیوههای نگارش نام در مولد کد و همچنین نوع علامت نقلقول بهطور پیشفرض قفلشده هستند، بنابراین فایل مقادیری را نگه میدارد که این موارد هنگام قفل شدن داشتند و پیمایش، بزرگنمایی یا جابهجایی میان زبانهها هرگز آن را تغییر نمیدهد. فایل با ترتیبی ثابت نوشته میشود و عرضهای اندازهگیریشده، ترتیب لایهها، نقاط لنگر خطهای اتصال و موارد حذفشده را در خود ندارد، بنابراین باز کردن نمودار و بستن آن بدون ویرایش، فایل را همانطور که بود باقی میگذارد.
- بگذارید یک عامل کدنویسی مانند Claude Code یا Codex نمودار را از طریق سرور MCP ویرایش کند: بهصورت زنده در VS Code، Obsidian یا یک IDE از JetBrains، که در آنها هر تغییر همان لحظه که رخ میدهد روی بوم نمایان میشود، یا در خود فایل.
- در برنامهٔ وب بهصورت بلادرنگ با هم ویرایش کنید (آزمایشی). نشستها همتابههمتا و با رمزگذاری سرتاسری هستند، بنابراین هیچ سروری طرحوارهٔ شما را نگه نمیدارد و همتاها نشانگرهای ماوس، فوکوس و انتخابهای یکدیگر را میبینند. در صفحهٔ خودتان،
getSharedStore()همان دنبالهٔ کنشها را روی لایهٔ انتقالی که خودتان انتخاب میکنید در اختیارتان میگذارد.
از راهنمای ویرایش شروع کنید.
انگیزهٔ این پروژه
ابزارهای مدلسازی موجود، تجربهٔ کاربری را در سطحی که میخواستم ارائه نمیکردند.
از همین رو، این پروژه را برای ارائهٔ بهترین تجربهٔ کاربری آغاز کردم.
بالاترین اولویت این پروژه، تجربهٔ ویرایش کاربر است.
این پروژه تجربهای شگفتانگیز در ویرایش به شما ارائه خواهد داد.