echarts实现2d柱状_Echart---多项柱状图-2D/H5

//摘自官方示例；

具体参数配置：https://echarts.baidu.com/option.html#title

多看必有收获！

// 柱状图

var dom = document.getElementById("container");

var myChart = echarts.init(dom);

var app = {};

option = null;

var posList = [

'left', 'right', 'top', 'bottom',

'inside',

'insideTop', 'insideLeft', 'insideRight', 'insideBottom',

'insideTopLeft', 'insideTopRight', 'insideBottomLeft', 'insideBottomRight'

];

app.configParameters = {

rotate: {

min: -90,

max: 90

},

align: {

options: {

left: 'left',

center: 'center',

right: 'right'

}

},

verticalAlign: {

options: {

top: 'top',

middle: 'middle',

bottom: 'bottom'

}

},

position: {

options: echarts.util.reduce(posList, function (map, pos) {

map[pos] = pos;

return map;

}, {})

},

distance: {

min: 0,

max: 10

}

};

app.config = {

rotate: 90,

align: 'left',

verticalAlign: 'middle',

position: 'insideBottom',

distance: 15,

onChange: function () {

var labelOption = {

normal: {

rotate: app.config.rotate,

align: app.config.align,

verticalAlign: app.config.verticalAlign,

position: app.config.position,

distance: app.config.distance

}

};

myChart.setOption({

series: [{

label: labelOption

}, {

label: labelOption