echarts.js的柱状图列名是显示echarts的属性值
时间: 2024-01-17 22:18:06 浏览: 78
柱状图的列名可以通过echarts的属性值来显示。下面是一个使用echarts.js绘制柱状图并显示列名的示例:
```javascript
// 引入echarts
import * as echarts from 'echarts';
// 初始化echarts实例
let myChart = echarts.init(document.getElementById('main'));
// 定义柱状图的数据
let data = [120, 200, 150, 80, 70];
// 定义柱状图的列名
let xAxisData = ['A', 'B', 'C', 'D', 'E'];
// 配置柱状图的选项
let option = {
xAxis: {
type: 'category',
data: xAxisData
},
yAxis: {
type: 'value'
},
series: [{
type: 'bar',
data: data
}]
};
// 使用配置项绘制柱状图
myChart.setOption(option);
```
在上面的示例中,我们通过定义xAxisData数组来设置柱状图的列名,然后将该数组作为xAxis的data属性值。这样就可以在柱状图上显示相应的列名。
相关问题
echarts.js统计图官网
ECharts.js是一个基于JavaScript的开源可视化库,它提供了丰富的可视化图表,包括折线图、柱状图、散点图、饼图、K线图、地图、热力图、关系图、treemap、平行坐标等。ECharts.js的官网为https://echarts.apache.org/zh/index.html,你可以在官网上找到详细的文档和示例,以及下载最新版本的ECharts.js库。同时,ECharts.js也提供了基于jQuery的扁平图形统计图表特效,可以在官网上找到相关的文档和示例。
阅读全文