导出图片和数据到Excel

简介: 导出图片和数据到Excel

/* eslint-disable */
     let idTmr
     const getExplorer = () => {
       let explorer = window.navigator.userAgent
       //ie
       if (explorer.indexOf('MSIE') >= 0) {
         return 'ie'
       }
       //firefox
       else if (explorer.indexOf('Firefox') >= 0) {
         return 'Firefox'
       }
       //Chrome
       else if (explorer.indexOf('Chrome') >= 0) {
         return 'Chrome'
       }
       //Opera
       else if (explorer.indexOf('Opera') >= 0) {
         return 'Opera'
       }
       //Safari
       else if (explorer.indexOf('Safari') >= 0) {
         return 'Safari'
       }
     }
     // 判断浏览器是否为IE
     const exportToExcel = (data, name) => {
       // 判断是否为IE
       if (getExplorer() == 'ie') {
         tableToIE(data, name)
       } else {
         tableToNotIE(data, name)
       }
     }
     const Cleanup = () => {
       window.clearInterval(idTmr)
     }
     // ie浏览器下执行
     const tableToIE = (data, name) => {
       let curTbl = data
       let oXL = new ActiveXObject('Excel.Application')
       //创建AX对象excel
       let oWB = oXL.Workbooks.Add()
       //获取workbook对象
       let xlsheet = oWB.Worksheets(1)
       //激活当前sheet
       let sel = document.body.createTextRange()
       sel.moveToElementText(curTbl)
       //把表格中的内容移到TextRange中
       sel.select
       //全选TextRange中内容
       sel.execCommand('Copy')
       //复制TextRange中内容
       xlsheet.Paste()
       //粘贴到活动的EXCEL中
       oXL.Visible = true
       //设置excel可见属性
       try {
         let fname = oXL.Application.GetSaveAsFilename(
           'Excel.xls',
           'Excel Spreadsheets (*.xls), *.xls'
         )
       } catch (e) {
         print('Nested catch caught ' + e)
       } finally {
         oWB.SaveAs(fname)
         oWB.Close((savechanges = false))
         //xls.visible = false;
         oXL.Quit()
         oXL = null
         // 结束excel进程,退出完成
         window.setInterval('Cleanup();', 1)
         idTmr = window.setInterval('Cleanup();', 1)
       }
     }
     // 非ie浏览器下执行
     const tableToNotIE = (function () {
       // 编码要用utf-8不然默认gbk会出现中文乱码
       let uri = 'data:application/vnd.ms-excel;base64,',
         template =
           '<html xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:x="urn:schemas-microsoft-com:office:excel" xmlns="http://www.w3.org/TR/REC-html40"><head><meta charset="UTF-8"><!--[if gte mso 9]><xml><x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet><x:Name>{worksheet}</x:Name><x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions></x:ExcelWorksheet></x:ExcelWorksheets></x:ExcelWorkbook></xml><![endif]--></head><body><table>{table}</table></body></html>',
         base64 = function (s) {
           return window.btoa(unescape(encodeURIComponent(s)))
         },
         format = (s, c) => {
           return s.replace(/{(\w+)}/g, (m, p) => {
             return c[p]
           })
         }
       return (table, name) => {
         let ctx = {
           worksheet: name,
           table
         }
         //创建下载
         let link = document.createElement('a')
         link.setAttribute('href', uri + base64(format(template, ctx)))
         link.setAttribute('download', name)
         // window.location.href = uri + base64(format(template, ctx))
         link.click()
       }
     })()
   // tHeader和tbody的数据需要一一对应
   let tHeader = ["车名", "颜色", "照片"];
   let tbody = [
     {
       name: "林肯",
       color: "红色",
       pic: "https://img2.baidu.com/it/u=4020335929,583313623&fm=253&fmt=auto&app=138&f=JPEG?w=512&h=384",
     },
     {
       name: "林肯",
       color: "黄色",
       pic: "https://img1.baidu.com/it/u=1453715177,1769663341&fm=253&fmt=auto&app=120&f=JPEG?w=750&h=500",
     },
     {
       name: "林肯",
       color: "紫色",
       pic: "https://img1.baidu.com/it/u=1453715177,1769663341&fm=253&fmt=auto&app=120&f=JPEG?w=750&h=500",
     },
     {
       name: "林肯",
       color: "白色",
       pic: "https://img2.baidu.com/it/u=647676637,3137806543&fm=253&fmt=auto&app=120&f=JPEG?w=889&h=500",
     },
     {
       name: "林肯",
       color: "粉色",
       pic: "https://img0.baidu.com/it/u=2950100227,2008423144&fm=253&fmt=auto&app=120&f=JPEG?w=830&h=467",
     },
   ];
   const export2Excel = (theadData, tbodyData, dataname) => {
     let re = /http/; // 字符串中包含http,则默认为图片地址
     let th_len = theadData.length; // 表头的长度
     let tb_len = tbodyData.length; // 记录条数
     let width = 120; // 设置图片大小
     let height = 80;
     // 添加表头信息
     let thead = "<thead><tr>";
     for (let i = 0; i < th_len; i++) {
       thead += "<th>" + theadData[i] + "</th>";
     }
     thead += "</tr></thead>";
     // 添加每一行数据
     let tbody = "<tbody>";
     for (let i = 0; i < tb_len; i++) {
       tbody += "<tr>";
       let row = tbodyData[i]; // 获取每一行数据
       for (let key in row) {
         if (re.test(row[key])) {
           // 如果为图片,则需要加div包住图片
           //
           tbody +=
             '<div style="width:' +
             width +
             "px; height:" +
             height +
             'px; text-align: center; vertical-align: middle"><div style="display:inline"><img src=\'' +
             row[key] +
             "' " +
             " " +
             "width=" +
             '"' +
             width +
             '"' +
             " " +
             "height=" +
             '"' +
             height +
             '"' +
             "></div></div>";
         } else {
           tbody += '<div style="text-align:center">' + row[key] + "</div>";
         }
       }
       tbody += "</tr>";
     }
     tbody += "</tbody>";
     let table = thead + tbody;
     // 导出表格
     exportToExcel(table, dataname);
   };
   //
   const app = document.querySelector("#app");
   console.log(app, "app");
   app.onclick = function () {
     export2Excel(tHeader, tbody, '测试数据')
   };
