# Mermaid ベン図のチートシート

重なっている集合と、その共有領域。

## 集合

集合は名前と角括弧の中のラベルです。ラベルのない集合も描かれますが、名前はつきません。

```mermaid
venn-beta
  title Capability overlap
  set Core["Core renderer"]
  set Host["Host theme"]
  set Theme["Theme tokens"]
```

![Core renderer、Host theme、Theme tokens とラベルされた 3 つの円のベン図。](/diagrams/venn/sets.svg)

## 共有領域

union は 2 つ（または 3 つ）の集合の共通部分を名づけます。

```mermaid
venn-beta
  title Capability overlap
  set Core["Core renderer"]
  set Host["Host theme"]
  union Core,Host["Shared surface"]
```

![Core renderer と Host theme の 2 つの重なった円のベン図。重なりには Shared surface とラベルされています。](/diagrams/venn/union.svg)

## その裏にある値

集合のあとの数字がその値で、union のあとの同じ数字が重なり部分の値です。

```mermaid
venn-beta
  set Core["Core renderer"]:10
  set Host["Host theme"]:8
  union Core,Host["Shared surface"]:3
```

![Core renderer と Host theme の重なった円、重なりに Shared surface のラベル。3 つとも数値を持っています。](/diagrams/venn/values.svg)

## Mernyx で描いてみる

.mmd ファイルを開いて、キャンバスでノードを動かしてみてください。ソースコードもついてきます。macOS ネイティブで、ブラウザは介在しません。