【echarts】实现折线图、柱状图转换为表格视图并导出excel

根据折线图、柱状图原有数据实现表格视图转换，然后再利用jquery.table2excel.js并实现excel导出，此示例需要引入jquery.table2excel.js类库，具体功能实现直接上代码~

jquery.table2exce.js下载地址

option:{
	 toolbox: {
          show: true,
            feature: {
                saveAsImage: {
                    show: true
                },
                dataView: { // 数据视图
                    show: true,
                    readOnly: false,
                    lang: [' ', '关闭', '导出Excel'],
                     optionToContent: function (opt) {
                        return chartToTable('table', '日期',  opt); //图形数据转成表格
                    },
                    contentToOption: function (opts) {
                        chartToTable('excel',  '导出文件名称');//表格导出
                    }
                },
            },
            top: 0,
            right: 15,
            itemSize: 20,//工具栏 icon 的大小
            emphasis: {//触发时
                iconStyle: {
                    borderWidth: 2,
                    borderColor: "#59d2d4",//图形的描边颜色
                }
            }
       },
}

/**
 * 图表数据转成表格
 * @param {String} chartType chart类型
 * @param {String} thName 表头第一列名称/文件名称
 * @param {Object} opt chart配置
 * */
function chartToTable(chartType, thName, opt){
    if(chartType === 'table'){  //根据option数据转换为表格
        var axisData = opt.xAxis[0].data; //坐标数据
        var series = opt.series; //折线图数据
        var legend = opt.legend[0].data;
        var th_width = 100 / (legend.length + 1) + '%';
        var tdHeads = ''+ thName +''; //表头第一列
        var tr = '', td = ''; //表数据
        //组装表头
        $.each(legend, function (index, value){
            tdHeads += '' + value + '';
        })
        //组装表数据
        for (var i = 0, l = axisData.length; i < l; i++) {
            for (var j = 0; j < series.length ; j++) {
                var temp = series[j].data[i];
                td += '' + (temp || '') + ' ';
            }
            tr += '' + axisData[i] + '' + td + '';
            td = '';
        }
        var table = '' +
            '' +
            '' + tdHeads + ' ' +
            ''+tr+'' +
            '';
        return table;
    }else if(chartType === 'excel'){ 
	    // 表格导出
        $("#tableExcel").table2excel({
            exclude: ".noExl", //过滤位置的 css 类名
            filename: thName, //文件名称
            name: thName,
            exclude_img: true,
            exclude_links: true,
            exclude_inputs: true
        });
    }
}