jupyter中使用```mermaid graph TD A[前馈神经网络] --> B[浅层网络] A --> C[深度前馈网络] C --> D[多层感知机MLP] C --> E[其他深度变体如全连接DNN] ```的方法?
时间: 2025-03-25 08:01:24 浏览: 135
### 如何在 Jupyter Notebook 中使用 Mermaid 绘制图示或流程图
要在 Jupyter Notebook 中使用 Mermaid 来绘制图示或流程图,可以借助 `mermaid` 扩展或者通过 HTML 的方式嵌入 Mermaid 语法。以下是具体方法:
#### 方法一:安装并加载 `jupyter_contrib_nbextensions`
1. 安装扩展包
使用以下命令安装 `jupyter_contrib_nbextensions` 和其依赖项:
```bash
pip install jupyter_contrib_nbextensions
jupyter contrib nbextension install --user
```
2. 启用 Mermaid 支持
运行以下命令启用 Mermaid 插件:
```bash
jupyter nbextension enable mermaid/mermaid
```
3. 编写 Mermaid 图表代码
在单元格中直接编写 Mermaid 语法即可渲染图表。例如:
```mermaid
graph TD;
A[Christmas] -->|Get money| B(Go shopping);
B --> C{Let me think};
C -->|One| D[Yello];
C -->|Two| E[Blue];
C -->|Three| F[Red];
```
此方法利用了 Jupyter 的插件机制[^1]。
#### 方法二:通过 HTML 嵌入 Mermaid
如果不想安装额外的扩展,可以直接在 Notebook 单元格中引入 Mermaid 库并通过 HTML 渲染图表。
1. 加载 Mermaid JavaScript 文件
创建一个新的代码单元格,并运行以下代码以加载 Mermaid 脚本:
```javascript
%%html
<script src="https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.min.js"></script>
<script>mermaid.initialize({startOnLoad:true});</script>
```
2. 编写 Mermaid 图表代码
接下来,在另一个 Markdown 或 Raw NBConvert 单元格中输入 Mermaid 代码块。例如:
```markdown
```mermaid
sequenceDiagram
participant Alice
participant Bob
Alice->John: Hello John, how are you?
loop Healthcheck
John->John: Fight against hypochondria
end
Note right of John: Rational thoughts <br/>prevail...
John-->>Alice: Great!
John->Bob: How about you?
Bob-->>John: Jolly good!
```
```
这种方法无需安装任何 Python 包,仅需加载外部脚本即可实现功能。
```python
from IPython.display import display, HTML
# 动态加载 Mermaid 并显示图表
display(HTML("""
<script src="https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.min.js"></script>
<div class="mermaid">
graph TD;
A[Start] --> B{Decision};
B -->|Yes| C[Action];
B -->|No| D[End];
</div>
"""))
```
以上两种方法都可以有效地支持 Mermaid 图形化表示的需求。
---
阅读全文
相关推荐
















