解决画图和修改麻烦的问题

Markdown Diagram 功能

一直以来都很想找到一个能通过编程(文字描述)的形式画图的工具,记在 todo 列表里很久,今天终于在谷歌上用蹩脚的英文搜索了关键词language to write status diagram ,幸运地找到了这篇文章Draw Diagrams With Markdown,几乎涵盖了各类的图,状态图,甘特图,流程图,类图

大部分的底层实现好像是 JS 写的, 看来 JS 也要捡起来了

一些常用的例子

State Diagrams

mermaid
stateDiagram
    [*] --> Still
    Still --> [*]

    Still --> Moving
    Moving --> Still
    Moving --> Crash
    Crash --> [*]

Flowchart

mermaid
graph LR
A[Hard edge] -->B(Round edge)
    B --> C{Decision}
    C -->|One| D[Result one]
    C -->|Two| E[Result two]

Class

mermaid
classDiagram
      Animal <|-- Duck
      Animal <|-- Fish
      Animal <|-- Zebra
      Animal : +int age
      Animal : +String gender
      Animal: +isMammal()
      Animal: +mate()
      class Duck{
          +String beakColor
          +swim()
          +quack()
      }
      class Fish{
          -int sizeInFeet
          -canEat()
      }
      class Zebra{
          +bool is_wild
          +run()
      }