图例

当图表中有多个 dataSeries 时，图例有助于使用预定义的符号和系列名称来识别每个 dataSeries。

![](/uploads/images/20221227/7b1ce5bea9dc101cf2e2e07849b46508.png)

### 显示/隐藏图例

```javascript
  legend: {
    show: false
  }
```

### 更改图例位置
有用于放置图例的预定义位置。

您可以将图例放在以下位置

- top
- right
- bottom
- left

图例位于顶部

```javascript
  legend: {
    position: 'top'
  }
```

![](/uploads/images/20221227/3f7f8439473e2a37c35d16399ae2a1f1.png)

### 图例对齐
#### 水平对齐图例
水平方向，您可以使用以下对齐图例

- center
- left
- right

图例水平右对齐

```javascript
  legend: {
    horizontalAlign: 'right',
  }
```

![](/uploads/images/20221227/96416fae53031a5d3d1726a69483d72d.png)

### 与图例互动
#### 单击时启用显示/隐藏 series
当用户单击图例时，与该图例相关联的 series 会在外观上切换。

```javascript
  legend: {
    onItemClick: {
      toggleDataSeries: true
    },
  }
```

#### 当图例悬停时突出显示 series
当用户将鼠标悬停在图例项上时，与该图例相关联的系列会突出显示，而所有其他 series 都会显示为灰色。

```javascript
  legend: {
    onItemHover: {
      highlightDataSeries: true
    },
  }
```

要为图例设置全局选项，应在Apex.legend
http://www.bixiaguangnian.com/manual/apexcharts/310.html
关于Legends的更多信息，请参考Legend配置