echart如何显示柱状图数值
时间: 2023-11-07 18:25:59 浏览: 158
在 ECharts 中,可以通过设置 `label` 属性来显示柱状图的数值。具体来说,可以设置 `label.show` 为 `true`,并设置 `label.position` 来控制数值的位置。
例如,下面的代码可以在柱状图的顶部显示数值:
```javascript
option = {
// ... 其他配置 ...
series: [{
type: 'bar',
data: [10, 20, 30, 40],
label: {
show: true,
position: 'top'
}
}]
};
```
除了 `top`,`label.position` 还支持其他位置,例如 `inside`、`insideTop`、`insideBottom`、`insideLeft`、`insideRight` 等。
另外,如果希望自定义数值的显示格式,可以在 `label.formatter` 中设置格式化函数。例如,下面的代码可以将数值显示为带有千位分隔符的格式:
```javascript
option = {
// ... 其他配置 ...
series: [{
type: 'bar',
data: [1000, 2000, 3000, 4000],
label: {
show: true,
position: 'top',
formatter: function(value) {
return value.toLocaleString();
}
}
}]
};
```
阅读全文