Markdown 在减价中更改美人鱼主题

除了代码之外，我还在我的降价文档中使用mermaid进行基本的图表渲染。我发现在预览时编辑这个很有用。这建议更改主题（默认和forest works）

---

复制粘贴到降价文档时，如何设置主题

呈现SVG时嵌入了主题，目前似乎在使用markdown时不支持自定义主题设置。

我正在寻找与您相同的主题，因此在查看并深入挖掘后，可以找到以下代码片段：

for (const themeName of ['default', 'forest', 'dark', 'neutral']) {
  themes[themeName] = require(`./themes/${themeName}/index.scss`)
}

因此，在编辑器中进行测试后，这些主题运行良好：

• 违约
• 森林
• 黑暗的
• 中立的

如果要构建自定义主题，您可以在此处找到它们的主题：

如果转到，可以将主题更改为上述主题：

---

不知道如何从降价中产生输出——我使用，并添加了美人鱼支持，如所述

经过一些尝试和错误配置后，我发现使用Cloudflare的CDN，可以将MermaidJS的旧版本与另一个CSS结合起来。通过这种方式，我能够使用中性样式呈现图表：

markdown_extensions:
  - pymdownx.superfences:
      custom_fences:
        - name: mermaid
          class: mermaid
          format: !!python/name:pymdownx.superfences.fence_div_format

extra_css:
  - https://cdnjs.cloudflare.com/ajax/libs/mermaid/7.0.9/mermaid.neutral.css
extra_javascript:
  - https://cdnjs.cloudflare.com/ajax/libs/mermaid/7.0.9/mermaid.min.js

---

据我所知，设置主题的唯一机会是初始化：

 mermaid.initialize({
      theme: 'forest',
      logLevel: 1,
      flowchart: { curve: 'linear' },
    });

---

如果复制文档中的详细信息，请修改并添加

！重要信息

每次更改CSS属性后，它将优先于Mermaid复制到SVG中的内联样式。远非理想，但复制美人鱼的风格也是如此，因此这是一个“用火救火”的解决方案。

可以在降价文档中为每个人物更改主题

以下是一个示例（使用Mkdocs的材料进行测试）：

结果将是：

---

不幸的是，这似乎是事实，默认主题是所有可用主题中最丑陋的一个。@phifi:请参阅我在“我使用上一个美人鱼版本并加上降价”下的评论，并可以选择主题（“中性”与我们的MkDocs材质文档的其余部分非常匹配）还没有完全回答thx提出的挖掘问题。这是我在谷歌上搜索“美人鱼js主题”的问题的答案。谢谢。我最终下载了最新版本（），查找

主题：“默认”

，将其替换为

主题：“森林”

，并将js保存到本地，例如

js/mermaid.min.js

。它工作得很好，我可以用上一个版本。很好。是否有一种方法可以一次修改所有图表？是的，但在

mkdocs.yml

中，请参阅其他文章。您还可以设置一个jinja变量并将其注入mermaid代码段。谢谢您的回答。您知道mkdocs参数是什么样子的吗？对不起，我还没有找到任何信息。其他帖子似乎引用了较旧的美人鱼版本。如：用

-mermaid2:\n参数替换
-mermaid2
。\n主题：“森林”\n流程图：{curve:'basis'}

（同时保留缩进，并用回车替换每个

\n

）。

This graph uses the forest theme:

``` mermaid
%%{init: {'theme': 'forest', "flowchart" : { "curve" : "basis" } } }%%
graph LR
A[Foo] --> B[Bar]
B --> A
```

That one uses the neutral theme:

``` mermaid
%%{init: {'theme': 'neutral' } }%%
graph LR
A[Foo] --> B[Bar]
B --> C[Baz]
```