# Mermaid 用户旅程图速查表

一条路径，每一步都带一个分数。

## 一条带分数的路径

任务是发生了什么，一个冒号，一个分数，再一个冒号，然后是发生在谁身上。

```mermaid
journey
    title Shopping trip
    section Store
        Browse shelf: 5: Customer
```

![一张用户旅程图，一个 Store 小节装着一个步骤 Browse shelf，一张脸表示 5 分，旁边写着 Customer。](/diagrams/journey/basic.svg)

## 分数是一张脸

冒号后的数字是这个人有多满意，从 1 到 5。

```mermaid
journey
    title Shopping trip
    section Store
        Browse shelf: 5: Customer
        Pay at till: 1: Customer
```

![一张用户旅程图，Store 小节里装着两个步骤，Browse shelf 打了 5 分，Pay at till 打了 1 分，各配一张脸。](/diagrams/journey/scores.svg)

## 不止一个人

分数后面的名字就是角色，用逗号分开。

```mermaid
journey
    title Shopping trip
    section Store
        Ask staff: 5: Customer, Staff
```

![一张用户旅程图，一个步骤 Ask staff，分数 5，两个角色点分别叫 Customer 和 Staff。](/diagrams/journey/actors.svg)

## 在 Mernyx 里画出来

打开一个 .mmd 文件，在画布上挪一个节点，源码跟着走。macOS 原生，不经过浏览器。