echarts导出数据到excel表格兼容所有浏览器

插件table2excel.js,将table转成excel,兼容所有的游览器,下载地址:https://github.com/rainabba/jquery-table2excel
1.引用js

<script src="../js/jquery.min.js"></script>
<script src=../js/jquery.table2excel.js"></script>

2.echarts的代码

var option = {
								 toolbox:{
									 top:'10',
									 right:'30',
							         show: true,
							         itemSize: 25,//设置图标大小
							         feature: {
							             myTool1 : {
							                    show: true,
							                    title: '导出excel文件',
							                    icon: 'image://image/excel.png',
							                    onclick: function (){
							                      //    list   
						//	      [
                        //            ['product', '2015', '2016', '2017'],
                        //            ['Matcha Latte', 43.3, 85.8, 93.7],
                        //            ['Milk Tea', 83.1, 73.4, 55.1],
                        //            ['Cheese Cocoa', 86.4, 65.2, 82.5],
                        //            ['Walnut Brownie', 72.4, 53.9, 39.1]
                        //        ]
							                   		var headData = list;
							                     	var table = '<table id="tableExcel_Day" style="width:100%;text-align:center;"><tbody><tr><th colspan=4>报错统计表</th></tr>';
							                     	for (var i = 0; i < headData.length; i++) {
								                    	var bodyData=headData[i];
								                     	table += '<tr>';
								                      	for(var j=0;j<bodyData.length;j++){
								                        	table += '<td>' + bodyData[j] + '</td>';
								                        }
									                    table += '</tr>';
								                    }
								                    table += '</tbody></table>';
								                    console.log(table);
								                    $('#xiazai').html(table);//这里是把table放入html文件的隐藏div中,好让table2excel插件获取
								                    //使用table2excel插件,用到table的id
								                    $("#tableExcel_Day").table2excel({
								                        exclude: ".noExl", //过滤位置的 css 类名
								                        filename: '报错统计' + ".xls", //文件名称
								                        name: "报错统计.xls",
								                        exclude_img: false,//是否排除图片
								                        exclude_links: true,
								                        exclude_inputs: true
								                       });
								                } 
							           		},
							           	saveAsImage : {show: true}
							    		}
									},
								tooltip : {
									trigger : 'axis',
									axisPointer : {
										type : 'shadow'
									}
								},
								color : [ "#F7B500", "#0263FF", "#24D17E" ]
								}

3.HTML文件中加入

<div style="display: none;" id="xiazai"></div>//构建table
<iframe id="txtArea1" name="txtArea1"  style="display:none"></iframe> //这里是为了支持ie9以下游览器,table2excel要求的,由于ie9以下游览器不支持Bold(),就用iframe的方式保存文件

注:导出表格中如需导出图片,table2excel仅支持http和https的图片
亲测有效,自己做的效果图

在这里插入图片描述
在这里插入图片描述

  • 0
    点赞
  • 6
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值