---
url: /chart/horizontal-bar.md
---
# 条形图 horizontal-bar

柱状图的横向变体：柱子横过来，类目轴在纵向。**类目名很长**（渠道名、组织名、接口名）或类目多时，比竖柱易读得多。

## 何时使用

* 类目标签长、竖排会互相挤压；
* 类目多（10-30 个）需要纵向滚动浏览；
* 关注数值排序时，先按数值排序再传入效果最好。

## 示例

数据模型与柱状图完全一致，`type` 换成 `horizontal-bar`，类目自下而上排——第一个 `label` 在最下方。

### 年度报销排行

行政与财务的年度对账图：谁报销最多一目了然，长部门名横向摆放不挤压——排序传入后就是一张现成的「花钱排行榜」。

### 持仓收益排行

基金持仓的体检图：每只基金今年赚了多少、亏了多少，按收益排序横向铺开——正负着色一眼分清哪些该拿哪些该换。

## 配置要点

* 建议传入前按数值排序，读图成本最低；排行榜想要最大值在最上面，按升序传入即可（类目自下而上排）；
* 多系列分组、堆叠语义与竖向柱状图一致（数据多组自动分组）；
* 长列表配合 `dataZoom` 做窗口浏览，见[交互与联动](/chart/interaction)。

## 相关

* [柱状图](/chart/bar) · [子弹图](/chart/bullet)（带目标线的横向条）
* [API 参考](/chart/api)