echarts如何显示多个柱形图_使用echarts画多维柱状图

前言

在此之前，已经跟大家分享了如何使用echarts画折线图、双折线图、柱状图，今天跟大家分享一下使用echarts画多维柱状图。

使用echarts遇到过的坑：

一定要给图表容器添加宽度与高度。

图表在容器中可以调整位置，让图表显示的更完整。

1.引入相关js

2.确定容器

3.定义画多维柱状图的方法，配置图表参数

/**

* 画多维柱状图

* @param container 容器

* @param titleName 标题名称

* @param legendData 菜单列表

* @param xData x轴数据

* @param seriesDatas 多维图表数据

*/

function drawManyBar(container, titleName, legendData, xData, seriesDatas) {

var ticket = echarts.init(document.getElementById(container));

ticketOption = {

//标题样式

title : {

text : titleName,

textStyle : {

color : 'white',

},

left : 'left'

},

//提示框

tooltip : {

trigger : 'axis',

backgroundColor : 'gray',

axisPointer : {

type : 'shadow'

},

//提示信息格式，支持html样式

formatter : function(params) {

var res = '

';

res += '