echart柱状图横向_echarts横向柱状图Demo

option ={

backgroundColor:‘black‘,

tooltip: {

trigger:‘axis‘,

backgroundColor:‘rgba(255,255,255,0.8)‘,

extraCssText:‘box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);‘,

textStyle: {

color:‘#6a717b‘,

},

},

grid: {

top:‘0.5%‘,

left:‘3%‘,

right:‘11%‘,

bottom:‘2.5%‘,

containLabel:true},

yAxis: [{

type:‘category‘,

data: [‘a‘, ‘b‘, ‘c‘, ‘d‘, ‘e‘, ‘f‘, ‘g3‘, ‘h‘, ‘i‘, ‘j‘],

inverse:true,

axisTick: {

alignWithLabel:true,

},

axisLabel: {

margin:10,

textStyle: {

fontSize:18,

color:‘white‘}

},

axisLine: {

lineStyle: {

color:‘#2548ac‘}

},

}],

xAxis: [{

type:‘value‘,

axisLabel: {

margin:10,

interval:1, //横轴信息全部显示

rotate: -30, //-15度角倾斜显示

textStyle: {

fontSize:18,

color:‘white‘,

}

},

axisLine: {

lineStyle: {

color:‘#192469‘}

},

splitLine: {

lineStyle: {

color:‘#17367c‘}

}

}],

series: [{

name:‘Top 10‘,

type:‘bar‘,

barWidth:26,

data: [8827896, 7472072, 7433391, 7137253, 6382192, 5268842, 4827026, 3935701, 3875562, 3839609],

label: {

normal: {

show:true,

position:‘insideRight‘,

textStyle: {

color:‘blue‘, //color of value

fontSize: 18,

}

}

},

itemStyle: {

normal: {

color:new echarts.graphic.LinearGradient(0, 0, 1, 0, [{

offset:0,

color:‘#0590eb‘ //0% 处的颜色

}, {

offset:1,

color:‘#08e3f1‘ //100% 处的颜色

}], false),

barBorderRadius: [0, 15, 15, 0],

shadowColor:‘rgba(0,0,0,0.1)‘,

shadowBlur:3,

shadowOffsetY:3}

}

}]

};