echarts生成三维柱状图

这里介绍下如何生成三维的柱状图，例如，按照月份展示两个产品在2010年和2011年的统计数量，这里x轴标识月份，一根柱子代表一年的几个产品，这里是两年两个产品的示例，多个年数或产品同样的方法，不在赘述。

以下是核心代码部分，主要利用了堆叠柱状图的思想，然后再通过stack属性对产品进行分类，最后再format tooltips展示

option = {
    tooltip: {
        trigger: 'axis',
       formatter: function (params,ticket,callback) {
            // console.log(params)
            var res = '2010年' + params[0].name + ':';
            var res1 = '
2011年' + params[0].name+ ':';
            for (var i = 0, l = params.length; i < l; i++) {
                if(i === 2) {
                    res += res1 + '
' + params[i].seriesName + ' : ' + params[i].value
                } else {
                  res += '
' + params[i].seriesName + ' : ' + params[i].value;
                }
            }
            // console.log(res)
            return res;
        }
    },
    legend: {
        data: ['产品一', '产品二']
    },
    grid: {
        left: '3%',
        right: '4%',
        bottom: '3%',
        containLabel: true
    },
    xAxis: [
        {
            type: 'category',
            data: ['一月','二月','三月','四月','五月','六月','七月','八月','九月','十月','十一月','十二月']
        }
    ],
    yAxis: [
        {
            type: 'value'
        }
    ],
    series: [
       {
        name: '产品一',
        stack: '2010',
        type: 'bar',
        data: [320, 332, 301, 334, 390, 330, 320,120, 132, 101, 134, 290, 230, 220]
      },
      {
        name: '产品二',
        stack: '2010',
        type: 'bar',
        data: [220, 182, 191, 234, 290, 330, 310,62, 82, 91, 84, 109, 110, 120]
      },
      {
        name: '产品一',
        stack: '2011',
        type: 'bar',
        data: [120, 132, 101, 134, 290, 230, 220,320, 332, 301, 334, 390, 330, 320]
      },
      {
        name: '产品二',
        stack: '2011',
        type: 'bar',
        data: [62, 82, 91, 84, 109, 110, 120,220, 182, 191, 234, 290, 330, 310]
      }    
    ]
};

小伙伴如果有疑问可以第一时间评论或留言，看到后也会及时回复的，有帮助的麻烦动动手指点个赞哟！