如何在 Mermaid 的“类图”中设置“命名空间”的样式？

Question

在 Mermaid 中，我们可以将诸如

EnumMap

之类的类定义为类图中的对象。

class EnumMap { }

我们可以使用

style

命令设置该对象的样式。

style EnumMap color : SeaGreen

此外，我们可以将多个对象分组在一个框中，称为命名空间。

namespace special {
    class EnumMap { }
    class TreeMap { }
}

这会导致在这些对象周围绘制一个框。那个盒子有一条细黑线。

👉🏽 如何将该线的颜色更改为黑色以外的颜色？如何填写“命名空间”框？

Answer 1

美人鱼类图的样式选项似乎仅适用于节点，而不适用于名称空间。

但是，对生成的 SVG 的分析表明，代表命名空间的

<rect>

嵌入在

<g id="special">

中。这允许您使用附加 CSS 规则覆盖其属性（类似于 ER 图中实体或属性的美人鱼风格颜色/填充/描边）：

<script type="module" src="https://cdn.jsdelivr.net/npm/mermaid@10/dist/mermaid.esm.min.mjs"></script>
<pre class="mermaid">
---
config:
  themeCSS: |
    #special rect {
      stroke: red !important;
      fill: yellow !important;
    }
---
classDiagram
  namespace special {
    class EnumMap { }
    class TreeMap { }
  }
</pre>