相关文章
|
11月前
|
数据采集 数据可视化 数据挖掘
用 Excel+Power Query 做电商数据分析:从 “每天加班整理数据” 到 “一键生成报表” 的配置教程
在电商运营中,数据是增长的关键驱动力。然而,传统的手工数据处理方式效率低下,耗费大量时间且易出错。本文介绍如何利用 Excel 中的 Power Query 工具,自动化完成电商数据的采集、清洗与分析,大幅提升数据处理效率。通过某美妆电商的实战案例,详细拆解从多平台数据整合到可视化报表生成的全流程,帮助电商从业者摆脱繁琐操作,聚焦业务增长,实现数据驱动的高效运营。
|
11月前
|
Python
将Excel特定某列数据删除
将Excel特定某列数据删除
|
11月前
|
Python
如何根据Excel某列数据为依据分成一个新的工作表
在处理Excel数据时,我们常需要根据列值将数据分到不同的工作表或文件中。本文通过Python和VBA两种方法实现该操作:使用Python的`pandas`库按年级拆分为多个文件,再通过VBA宏按班级生成新的工作表,帮助高效整理复杂数据。
|
11月前
|
Python
Excel中如何批量重命名工作表与将每个工作表导出到单独Excel文件
本文介绍了如何在Excel中使用VBA批量重命名工作表、根据单元格内容修改颜色,以及将工作表导出为独立文件的方法。同时提供了Python实现导出工作表的代码示例,适用于自动化处理Excel文档。
|
存储 安全 大数据
网安工程师必看!AiPy解决fscan扫描数据整理难题—多种信息快速分拣+Excel结构化存储方案
作为一名安全测试工程师,分析fscan扫描结果曾是繁琐的手动活:从海量日志中提取开放端口、漏洞信息和主机数据,耗时又易错。但现在,借助AiPy开发的GUI解析工具,只需喝杯奶茶的时间,即可将[PORT]、[SERVICE]、[VULN]、[HOST]等关键信息智能分类,并生成三份清晰的Excel报表。告别手动整理,大幅提升效率!在安全行业,工具党正碾压手动党。掌握AiPy,把时间留给真正的攻防实战!官网链接:https://www.aipyaipy.com,解锁更多用法!
|
分布式计算 Hadoop 大数据
从Excel到Hadoop:数据规模的进化之路
从Excel到Hadoop:数据规模的进化之路
429 10
|
存储 Java easyexcel
招行面试:100万级别数据的Excel,如何秒级导入到数据库?
本文由40岁老架构师尼恩撰写,分享了应对招商银行Java后端面试绝命12题的经验。文章详细介绍了如何通过系统化准备,在面试中展示强大的技术实力。针对百万级数据的Excel导入难题,尼恩推荐使用阿里巴巴开源的EasyExcel框架,并结合高性能分片读取、Disruptor队列缓冲和高并发批量写入的架构方案,实现高效的数据处理。此外,文章还提供了完整的代码示例和配置说明,帮助读者快速掌握相关技能。建议读者参考《尼恩Java面试宝典PDF》进行系统化刷题,提升面试竞争力。关注公众号【技术自由圈】可获取更多技术资源和指导。
|
数据采集 数据可视化 数据挖掘
利用Python自动化处理Excel数据:从基础到进阶####
本文旨在为读者提供一个全面的指南,通过Python编程语言实现Excel数据的自动化处理。无论你是初学者还是有经验的开发者,本文都将帮助你掌握Pandas和openpyxl这两个强大的库,从而提升数据处理的效率和准确性。我们将从环境设置开始,逐步深入到数据读取、清洗、分析和可视化等各个环节,最终实现一个实际的自动化项目案例。 ####
2765 10
|
前端开发
实现Excel文件和其他文件导出为压缩包,并导入
实现Excel文件和其他文件导出为压缩包,并导入
407 1
|
数据处理 Python
Python实用记录(十):获取excel数据并通过列表的形式保存为txt文档、xlsx文档、csv文档
这篇文章介绍了如何使用Python读取Excel文件中的数据,处理后将其保存为txt、xlsx和csv格式的文件。
882 3
Python实用记录(十):获取excel数据并通过列表的形式保存为txt文档、xlsx文档、csv文档