mirror of
https://github.com/mermaid-js/mermaid.git
synced 2025-01-14 06:43:25 +08:00
Merge branch 'master' of github.com:mermaid-js/mermaid into develop
* 'master' of github.com:mermaid-js/mermaid: docs: fix lint docs: move community to Discord Delete docs/syntax/gantt.html Add more detailed docs for Gantt tasks Update docs Update packages/mermaid/src/docs/syntax/flowchart.md Update flowchart.md #5195
This commit is contained in:
commit
17066aab97
6
.github/ISSUE_TEMPLATE/config.yml
vendored
6
.github/ISSUE_TEMPLATE/config.yml
vendored
@ -3,9 +3,9 @@ contact_links:
|
|||||||
- name: GitHub Discussions
|
- name: GitHub Discussions
|
||||||
url: https://github.com/mermaid-js/mermaid/discussions
|
url: https://github.com/mermaid-js/mermaid/discussions
|
||||||
about: Ask the Community questions or share your own graphs in our discussions.
|
about: Ask the Community questions or share your own graphs in our discussions.
|
||||||
- name: Slack
|
- name: Discord
|
||||||
url: https://join.slack.com/t/mermaid-talk/shared_invite/enQtNzc4NDIyNzk4OTAyLWVhYjQxOTI2OTg4YmE1ZmJkY2Y4MTU3ODliYmIwOTY3NDJlYjA0YjIyZTdkMDMyZTUwOGI0NjEzYmEwODcwOTE
|
url: https://discord.gg/wwtabKgp8y
|
||||||
about: Join our Community on Slack for Help and a casual chat.
|
about: Join our Community on Discord for Help and a casual chat.
|
||||||
- name: Documentation
|
- name: Documentation
|
||||||
url: https://mermaid.js.org
|
url: https://mermaid.js.org
|
||||||
about: Read our documentation for all that Mermaid.js can offer.
|
about: Read our documentation for all that Mermaid.js can offer.
|
||||||
|
4
.github/lychee.toml
vendored
4
.github/lychee.toml
vendored
@ -34,8 +34,8 @@ exclude = [
|
|||||||
# Don't check files that are generated during the build via `pnpm docs:code`
|
# Don't check files that are generated during the build via `pnpm docs:code`
|
||||||
'packages/mermaid/src/docs/config/setup/*',
|
'packages/mermaid/src/docs/config/setup/*',
|
||||||
|
|
||||||
# Ignore slack invite
|
# Ignore Discord invite
|
||||||
"https://join.slack.com/"
|
"https://discord.gg"
|
||||||
]
|
]
|
||||||
|
|
||||||
# Exclude all private IPs from checking.
|
# Exclude all private IPs from checking.
|
||||||
|
@ -15,7 +15,7 @@ Generate diagrams from markdown-like text.
|
|||||||
<a href="https://mermaid.live/"><b>Live Editor!</b></a>
|
<a href="https://mermaid.live/"><b>Live Editor!</b></a>
|
||||||
</p>
|
</p>
|
||||||
<p align="center">
|
<p align="center">
|
||||||
<a href="https://mermaid.js.org">📖 Documentation</a> | <a href="https://mermaid.js.org/intro/">🚀 Getting Started</a> | <a href="https://www.jsdelivr.com/package/npm/mermaid">🌐 CDN</a> | <a href="https://join.slack.com/t/mermaid-talk/shared_invite/enQtNzc4NDIyNzk4OTAyLWVhYjQxOTI2OTg4YmE1ZmJkY2Y4MTU3ODliYmIwOTY3NDJlYjA0YjIyZTdkMDMyZTUwOGI0NjEzYmEwODcwOTE" title="Slack invite">🙌 Join Us</a>
|
<a href="https://mermaid.js.org">📖 Documentation</a> | <a href="https://mermaid.js.org/intro/">🚀 Getting Started</a> | <a href="https://www.jsdelivr.com/package/npm/mermaid">🌐 CDN</a> | <a href="https://discord.gg/wwtabKgp8y" title="Discord invite">🙌 Join Us</a>
|
||||||
</p>
|
</p>
|
||||||
<p align="center">
|
<p align="center">
|
||||||
<a href="./README.zh-CN.md">简体中文</a>
|
<a href="./README.zh-CN.md">简体中文</a>
|
||||||
@ -33,7 +33,7 @@ Try Live Editor previews of future releases: <a href="https://develop.git.mermai
|
|||||||
[![Coverage Status](https://codecov.io/github/mermaid-js/mermaid/branch/develop/graph/badge.svg)](https://app.codecov.io/github/mermaid-js/mermaid/tree/develop)
|
[![Coverage Status](https://codecov.io/github/mermaid-js/mermaid/branch/develop/graph/badge.svg)](https://app.codecov.io/github/mermaid-js/mermaid/tree/develop)
|
||||||
[![CDN Status](https://img.shields.io/jsdelivr/npm/hm/mermaid)](https://www.jsdelivr.com/package/npm/mermaid)
|
[![CDN Status](https://img.shields.io/jsdelivr/npm/hm/mermaid)](https://www.jsdelivr.com/package/npm/mermaid)
|
||||||
[![NPM Downloads](https://img.shields.io/npm/dm/mermaid)](https://www.npmjs.com/package/mermaid)
|
[![NPM Downloads](https://img.shields.io/npm/dm/mermaid)](https://www.npmjs.com/package/mermaid)
|
||||||
[![Join our Slack!](https://img.shields.io/static/v1?message=join%20chat&color=9cf&logo=slack&label=slack)](https://join.slack.com/t/mermaid-talk/shared_invite/enQtNzc4NDIyNzk4OTAyLWVhYjQxOTI2OTg4YmE1ZmJkY2Y4MTU3ODliYmIwOTY3NDJlYjA0YjIyZTdkMDMyZTUwOGI0NjEzYmEwODcwOTE)
|
[![Join our Discord!](https://img.shields.io/static/v1?message=join%20chat&color=9cf&logo=discord&label=discord)](https://discord.gg/wwtabKgp8y)
|
||||||
[![Twitter Follow](https://img.shields.io/badge/Social-mermaidjs__-blue?style=social&logo=X)](https://twitter.com/mermaidjs_)
|
[![Twitter Follow](https://img.shields.io/badge/Social-mermaidjs__-blue?style=social&logo=X)](https://twitter.com/mermaidjs_)
|
||||||
|
|
||||||
<img src="./img/header.png" alt="" />
|
<img src="./img/header.png" alt="" />
|
||||||
|
@ -15,7 +15,7 @@ Mermaid
|
|||||||
<a href="https://mermaid.live/"><b>实时编辑器!</b></a>
|
<a href="https://mermaid.live/"><b>实时编辑器!</b></a>
|
||||||
</p>
|
</p>
|
||||||
<p align="center">
|
<p align="center">
|
||||||
<a href="https://mermaid.js.org">📖 文档</a> | <a href="https://mermaid.js.org/intro/">🚀 入门</a> | <a href="https://www.jsdelivr.com/package/npm/mermaid">🌐 CDN</a> | <a href="https://join.slack.com/t/mermaid-talk/shared_invite/enQtNzc4NDIyNzk4OTAyLWVhYjQxOTI2OTg4YmE1ZmJkY2Y4MTU3ODliYmIwOTY3NDJlYjA0YjIyZTdkMDMyZTUwOGI0NjEzYmEwODcwOTE" title="Slack invite">🙌 加入我们</a>
|
<a href="https://mermaid.js.org">📖 文档</a> | <a href="https://mermaid.js.org/intro/">🚀 入门</a> | <a href="https://www.jsdelivr.com/package/npm/mermaid">🌐 CDN</a> | <a href="https://discord.gg/wwtabKgp8y" title="Discord invite">🙌 加入我们</a>
|
||||||
</p>
|
</p>
|
||||||
<p align="center">
|
<p align="center">
|
||||||
<a href="./README.md">English</a>
|
<a href="./README.md">English</a>
|
||||||
@ -34,7 +34,7 @@ Mermaid
|
|||||||
[![Coverage Status](https://codecov.io/github/mermaid-js/mermaid/branch/develop/graph/badge.svg)](https://app.codecov.io/github/mermaid-js/mermaid/tree/develop)
|
[![Coverage Status](https://codecov.io/github/mermaid-js/mermaid/branch/develop/graph/badge.svg)](https://app.codecov.io/github/mermaid-js/mermaid/tree/develop)
|
||||||
[![CDN Status](https://img.shields.io/jsdelivr/npm/hm/mermaid)](https://www.jsdelivr.com/package/npm/mermaid)
|
[![CDN Status](https://img.shields.io/jsdelivr/npm/hm/mermaid)](https://www.jsdelivr.com/package/npm/mermaid)
|
||||||
[![NPM Downloads](https://img.shields.io/npm/dm/mermaid)](https://www.npmjs.com/package/mermaid)
|
[![NPM Downloads](https://img.shields.io/npm/dm/mermaid)](https://www.npmjs.com/package/mermaid)
|
||||||
[![Join our Slack!](https://img.shields.io/static/v1?message=join%20chat&color=9cf&logo=slack&label=slack)](https://join.slack.com/t/mermaid-talk/shared_invite/enQtNzc4NDIyNzk4OTAyLWVhYjQxOTI2OTg4YmE1ZmJkY2Y4MTU3ODliYmIwOTY3NDJlYjA0YjIyZTdkMDMyZTUwOGI0NjEzYmEwODcwOTE)
|
[![Join our Discord!](https://img.shields.io/static/v1?message=join%20chat&color=9cf&logo=discord&label=discord)](https://discord.gg/wwtabKgp8y)
|
||||||
[![Twitter Follow](https://img.shields.io/badge/Social-mermaidjs__-blue?style=social&logo=X)](https://twitter.com/mermaidjs_)
|
[![Twitter Follow](https://img.shields.io/badge/Social-mermaidjs__-blue?style=social&logo=X)](https://twitter.com/mermaidjs_)
|
||||||
|
|
||||||
<img src="./img/header.png" alt="" />
|
<img src="./img/header.png" alt="" />
|
||||||
|
@ -16,7 +16,7 @@ We aim to reply within three working days, probably much sooner.
|
|||||||
|
|
||||||
You should expect a close collaboration as we work to resolve the issue you have reported. Please reach out to <security@mermaid.live> again if you do not receive prompt attention and regular updates.
|
You should expect a close collaboration as we work to resolve the issue you have reported. Please reach out to <security@mermaid.live> again if you do not receive prompt attention and regular updates.
|
||||||
|
|
||||||
You may also reach out to the team via our public Slack chat channels; however, please make sure to e-mail <security@mermaid.live> when reporting an issue, and avoid revealing information about vulnerabilities in public as that could that could put users at risk.
|
You may also reach out to the team via our public Discord chat channels; however, please make sure to e-mail <security@mermaid.live> when reporting an issue, and avoid revealing information about vulnerabilities in public as that could that could put users at risk.
|
||||||
|
|
||||||
## Best practices
|
## Best practices
|
||||||
|
|
||||||
|
@ -22,9 +22,9 @@ Currently pending [IANA](https://www.iana.org/) recognition.
|
|||||||
|
|
||||||
## Showcase
|
## Showcase
|
||||||
|
|
||||||
### Mermaid Slack workspace
|
### Mermaid Discord workspace
|
||||||
|
|
||||||
We would love to see what you create with Mermaid. Please share your creations with us in our [Slack](https://join.slack.com/t/mermaid-talk/shared_invite/zt-22p2r8p9y-qiyP1H38GjFQ6S6jbBkOxQ) workspace [#community-showcase](https://mermaid-talk.slack.com/archives/C05NK37LT40) channel.
|
We would love to see what you create with Mermaid. Please share your creations with us in our [Discord](https://discord.gg/wwtabKgp8y) server [#showcase](https://discord.com/channels/1079455296289788015/1079502635054399649) channel.
|
||||||
|
|
||||||
### Add to Mermaid Ecosystem
|
### Add to Mermaid Ecosystem
|
||||||
|
|
||||||
|
@ -22,7 +22,7 @@ It is a JavaScript based diagramming and charting tool that renders Markdown-ins
|
|||||||
[![Coverage Status](https://coveralls.io/repos/github/mermaid-js/mermaid/badge.svg?branch=master)](https://coveralls.io/github/mermaid-js/mermaid?branch=master)
|
[![Coverage Status](https://coveralls.io/repos/github/mermaid-js/mermaid/badge.svg?branch=master)](https://coveralls.io/github/mermaid-js/mermaid?branch=master)
|
||||||
[![CDN Status](https://img.shields.io/jsdelivr/npm/hm/mermaid)](https://www.jsdelivr.com/package/npm/mermaid)
|
[![CDN Status](https://img.shields.io/jsdelivr/npm/hm/mermaid)](https://www.jsdelivr.com/package/npm/mermaid)
|
||||||
[![NPM](https://img.shields.io/npm/dm/mermaid)](https://www.npmjs.com/package/mermaid)
|
[![NPM](https://img.shields.io/npm/dm/mermaid)](https://www.npmjs.com/package/mermaid)
|
||||||
[![Join our Slack!](https://img.shields.io/static/v1?message=join%20chat&color=9cf&logo=slack&label=slack)](https://join.slack.com/t/mermaid-talk/shared_invite/enQtNzc4NDIyNzk4OTAyLWVhYjQxOTI2OTg4YmE1ZmJkY2Y4MTU3ODliYmIwOTY3NDJlYjA0YjIyZTdkMDMyZTUwOGI0NjEzYmEwODcwOTE)
|
[![Join our Discord!](https://img.shields.io/static/v1?message=join%20chat&color=9cf&logo=discord&label=discord)](https://discord.gg/wwtabKgp8y)
|
||||||
[![Twitter Follow](https://img.shields.io/twitter/follow/mermaidjs_?style=social)](https://twitter.com/mermaidjs_)
|
[![Twitter Follow](https://img.shields.io/twitter/follow/mermaidjs_?style=social)](https://twitter.com/mermaidjs_)
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
@ -1134,7 +1134,19 @@ flowchart TD
|
|||||||
B-->E(A fa:fa-camera-retro perhaps?)
|
B-->E(A fa:fa-camera-retro perhaps?)
|
||||||
```
|
```
|
||||||
|
|
||||||
Mermaid is compatible with Font Awesome up to version 5, Free icons only. Check that the icons you use are from the [supported set of icons](https://fontawesome.com/v5/search?o=r&m=free).
|
Mermaid supports Font Awesome if the CSS is included on the website.
|
||||||
|
Mermaid does not have any restriction on the version of Font Awesome that can be used.
|
||||||
|
|
||||||
|
Please refer the [Official Font Awesome Documentation](https://fontawesome.com/start) on how to include it in your website.
|
||||||
|
|
||||||
|
Adding this snippet in the `<head>` would add support for Font Awesome v6.5.1
|
||||||
|
|
||||||
|
```html
|
||||||
|
<link
|
||||||
|
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css"
|
||||||
|
rel="stylesheet"
|
||||||
|
/>
|
||||||
|
```
|
||||||
|
|
||||||
## Graph declarations with spaces between vertices and link and without semicolon
|
## Graph declarations with spaces between vertices and link and without semicolon
|
||||||
|
|
||||||
|
@ -114,7 +114,30 @@ gantt
|
|||||||
Add another diagram to demo page :48h
|
Add another diagram to demo page :48h
|
||||||
```
|
```
|
||||||
|
|
||||||
It is possible to set multiple dependencies separated by space:
|
Tasks are by default sequential. A task start date defaults to the end date of the preceding task.
|
||||||
|
|
||||||
|
A colon, `:`, separates the task title from its metadata.
|
||||||
|
Metadata items are separated by a comma, `,`. Valid tags are `active`, `done`, `crit`, and `milestone`. Tags are optional, but if used, they must be specified first.
|
||||||
|
After processing the tags, the remaining metadata items are interpreted as follows:
|
||||||
|
|
||||||
|
1. If a single item is specified, it determines when the task ends. It can either be a specific date/time or a duration. If a duration is specified, it is added to the start date of the task to determine the end date of the task, taking into account any exclusions.
|
||||||
|
2. If two items are specified, the last item is interpreted as in the previous case. The first item can either specify an explicit start date/time (in the format specified by `dateFormat`) or reference another task using `after <otherTaskID> [[otherTaskID2 [otherTaskID3]]...]`. In the latter case, the start date of the task will be set according to the latest end date of any referenced task.
|
||||||
|
3. If three items are specified, the last two will be interpreted as in the previous case. The first item will denote the ID of the task, which can be referenced using the `later <taskID>` syntax.
|
||||||
|
|
||||||
|
| Metadata syntax | Start date | End date | ID |
|
||||||
|
| ------------------------------------------ | --------------------------------------------------- | ------------------------------------------- | -------- |
|
||||||
|
| `<taskID>, <startDate>, <endDate>` | `startdate` as interpreted using `dateformat` | `endDate` as interpreted using `dateformat` | `taskID` |
|
||||||
|
| `<taskID>, <startDate>, <length>` | `startdate` as interpreted using `dateformat` | Start date + `length` | `taskID` |
|
||||||
|
| `<taskID>, after <otherTaskId>, <endDate>` | End date of previously specified task `otherTaskID` | `endDate` as interpreted using `dateformat` | `taskID` |
|
||||||
|
| `<taskID>, after <otherTaskId>, <length>` | End date of previously specified task `otherTaskID` | Start date + `length` | `taskID` |
|
||||||
|
| `<startDate>, <endDate>` | `startdate` as interpreted using `dateformat` | `enddate` as interpreted using `dateformat` | n/a |
|
||||||
|
| `<startDate>, <length>` | `startdate` as interpreted using `dateformat` | Start date + `length` | n/a |
|
||||||
|
| `after <otherTaskID>, <endDate>` | End date of previously specified task `otherTaskID` | `enddate` as interpreted using `dateformat` | n/a |
|
||||||
|
| `after <otherTaskID>, <length>` | End date of previously specified task `otherTaskID` | Start date + `length` | n/a |
|
||||||
|
| `<endDate>` | End date of preceding task | `enddate` as interpreted using `dateformat` | n/a |
|
||||||
|
| `<length>` | End date of preceding task | Start date + `length` | n/a |
|
||||||
|
|
||||||
|
For simplicity, the table does not show the use of multiple tasks listed with the `after` keyword. Here is an example of how to use it and how it's interpreted:
|
||||||
|
|
||||||
```mermaid-example
|
```mermaid-example
|
||||||
gantt
|
gantt
|
||||||
|
@ -16,11 +16,7 @@ import { teamMembers } from '../contributors';
|
|||||||
<p text-lg max-w-200 text-center leading-7>
|
<p text-lg max-w-200 text-center leading-7>
|
||||||
<Contributors />
|
<Contributors />
|
||||||
<br />
|
<br />
|
||||||
<a
|
<a href="https://discord.gg/wwtabKgp8y" rel="noopener noreferrer">Join the community</a>
|
||||||
href="https://join.slack.com/t/mermaid-talk/shared_invite/enQtNzc4NDIyNzk4OTAyLWVhYjQxOTI2OTg4YmE1ZmJkY2Y4MTU3ODliYmIwOTY3NDJlYjA0YjIyZTdkMDMyZTUwOGI0NjEzYmEwODcwOTE"
|
|
||||||
rel="noopener noreferrer"
|
|
||||||
>Join the community</a
|
|
||||||
>
|
|
||||||
and get involved!
|
and get involved!
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
|
@ -55,8 +55,8 @@ export default defineConfig({
|
|||||||
socialLinks: [
|
socialLinks: [
|
||||||
{ icon: 'github', link: 'https://github.com/mermaid-js/mermaid' },
|
{ icon: 'github', link: 'https://github.com/mermaid-js/mermaid' },
|
||||||
{
|
{
|
||||||
icon: 'slack',
|
icon: 'discord',
|
||||||
link: 'https://join.slack.com/t/mermaid-talk/shared_invite/enQtNzc4NDIyNzk4OTAyLWVhYjQxOTI2OTg4YmE1ZmJkY2Y4MTU3ODliYmIwOTY3NDJlYjA0YjIyZTdkMDMyZTUwOGI0NjEzYmEwODcwOTE',
|
link: 'https://discord.gg/wwtabKgp8y',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
icon: {
|
icon: {
|
||||||
|
@ -10,7 +10,7 @@ We aim to reply within three working days, probably much sooner.
|
|||||||
|
|
||||||
You should expect a close collaboration as we work to resolve the issue you have reported. Please reach out to <security@mermaid.live> again if you do not receive prompt attention and regular updates.
|
You should expect a close collaboration as we work to resolve the issue you have reported. Please reach out to <security@mermaid.live> again if you do not receive prompt attention and regular updates.
|
||||||
|
|
||||||
You may also reach out to the team via our public Slack chat channels; however, please make sure to e-mail <security@mermaid.live> when reporting an issue, and avoid revealing information about vulnerabilities in public as that could that could put users at risk.
|
You may also reach out to the team via our public Discord chat channels; however, please make sure to e-mail <security@mermaid.live> when reporting an issue, and avoid revealing information about vulnerabilities in public as that could that could put users at risk.
|
||||||
|
|
||||||
## Best practices
|
## Best practices
|
||||||
|
|
||||||
|
@ -16,9 +16,9 @@ Currently pending [IANA](https://www.iana.org/) recognition.
|
|||||||
|
|
||||||
## Showcase
|
## Showcase
|
||||||
|
|
||||||
### Mermaid Slack workspace
|
### Mermaid Discord workspace
|
||||||
|
|
||||||
We would love to see what you create with Mermaid. Please share your creations with us in our [Slack](https://join.slack.com/t/mermaid-talk/shared_invite/zt-22p2r8p9y-qiyP1H38GjFQ6S6jbBkOxQ) workspace [#community-showcase](https://mermaid-talk.slack.com/archives/C05NK37LT40) channel.
|
We would love to see what you create with Mermaid. Please share your creations with us in our [Discord](https://discord.gg/wwtabKgp8y) server [#showcase](https://discord.com/channels/1079455296289788015/1079502635054399649) channel.
|
||||||
|
|
||||||
### Add to Mermaid Ecosystem
|
### Add to Mermaid Ecosystem
|
||||||
|
|
||||||
|
@ -16,7 +16,7 @@ It is a JavaScript based diagramming and charting tool that renders Markdown-ins
|
|||||||
[![Coverage Status](https://coveralls.io/repos/github/mermaid-js/mermaid/badge.svg?branch=master)](https://coveralls.io/github/mermaid-js/mermaid?branch=master)
|
[![Coverage Status](https://coveralls.io/repos/github/mermaid-js/mermaid/badge.svg?branch=master)](https://coveralls.io/github/mermaid-js/mermaid?branch=master)
|
||||||
[![CDN Status](https://img.shields.io/jsdelivr/npm/hm/mermaid)](https://www.jsdelivr.com/package/npm/mermaid)
|
[![CDN Status](https://img.shields.io/jsdelivr/npm/hm/mermaid)](https://www.jsdelivr.com/package/npm/mermaid)
|
||||||
[![NPM](https://img.shields.io/npm/dm/mermaid)](https://www.npmjs.com/package/mermaid)
|
[![NPM](https://img.shields.io/npm/dm/mermaid)](https://www.npmjs.com/package/mermaid)
|
||||||
[![Join our Slack!](https://img.shields.io/static/v1?message=join%20chat&color=9cf&logo=slack&label=slack)](https://join.slack.com/t/mermaid-talk/shared_invite/enQtNzc4NDIyNzk4OTAyLWVhYjQxOTI2OTg4YmE1ZmJkY2Y4MTU3ODliYmIwOTY3NDJlYjA0YjIyZTdkMDMyZTUwOGI0NjEzYmEwODcwOTE)
|
[![Join our Discord!](https://img.shields.io/static/v1?message=join%20chat&color=9cf&logo=discord&label=discord)](https://discord.gg/wwtabKgp8y)
|
||||||
[![Twitter Follow](https://img.shields.io/twitter/follow/mermaidjs_?style=social)](https://twitter.com/mermaidjs_)
|
[![Twitter Follow](https://img.shields.io/twitter/follow/mermaidjs_?style=social)](https://twitter.com/mermaidjs_)
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
@ -775,7 +775,18 @@ flowchart TD
|
|||||||
B-->E(A fa:fa-camera-retro perhaps?)
|
B-->E(A fa:fa-camera-retro perhaps?)
|
||||||
```
|
```
|
||||||
|
|
||||||
Mermaid is compatible with Font Awesome up to version 5, Free icons only. Check that the icons you use are from the [supported set of icons](https://fontawesome.com/v5/search?o=r&m=free).
|
Mermaid supports Font Awesome if the CSS is included on the website.
|
||||||
|
Mermaid does not have any restriction on the version of Font Awesome that can be used.
|
||||||
|
|
||||||
|
Please refer the [Official Font Awesome Documentation](https://fontawesome.com/start) on how to include it in your website.
|
||||||
|
|
||||||
|
Adding this snippet in the `<head>` would add support for Font Awesome v6.5.1
|
||||||
|
```html
|
||||||
|
<link
|
||||||
|
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css"
|
||||||
|
rel="stylesheet"
|
||||||
|
/>
|
||||||
|
```
|
||||||
|
|
||||||
## Graph declarations with spaces between vertices and link and without semicolon
|
## Graph declarations with spaces between vertices and link and without semicolon
|
||||||
|
|
||||||
|
@ -63,7 +63,30 @@ gantt
|
|||||||
Add another diagram to demo page :48h
|
Add another diagram to demo page :48h
|
||||||
```
|
```
|
||||||
|
|
||||||
It is possible to set multiple dependencies separated by space:
|
Tasks are by default sequential. A task start date defaults to the end date of the preceding task.
|
||||||
|
|
||||||
|
A colon, `:`, separates the task title from its metadata.
|
||||||
|
Metadata items are separated by a comma, `,`. Valid tags are `active`, `done`, `crit`, and `milestone`. Tags are optional, but if used, they must be specified first.
|
||||||
|
After processing the tags, the remaining metadata items are interpreted as follows:
|
||||||
|
|
||||||
|
1. If a single item is specified, it determines when the task ends. It can either be a specific date/time or a duration. If a duration is specified, it is added to the start date of the task to determine the end date of the task, taking into account any exclusions.
|
||||||
|
2. If two items are specified, the last item is interpreted as in the previous case. The first item can either specify an explicit start date/time (in the format specified by `dateFormat`) or reference another task using `after <otherTaskID> [[otherTaskID2 [otherTaskID3]]...]`. In the latter case, the start date of the task will be set according to the latest end date of any referenced task.
|
||||||
|
3. If three items are specified, the last two will be interpreted as in the previous case. The first item will denote the ID of the task, which can be referenced using the `later <taskID>` syntax.
|
||||||
|
|
||||||
|
| Metadata syntax | Start date | End date | ID |
|
||||||
|
| ------------------------------------------ | --------------------------------------------------- | ------------------------------------------- | -------- |
|
||||||
|
| `<taskID>, <startDate>, <endDate>` | `startdate` as interpreted using `dateformat` | `endDate` as interpreted using `dateformat` | `taskID` |
|
||||||
|
| `<taskID>, <startDate>, <length>` | `startdate` as interpreted using `dateformat` | Start date + `length` | `taskID` |
|
||||||
|
| `<taskID>, after <otherTaskId>, <endDate>` | End date of previously specified task `otherTaskID` | `endDate` as interpreted using `dateformat` | `taskID` |
|
||||||
|
| `<taskID>, after <otherTaskId>, <length>` | End date of previously specified task `otherTaskID` | Start date + `length` | `taskID` |
|
||||||
|
| `<startDate>, <endDate>` | `startdate` as interpreted using `dateformat` | `enddate` as interpreted using `dateformat` | n/a |
|
||||||
|
| `<startDate>, <length>` | `startdate` as interpreted using `dateformat` | Start date + `length` | n/a |
|
||||||
|
| `after <otherTaskID>, <endDate>` | End date of previously specified task `otherTaskID` | `enddate` as interpreted using `dateformat` | n/a |
|
||||||
|
| `after <otherTaskID>, <length>` | End date of previously specified task `otherTaskID` | Start date + `length` | n/a |
|
||||||
|
| `<endDate>` | End date of preceding task | `enddate` as interpreted using `dateformat` | n/a |
|
||||||
|
| `<length>` | End date of preceding task | Start date + `length` | n/a |
|
||||||
|
|
||||||
|
For simplicity, the table does not show the use of multiple tasks listed with the `after` keyword. Here is an example of how to use it and how it's interpreted:
|
||||||
|
|
||||||
```mermaid-example
|
```mermaid-example
|
||||||
gantt
|
gantt
|
||||||
|
Loading…
x
Reference in New Issue
Block a user