echarts排序柱状图
时间: 2023-07-21 20:39:46 浏览: 114
要制作echarts排序柱状图,可以按照以下步骤进行:
1. 准备数据:将需要排序的数据按照需要的顺序排序好,并将数据存放到一个数组中。
2. 配置echarts:在echarts的配置中,设置x轴为类目轴,y轴为值轴,并设置柱状图的样式。在系列中,将数据按照需要的顺序进行排序,并将排序后的数据传入到系列中。
3. 渲染图表:使用echarts提供的方法渲染图表。
以下是一个简单的示例代码:
```javascript
// 准备数据
var data = [30, 50, 20, 80, 60];
// 配置echarts
var option = {
xAxis: {
type: 'category',
data: ['A', 'B', 'C', 'D', 'E']
},
yAxis: {
type: 'value'
},
series: [{
data: data.sort(function(a, b){return a-b}),
type: 'bar'
}]
};
// 渲染图表
var myChart = echarts.init(document.getElementById('myChart'));
myChart.setOption(option);
```
在上面的示例代码中,我们将需要排序的数据存储在了一个数组中,并按照从小到大的顺序进行排序。在echarts的配置中,我们将x轴设置为类目轴,y轴设置为值轴,并将数据按照需要的顺序进行排序,并将排序后的数据传入到系列中。最后,使用echarts提供的方法渲染图表。
阅读全文