Mermaid diagram renders in Obsidian but not in MKDocs

virtualarchitectures commented 2 years ago

Hi,

I've added Mermaid to the MKDocs configuration file mkdocs.yml as indicated on the material theme reference: https://squidfunk.github.io/mkdocs-material/reference/diagrams/

# Extensions
markdown_extensions:
  - footnotes
  # - attr_list
  # - pymdownx.arithmatex
  - pymdownx.superfences:
      custom_fences:
        - name: mermaid
          class: mermaid
          format: !!python/name:pymdownx.superfences.fence_code_format
  # - pymdownx.details
  # - pymdownx.magiclink
  # - pymdownx.tasklist:
  #     custom_checkbox: true
#  - pymdownx.emoji:
#      emoji_generator: !!python/name:pymdownx.emoji.to_svg
  # - admonition
  - toc:
      permalink: true

The Mermaid chart elements render in the local Obsidian instance but not on the site created with obsidian-publish-mkdocs.

Local

MKDocs site

Is there something further that need to be enabled or any changes required to the configuration for this to work?

virtualarchitectures commented 2 years ago

Apologies. I just realised that support for Mermaid.js is currently a Material for MkDocs Insiders feature and is not yet available on their main public GitHub repository: https://squidfunk.github.io/mkdocs-material/insiders/#available-features

jobindjohn commented 2 years ago

Hi @virtualarchitectures, a recent PR just handled something similar. Would you like to test it now?

jobindjohn / obsidian-publish-mkdocs

Mermaid diagram renders in Obsidian but not in MKDocs #7