金字塔图表 html,echarts 金字塔

Title

var data = [[15, 0], [-50, 10], [-56.5, 20], [-46.5, 30], [-22.1, 40]];

var myChart = echarts.init(document.getElementById('main'));

myChart.setOption({

tooltip : {

trigger: 'axis',

axisPointer : { // 坐标轴指示器，坐标轴触发有效

type : 'shadow' // 默认为直线，可选为：'line' | 'shadow'

}

},

legend: {

data:['支出', '收入']

},

grid: {

left: '3%',

right: '4%',

bottom: '3%',

containLabel: true

},

xAxis : [

{

type : 'value',

axisLabel:{

formatter:function(value) {

return Math.abs(value);

}

}

}

],

yAxis : [

{

type : 'category',

axisTick : {show: false},

data : ['周一','周二','周三','周四','周五','周六','周日']

}

],

series : [

{

name:'收入',

type:'bar',

stack: '总量',

data:[320, 302, 341, 374, 390, 450, 420]

},

{

name:'支出',

type:'bar',

stack: '总量',

data:[-120, -132, -101, -134, -190, -230, -210]

}

]

});