2024-02-20 01:10:50 +03:30
---
title: نمودارها
weight: 6
next: /docs/guide/shortcodes
---
2025-08-14 22:07:15 +08:00
در حال حاضر، Hextra از [Mermaid ](#mermaid ) برای نمودارها پشتیبانی میکند.
2024-02-20 01:10:50 +03:30
<!-- more -->
## Mermaid
2025-08-14 22:07:15 +08:00
[Mermaid ](https://github.com/mermaid-js/mermaid#readme ) یک ابزار نمودار و چارت مبتنی بر جاوااسکریپت است که تعاریف متنی الهامگرفته از Markdown را گرفته و به صورت پویا در مرورگر نمودارها را ایجاد میکند. به عنوان مثال، Mermaid میتواند فلوچارتها، نمودارهای توالی، نمودارهای دایرهای و موارد دیگر را رندر کند.
2024-02-20 01:10:50 +03:30
2025-08-14 22:07:15 +08:00
استفاده از Mermaid در Hextra به سادگی نوشتن یک بلوک کد با زبان تنظیم شده `mermaid` است:
2024-02-20 01:10:50 +03:30
````markdown
```mermaid
graph TD;
A-->B;
A-->C;
B-->D;
C-->D;
```
````
2025-08-14 22:07:15 +08:00
به صورت زیر رندر میشود:
2024-02-20 01:10:50 +03:30
```mermaid
graph TD;
A-->B;
A-->C;
B-->D;
C-->D;
```
نمودار توالی:
```mermaid
sequenceDiagram
participant Alice
participant Bob
Alice->>John: Hello John, how are you?
loop Healthcheck
John->>John: Fight against hypochondria
end
Note right of John: Rational thoughts < br / > prevail!
John-->>Alice: Great!
John->>Bob: How about you?
Bob-->>John: Jolly good!
```
2025-08-14 22:07:15 +08:00
برای اطلاعات بیشتر، لطفاً به [مستندات Mermaid ](https://mermaid-js.github.io/mermaid/#/ ) مراجعه کنید.