Echarts在线免费图表

 
            var list = [
                {value: -0.07, label: {  position: 'top'}},
                {value: -0.09, label:  {  position: 'top'}},
                {value: 0.2, label:  {  position: 'bottom'}},
                {value: 0.44, label:  {  position: 'bottom'}},
                {value: -0.23, label:  {  position: 'top'}},
                {value: 0.08, label:  {  position: 'bottom'}},
                {value: -0.17, label:  {  position: 'top'}},
                {value: 0.47, label:  {  position: 'bottom'}},
                {value: -0.36, label:  {  position: 'top'}},
                {value: 0.18, label:  {  position: 'bottom'}}
            ]
option = {
    grid: {
        top: 80,
        bottom: 30
    },
    yAxis: {
             show: false,
        type : 'value',
        position: 'top',
        splitLine: {lineStyle:{type:'dashed'}},
    },
    xAxis: {
        type : 'category',
        axisLine: {show: false},
        axisLabel: {show: false},
        axisTick: {show: false},
        splitLine: {show: false},
        data : ['ten', 'nine', 'eight', 'seven', 'six', 'five', 'four', 'three', 'two', 'one']
    },
    series : [
        {
            name:'生活费',
            type:'bar',
            stack: '总量',
            label: {
                normal: {
                    show: true,
                    formatter: '{b}'
                }
            },
            data:list,
         itemStyle: {
          normal: {
            color: function (params) {
              console.log(params)
              if (params.value > 0) {
                return '#FA243B'
              } else {
                return '#00D176'
              }
            }
          }
        }
        },
        {
          type: 'bar',
          data:[
                {value: -0.07, label:  {  position: 'bottom'}},
                {value: -0.09, label:  {  position: 'bottom'}},
                {value: 0.2, label: {  position: 'top'}},
                {value: 0.44, label: {  position: 'top'}},
                {value: -0.23, label:  {  position: 'bottom'}},
                {value: 0.08, label: {  position: 'top'}},
                {value: -0.17, label:  {  position: 'bottom'}},
                {value: 0.47, label: {  position: 'top'}},
                {value: -0.36, label:  {  position: 'bottom'}},
            {value: 0.18, label: {  position: 'top'}}
            ],
          barGap:'-100%',//移动第二个柱子的位置实现重叠
          z:'-1',//改变这根柱子的层级使这根柱子在下面
          label: {
              normal: {
                  show: true,
              },
          },
        }
    ]
};