Giter Club home page Giter Club logo

Comments (6)

dillonzq avatar dillonzq commented on July 18, 2024

@leaxoy
最新会更新一下 exampleSite,里面会有使用流程图的文档,大致示例如下

{{< 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()
    }
{{< /mermaid >}}

使用的是 mermaidjs

from loveit.

leaxoy avatar leaxoy commented on July 18, 2024

非常感谢!

from loveit.

leaxoy avatar leaxoy commented on July 18, 2024

另外这种办法的话,在Typora中是无法预览的, 有没有办法支持代码块的流程图呢 比如:

```mermaid
sequenceDiagram
    participant Publisher
    participant Broker
    participant Subscriber
    Publisher->>Broker: Publish
    Publisher->>Publisher: Delete(Msg)
    Broker->>Subscriber: Publish
    Broker->>Broker: Delete(Msg)

from loveit.

dillonzq avatar dillonzq commented on July 18, 2024

哈喽,@leaxoy
类似 Typora 这种代码块的流程图目前无法做到,因为当前 Hugo 对代码块的渲染结果还无法修改。
不过,Hugo 在 v0.62.0 中改用 Goldmark 支持了 Markdown Render Hooks,但是目前仅可以自定义链接和图片。
并且,这两种 Hook 在这个主题中已经用到了,将来有望支持代码块的 Hook,从而可以实现类似功能。

from loveit.

dillonzq avatar dillonzq commented on July 18, 2024

哈喽,@leaxoy
这是 mermaid 的文档.

from loveit.

mmfei avatar mmfei commented on July 18, 2024

@see #605

from loveit.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.