کتابخانه
mermaid یه کتابخونه جاوااسکریپت متن بازه که با نوشتن متن ساده نمودار می کشه. به جای طراحی دستی، چند خط توضیح می نویسی و مرورگر ازش فلوچارت، نمودار توالی، کلاس، گانت و چند نوع دیگه می سازه. برای مستندات فنی، آموزش و صفحه های توضیح فرآیند به کار می آد و مجوزش MIT هست.
نسخه رسمی و بدون تغییر، از منبع رسمی با مجوز MIT؛ هش هر فایل با منبع بررسی شده است.
۳۶٫۸ مگابایت· ۲۸۲ فایل· انتشار
SHA-256: a8a6a6f805b074a8261a2825c86f99c8054acb3b35f50bb7e24a4f9f2c3c3b9f
اگه تا حالا برای یه مقاله آموزشی یا مستند فنی فلوچارت کشیده باشی، ماجرا رو می دونی. یه ابزار طراحی باز می کنی، شکل ها رو می چینی، خروجی تصویری می گیری و توی سایت آپلود می کنی. دو هفته بعد یه مرحله از فرآیند عوض می شه و باید همه چیز رو از اول انجام بدی. mermaid این کار رو ساده می کنه. نمودار رو با سینتکسی شبیه مارک داون می نویسی و کتابخونه توی مرورگر ازش تصویر می سازه. برای تغییر دادن هم فقط یه خط متن رو ویرایش می کنی.
این کتابخونه چند نوع نمودار رو پوشش می ده: فلوچارت، نمودار توالی، نمودار کلاس، گانت برای زمان بندی پروژه، نقشه ذهنی، گیت گراف و چند مورد دیگه. Knut Sveidqvist اولین بار نوشتش و با مجوز MIT منتشر شده، پس توی سایت شخصی و تجاری آزادانه می تونی ازش استفاده کنی. خیلی از ابزارهای مستندسازی و یادداشت برداری هم همین سینتکس رو می شناسن. برای همین چیزی که یاد می گیری فقط به یه سایت محدود نمی شه.
کجا به کارت می آد؟ توی مستندات فنی، آموزش های برنامه نویسی، وبلاگ های تخصصی، پنل های داخلی و هر صفحه ای که یه فرآیند رو توضیح می ده، مثل مراحل ثبت سفارش یا مسیر تایید یه درخواست. اگه نمودارها مرتب به روز می شن و کسی وقت نداره هر بار فایل گرافیکی بسازه، mermaid کلی وقتت رو نگه می داره. ولی برای همه کاری نیست. اگه می خوای جای دقیق هر شکل رو خودت تعیین کنی یا اینفوگرافیک می خوای، سراغ یه ابزار طراحی برو. برای نمودارهای داده ای با عدد زنده هم کتابخونه های مخصوص نمودار انتخاب بهتریه.
چند نکته قبل از شروع. اول، متن فارسی داخل نمودار رو حتما تست کن، چون جهت راست به چپ و فونت توی بعضی نوع نمودارها ممکنه نیاز به تنظیم داشته باشه. دوم، فایل رو از هاست خودت لود کن، نه از یه سرور خارجی. اینطوری وقتی اینترنت بین الملل مشکل داره، نمودارهات هم بالا می آن. سوم، این کتابخونه از ابزارهای کوچیک سنگین تره، پس فقط توی صفحه هایی لودش کن که واقعا نمودار دارن. نسخه های رسمی و بدون تغییر mermaid توی مخزن داخلی ما هم در دسترسه و می تونی همین جا برداری.
استفاده ازش پیچیده نیست.
بعد از ذخیره، صفحه رو رفرش کن. اگه به جای نمودار متن خام دیدی، معمولا یا آدرس فایل اشتباهه یا توی متن نمودار یه خطای سینتکسی هست. کنسول مرورگر رو با F12 باز کن، پیام خطا همون جا نوشته شده.
یه توصیه هم دارم: نمودار رو اول توی یه صفحه تستی بساز و بعد ببرش روی سایت اصلی. اگه متنت فارسیه، جهت و فونت خروجی رو چک کن و اگه لازم شد، فونت رو توی تنظیمات اولیه کتابخونه عوض کن.
mermaid یه کتابخونه جاوااسکریپته که از روی متن ساده نمودار می سازه. فلوچارت، نمودار توالی، کلاس، گانت و نقشه ذهنی از جمله چیزهایی هستن که پشتیبانی می کنه. به درد کسی می خوره که می خواد نمودارهاش رو مثل متن ویرایش و نگهداری کنه، نه مثل یه فایل تصویری جدا.
متن فارسی معمولا نمایش داده می شه، ولی جهت راست به چپ و فونت توی بعضی نمودارها ممکنه مرتب نباشه. قبل از انتشار، نمودارت رو با متن واقعی تست کن و اگه لازم شد، فونت رو از تنظیمات کتابخونه عوض کن.
آره، مجوزش MIT هست. یعنی استفاده توی پروژه های شخصی و تجاری آزاده و فقط باید اعلام مجوز و حق نشر رو توی فایل ها دست نخورده نگه داری. برای خود کتابخونه هزینه ای نمی دی. اگه فایل رو روی هاست خودت می ذاری، کامنت مجوز بالای فایل رو پاک نکن و اگه خواستی، یه نسخه از متن مجوز رو هم کنارش نگه دار.
کتابخونه نمودار رو توی مرورگر کاربر می سازه و به سرویس بیرونی نیازی نداره. فقط فایلش رو باید از هاست خودت لود کنی، نه از یه سرور خارجی. یه چیز دیگه هم هست: اگه نمودارت فونت یا آیکون خارجی صدا بزنه، اون ها هم باید روی هاست خودت باشن.
نام کتابخانه، افزونه یا قالب را بفرستید؛ پس از بررسی، نسخه‌های رسمی آن به مخزن اضافه می‌شود.