echarts 横向直方图右侧bar标签更改
时间: 2023-05-25 19:02:48 浏览: 60
您可以使用ECHARTS中的label formatter选项来更改横向直方图上方的bar标签。
以下是一个示例:
```javascript
option = {
xAxis: {
type: 'value'
},
yAxis: {
type: 'category',
data: ['A', 'B', 'C', 'D', 'E']
},
series: [
{
name: 'bar',
type: 'bar',
data: [50, 30, 60, 70, 80],
label: {
show: true,
position: 'right',
formatter: function (param) {
return param.data + '%'; //在bar标签后添加%符号
}
}
}
]
};
```
在此示例中,我们可以看到:
- 在y轴上,我们有五个类别(A、B、C、D和E)。
- 在x轴上,我们有一个值轴,显示从0到最大值的数据点。
- series中的data数组包含与每个类别对应的相应数据值。
- label选项用于设置bar标签的位置和格式。
通过设置label formatter函数,我们可以将每个bar标签的值转换为一个带有%符号的字符串。在这个例子中,该函数返回param.data的值并在其后添加%符号。这应该会在每个bar的上方显示一个带有百分比值的标签。
请注意,此示例在y轴上定义了类别,因为这是一种横向图表。如果您使用的是纵向图表,则应该在x轴上定义类别。